block by timelyportfolio fe53ec604b88f00399cf

animated construction of r contour plot with svg+js using vivus.js

Full Screen

Another example of animated chart construction in R with SVG + vivus.js + @RStudio htmltools using techniques from previous experiments. I very much like where this is headed, and I welcome feedback and ideas.

  1. r plot.zoo animated construction with svg+js using vivus.js
  2. r animated chart in svg with vivus.js

replicate/extend

make your own

live example

see it in action

code.R

svgPlot(
  {
    # most code copied from ?contour
    # set up the plot 
    rx <- range(x <- 10*1:nrow(volcano))
    ry <- range(y <- 10*1:ncol(volcano))
    ry <- ry + c(-1, 1) * (diff(rx) - diff(ry))/2    
    tcol <- terrain.colors(12)
    plot(x = 0, y = 0, type = "n",
         xlim = rx, ylim = ry,
         xlab = "", ylab = ""
         # add this to turn off the box and axes
         ,bty="l",xaxt="n",yaxt="n"
    )
    # draw the contour
    contour(x, y, volcano, col = tcol[2], lty = "solid", add = TRUE,
            vfont = c("sans serif", "plain"))
    # add the 
    axis(side=1,lwd=0,lwd.ticks=1)
    axis(side=2,lwd=0,lwd.ticks=1,las=1)
  }
  ,height = 5, width = 5
) %>>%
  saveXML %>>%
  html %>>%
  html_node("svg") %>>%
  addAttributes(
    id = "rplot"
  ) %>>%
  (
    tagList(
      . %>>% saveXML %>>% HTML
      ,tags$script(
        "new Vivus('rplot',{type: 'delayed',start:'autostart',delay:0,duration:500})"
        #"new Vivus('rplot',{type: 'oneByOne',start:'autostart',delay:0,duration:500})"
      )
    )
  ) %>>%
  attachDependencies(
    htmlDependency(
      name="vivus"
      ,version="0.1"
      ,src=c("href"=
               "http://maxwellito.github.io/vivus/dist"
      )
      ,script = "vivus.min.js"
    )
  ) %>>%
  html_print