gcanvas: Widget containing a canvas element.

In jverzani/gWidgetsWWW2.rapache: Toolkit implementation of the gWidgets API for use with web pages

Description

Primarily this is a widget meant to hold a graphic produced by the canvas package device direct. This package provides a non-interactive device for creating graphic files using JavaScript. This widget allows such files to be displayed easily. However, one can also write low-level canvas methods to the device if desired. When used with the canvas package, one passes to the constructor or the svalue<- method a function that has been used by the canvas device driver to store the JavaScript commands representing the graphic. The basic use is in an example below.

Usage

  gcanvas(f = NULL, width = 480, height = 400,
    container = NULL, ..., ext.args = list())

Arguments

f	Optional. A file name containing output generated by the canvas device.
width	a pre-specified width (in pixels) for the widget
height	a pre-specified height (in pixels) for the widget
container	parent container
...	passed along to add call of the container. Can be used to adjust layout parameters. May also have other uses.
ext.args	A list of extra arguments to pass to the ExtJS constructor

Details

The canvas widget can listen for mouse events, notably the click event. The first argument list for the callback passed to addHandlerClicked has additional components x,y containing the position of the click in ndc coordinates (in [0,1] with (0,0) being lower left; X,Y the pixel position of the click with (0,0) being the upper left corner; and width, height containing the width and height of the canvas widget (also passed in to the constructor, but this makes things convenient). Conversion from ndc to "user" coordinates is done with grconvertXY, but there is a catch, as one must call this with an active device. The low level canvas command allow one to draw on the canvas using the pixel coordinates, which are passed back as X and Y. The pixel coordinates use (0,0) as the upper right. A demo shows how the low level commands can be used with the mouse motion handlers to create a GUI where an element can be dragged around. It isn't as responsive as one would hope, as the callback into R from the browser has too much lag.

Value

an GCanvas reference class object

Note

In the click handler one gets passed the click coordinate in ndc coordinates, as this is the best the JavaScript can do, not knowing the device parameters. When R gets this back it doesn't have the current device to call grconvertX, say, so one needs to hack in a call to the canvas device to reset the parameters. See the demo examples. The examples here are more basic.

Examples

w <- gwindow()
gstatusbar("Powered by gWidgetsWWW2 and Rook", cont=w)

width <- height <- 250
f <- tempfile()
canvas(f, width=width, height=height)
hist(rnorm(100))
dev.off()
cnv <- gcanvas(f, container=w, width=width, height=height)
## make a new new graphic
gbutton("refresh", cont=w, handler=function(h,...) {
  f <- svalue(cnv)
  canvas(f, width=width, height=height)
  hist(rnorm(100))
  dev.off()
  svalue(cnv) <- f
})

## Using canvas for drawing area using lower level canvas methods
w <- gwindow("gcanvas example")
sb <- gstatusbar("Powered by gWidgetsWWW2 and Rack", cont=w)
g <- ggroup(cont=w, horizontal=FALSE)
width <- 500; height <- 500

cnv <- gcanvas(width=width, height=height, cont=g)

started <-FALSE
cnv$add_handler_mouse_down(handler=function(h,...) {
  cnv$call_method("beginPath")
  cnv$call_method("moveTo", h$X, h$Y)
  started <<- TRUE
})


cnv$add_handler_mouse_move(handler=function(h,...) {
  if(started) {
    cnv$call_method("lineTo", h$X, h$Y)
    cnv$call_method("stroke")
  }
})

cnv$add_handler_mouse_up(handler=function(h,...) {
  started <<- FALSE
})

jverzani/gWidgetsWWW2.rapache documentation built on May 20, 2019, 5:19 a.m.