![PNG circle](plot.png)
PNG Graphics ============<img src="plot.png"/>Pros : * You can produce **any** R plot Cons : * The graphic is **static** * Raster graphics **do not scale** SVG Graphics ============ ```r svg("plot.svg") print(latticePlot) dev.off() ```
![SVG plot](graphic.svg)
SVG Graphics ============<img src="plot.svg"/>Pros : * You can produce **any** R plot * Vector graphics **scale** Cons : * The graphic is **static** * You are **limited to R graphics concepts** gridSVG Graphics ================ ```r library(gridSVG) ``` ```r gridsvg("gridsvg-plot.svg", prefix="gridsvg-") print(latticePlot) dev.off() ``` gridSVG Graphics ================
<img src="gridsvg-plot.svg"/>Cons : * You can only produce **graphics based on grid** Pros : * Vector graphics **scale** * You have access to **SVG concepts** R Graphics ==========
![R Graphics](Rgraphics.svg)
gridSVG: Only grid-based output ================ ```r png("graphics.png") plot(mpg ~ disp, mtcars) dev.off() ```![PNG circle](graphics.png)
gridSVG: Only grid-based output ================ ```r gridsvg("graphics.svg") plot(mpg ~ disp, mtcars) dev.off() ``` gridSVG: The grid Display List ======= ```r gridsvg("gridsvg-plot.svg", prefix="gridsvg-") print(latticePlot) dev.off() ``` gridSVG: The grid Display List ======= A grid-based plot ... ```r print(latticePlot) grid.ls() ``` ``` plot_01.background plot_01.main plot_01.xlab plot_01.ylab plot_01.ticks.top.panel.1.1 plot_01.ticks.left.panel.1.1 plot_01.ticklabels.left.panel.1.1 plot_01.ticks.bottom.panel.1.1 plot_01.ticklabels.bottom.panel.1.1 plot_01.ticks.right.panel.1.1 plot_01.xyplot.points.panel.1.1 plot_01.border.panel.1.1 ``` gridSVG: The grid Display List ======= ```r gridsvg("grid-edit.svg", prefix="grid-edit-") print(latticePlot) grid.edit("lab", grep=TRUE, global=TRUE, gp=gpar(col="grey60")) grid.remove("top|right", grep=TRUE, global=TRUE) dev.off() ``` gridSVG Graphics ================<img src="gridsvg-plot.svg"/>Cons : * You can only produce **graphics based on grid** Pros : * Vector graphics **scale** * You have access to **SVG concepts** R Graphics ==========
![R Graphics](Rgraphics.svg)
SVG concepts: Tooltips ================ ```r gridsvg("tooltip.svg", prefix="tooltip-") print(latticePlot) grid.garnish("points", grep=TRUE, group=FALSE, title=paste("x =", mtcars$disp, " y =", mtcars$mpg)) dev.off() ``` SVG concepts: Hyperlinks ======== ```r gridsvg("hyperlink.svg", prefix="hyperlink-") print(latticePlot) grid.hyperlink("plot_01.main", href="mtcars.html") dev.off() ``` SVG concepts: Hyperlinks ======== SVG concepts: Hyperlinks ======== SVG concepts: Animation ======== ```r gridsvg("animate.svg", prefix="animate-") print(latticePlot) grid.animate("plot_01.xyplot.points.panel.1.1", group=FALSE, "stroke-opacity"=0:1, "fill-opacity"=c(0, .2), duration=mtcars$mpg) dev.off() ``` SVG concepts: Animation ============ SVG concepts: Gradient Fills ======== ```r gridsvg("gradient-demo.svg", prefix="gradient-demo-") grid.circle(r=.4, name="circ") gradient <- radialGradient(c("white", "blue", "black"), fx=.3, fy=.7) grid.gradientFill("circ", gradient) dev.off() ``` SVG concepts: Gradient Fills ======== ```r gridsvg("gradient.svg", prefix="gradient-") print(latticePlot) registerGradientFill("specular", gradient) grid.gradientFill("points", grep=TRUE, group=FALSE, label=rep("specular", nrow(mtcars))) dev.off() ``` SVG concepts: Gradient Fills ======== SVG concepts: Gradient Fills ======== SVG concepts: Pattern Fills ======== ```r gridsvg("pattern-demo.svg", prefix="pattern-demo-") grid.circle(r=.4, gp=gpar(fill="grey")) dev.off() ``` SVG concepts: Pattern Fills ======== ```r barplot <- barchart(table(mtcars$gear), par.settings=list(background=list(col="grey90"))) ``` SVG concepts: Pattern Fills ======== ```r gridsvg("pattern.svg", prefix="pattern-") print(barplot) pattern <- pattern(circleGrob(r=.4, gp=gpar(fill="grey")), width=.05, height=.05) registerPatternFill("circles", pattern) grid.patternFill("rect", grep=TRUE, group=FALSE, label=rep("circles", 3)) dev.off() ``` SVG concepts: Pattern Fills ======== SVG concepts: Filters ======== ```r gridsvg("filter.svg", prefix="filter-") print(latticePlot) blur <- filterEffect(feGaussianBlur(sd=1)) grid.filter("main|lab|tick|border", grep=TRUE, global=TRUE, blur) dev.off() ``` SVG concepts: Filters ======== SVG concepts: Clipping Paths ============ ```r circles <- circleGrob(r=c(.45, .2), gp=gpar(col=NA, fill=c("grey", "white"))) ``` SVG concepts: Clipping Paths ============ ```r gridsvg("plot-clip.svg", prefix="clip-") cp <- clipPath(circles) pushClipPath(cp) print(latticePlot, newpage=FALSE) dev.off() ``` SVG concepts: Clipping Paths ============ SVG concepts: Clipping Paths ============ SVG concepts: Clipping Paths ============ SVG concepts: Masks ============ SVG concepts: Masks ============ ```r gridsvg("plot-masked.svg", prefix="clip-") mask <- mask(circles) pushMask(mask) print(latticePlot, newpage=FALSE) dev.off() ``` SVG concepts: Masks ============ SVG concepts: Masks ============ SVG concepts: Masks ============ SVG concepts: Masks ============ SVG concepts: Javascript ============ ```r gridsvg("plot-js.svg", prefix="js-") print(latticePlot, newpage=FALSE) grid.garnish("points", grep=TRUE, group=FALSE, onclick=paste("alert('x =", mtcars$disp, "y =", mtcars$mpg, "')")) dev.off() ``` SVG concepts: Javascript ============ SVG concepts: Javascript ============ SVG concepts: Javascript ============ Playing ======= ```r gridsvg("leaf.svg", prefix="leaf-") library(grImport) leaf <- readPicture("fall12.xml") grid.picture(leaf) dev.off() ``` Playing ======= Playing ======= Playing ======= ```r gridsvg("barchart-silly.svg", prefix="silly-") print(barplot) grid.patternFill("rect", grep=TRUE, group=FALSE, label=rep("leaf", 3)) dev.off() ``` Summary ======= * Web publishing (HTML) is hot * SVG is cool * gridSVG shows potential * bringing SVG goodness to R * bringing R goodness to SVG Acknowledgements ================ * Many of the new features in 'gridSVG' were implemented by Simon Potter as part of his Masters Thesis * The hyperlinked scatterplot example was from Yale's Environmental Performance Index * The "Price Kaleidoscope" and "linked map" examples were produced by David Banks as part of his BSc Honours Project * The 'lattice' plot with checkboxes and tooltips was produced by David Banks as part of his Masters Project * The leaf image was created by OpenClipArt user Aungkarn Sugcharoun