Skip to content
asripong edited this page Aug 2, 2012 · 14 revisions

The gg.graph object holds all the necessary information required to render a chart. To construct a chart using Polychart, we would begin by constructing a gg.graph object, then bind all the necessary data, layers, scales, and other components to it, and finally rendering it in the desired dom.

Calling gg.graph() creates a new gg.graph object. One can pass in the data source in the constructor. The data can be a gg.data object, or any other object accepted by gg.data.

Binds a data object to the graph. The data object can be a gg.data object, or any other object accepted by gg.data.

Adds a gg.layer.* object to the graph. Multiple layers can be attached to a single gg.graph object.

Returns the number of layers contained in the graph.

Attaches a scale to a given aesthetic. The scale parameter can be a string (e.g. "continuous") or an actual scale object with additional specifications (e.g. "gg.scale.continuous("log")").

Returns the scale for a given aesthetic.

Sets the coordinate system used to render the graph. The coord parameter can be a string (e.g. "cart") or an actual coordinate object with additional specifications (e.g. "gg.coord.cart()").

Sets a faceting object. The facet parameter should be either a gg.facet.grid or gg.facet.wrap object. For more on faceting see here.

When only key is present, returns the currently set graph option. When both key and val are present this function acts as a setting for the graph options. You can also pass in an associate array of keys and values to set multiple options in the same function call.

Possible graph options are:

  • dom -- dom to render the chart in - can be element id, or DOM object
  • width -- width of the chart
  • height -- height of the chart
  • title -- plot title
  • title-size -- size of the title (in pts)
  • title-bold -- whether the title is bolded (true or false)
  • label-x -- the x-axis label
  • label-y -- the y-axis label
  • label-size -- size of the x- and y-axis labels (in pts)
  • label-bold -- whether the x- and y-axis labels are bolded (true or false)
  • axis-y -- position of the y-axis ("left", "right", or "none")
  • axis-y-line -- whether to draw the y-axis line (true or false)
  • axis-y-label -- whether to draw the y-axis labels (true or false)
  • axis-y-ticks -- whether to draw the y-axis ticks (true or false)
  • axis-y-ticklength -- the length of the y-axis ticks
  • axis-y-color -- the color of the y-axis line and ticks
  • axis-y-strokewidth -- the width of the y-axis line and ticks
  • axis-x -- position of the x-axis ("left", "right", or "none")
  • axis-x-line -- whether to draw the x-axis line (true or false)
  • axis-x-label -- whether to draw the x-axis labels (true or false)
  • axis-x-ticks -- whether to draw the x-axis ticks (true or false)
  • axis-x-ticklength -- the length of the x-axis ticks
  • axis-x-color -- the color of the x-axis line and ticks
  • axis-x-strokewidth -- the width of the x-axis line and ticks
  • grid-render-vertical -- whether or not to render the vertical grids (true or false)
  • grid-render-horizontal -- whether or not to render the horizontal grids (true or false)
  • grid-stroke -- the color of the horizontal and vertical grids
  • grid-strokewidth -- the width of the horizontal and vertical grids
  • padding-left -- the amount of space to the left of the actual plot, in pixels
  • padding-right -- the amount of space to the right of the actual plot, in pixels
  • padding-top -- the amount of space above the actual plot, in pixels
  • padding-bottom -- the amount of space below the actual plot, in pixels
  • spacing-x -- horizontal spacing between two adjacent facets
  • spacing-y -- vertical spacing between two adjacent facets
  • branding -- whether or not to display branding (true or false)

Renders the actual graph.

Clone this wiki locally