Class actuate.report.HTML5Chart.Renderer

A container for a Highchart renderer object. Directly accesses the Highchart's rendering layer to draw primitive shapes like circles, rectangles, paths or text directly. The renderer represents a wrapper object for SVG in modern browsers and VML in older versions of Microsoft Internet Explorer.
Member of: actuate.report.HTML5Chart.

Class Summary
Constructor Attributes	Constructor Name and Description
	actuate.report.HTML5Chart.Renderer() Generates a new Renderer object to manage the Highchart rendering options for a actuate.report.HTML5Chart.ClientChart.

Field Summary
Field Attributes	Field Name and Description
<static>	symbols An extendable collection of functions for defining symbol paths.

Method Summary
Method Attributes	Method Name and Description
<static>	arc(x, y, r, innerR, start, end) Generates and draws an arc on the chart.
<static>	circle(x, y, r) Generates and draws a Scalable Vector Graphic circle on the chart.
<static>	clipRect(id, x, y, width, height) Generates and draws a clipping rectangle on the chart.
<static>	destroy() Destroys this renderer and its allocated elements.
<static>	g(name) Adds an SVG/VML group to the renderer object.
<static>	image(src, x, y, width, height) Generates and draws a image on the chart.
<static>	path(path) Adds a path to the renderer based on SVG's path commands.
<static>	rect(x, y, width, height, r, strokeWidth) Generates and draws a rectangle on the chart.
<static>	setSize(width, height, animate) Resizes the rendering area and re-aligns all aligned elements.
<static>	text(str, x, y, useHTML) Adds text to the Scalable Vector Graphic object.

Class Detail

actuate.report.HTML5Chart.Renderer()

Generates a new Renderer object to manage the Highchart rendering options for a actuate.report.HTML5Chart.ClientChart.

Field Detail

<static> symbols

An extendable collection of functions for defining symbol paths.

Method Detail

<static> {Highcharts.Element} arc(x, y, r, innerR, start, end)

Generates and draws an arc on the chart. This example draws a 50-pixel wide half-circle arc, concave down, with a center 200 pixels from the left edge and 150 pixels from the top edge of the chart area:

	myRenderer.arc(200, 150, 100, 50, -Math.PI, 0);

Parameters:
{integer} x: The X position of the arc's center, measured in pixels from the left edge of the rendering area.
{integer} y: The Y position of the arc's center, measured in pixels from the top edge of the rendering area.
{integer} r: The outer radius, measured in pixels.
{integer} innerR: The inner radius, measure in pixels.
{float} start: The starting angle of the arc, measured in radians, where 0 is directly right and -Math.PI/2 is directly upward. The arc is drawn clockwise from start to end.
{float} end: The ending angle of the arc, measured in radians, where 0 is directly right and -Math.PI/2 is directly upward.

Returns:: {Highcharts.Element} Highchart element object. The Element class is a JavaScript wrapper for SVG elements used in the rendering layer of Highchart.

<static> {Highcharts.Element} circle(x, y, r)

Generates and draws a Scalable Vector Graphic circle on the chart. This example draws a circle with a center 200 pixels from the left edge and 150 pixels from the top edge of the chart area:

	myRenderer.circle(200, 150, 100);

Parameters:
{Number} x: The X position of the circle's center, measured in pixels from the left edge of the rendering area.
{Number} y: The Y position of the circle's center, measured in pixels from the top edge of the rendering area.
{Number} r: The radius, measured in pixels.

Returns:: {Highcharts.Element} Highchart element object. The Element class is a JavaScript wrapper for SVG elements used in the rendering layer of Highchart.

<static> {Highcharts.Element} clipRect(id, x, y, width, height)

Generates and draws a clipping rectangle on the chart. This example draws a 100 pixel by 100 pixel rectangle 100 pixels from the left and top edges of chart area:

	myRenderer.cliprect('myClipRect', 100, 100, 100, 100);

Parameters:
{String} id: A string to identify the element.
{Number} x: The X position of the rectangle's upper left corner, measured in pixels from the left edge of the rendering area.
{Number} y: The Y position of the rectangle's upper left corner, measured in pixels from the top edge of the rendering area.
{Number} width: The width, in pixels.
{Number} height: The height, in pixels.

Returns:: {Highcharts.Element} Highchart element object. The Element class is a JavaScript wrapper for SVG elements used in the rendering layer of Highchart.

<static> {void} destroy()

Destroys this renderer and its allocated elements. This example destroys the myRenderer object and frees its memory:

	myRenderer.destroy( );

Returns:: {void}

<static> {Highcharts.Element} g(name)

Adds an SVG/VML group to the renderer object. This example destroys the myRenderer object and frees its memory:

	myRenderer.g('myGroup');

Parameters:
{String} name: The name of the group. Used in the class name, which will be 'highcharts-'+ name. Other Element objects are added to the group by using this group as the first parameter in .add( ) for the element wrappers.

Returns:: {Highcharts.Element} Highchart element object. The Element class is a JavaScript wrapper for SVG elements used in the rendering layer of Highchart.

<static> {Highcharts.Element} image(src, x, y, width, height)

Generates and draws a image on the chart. This example adds the sun.png image to the chart 100 pixels from the left and top of the edge of the chart:

	myRenderer.image('http://highcharts.com/demo/gfx/sun.png', 100, 100, 30, 30);

Parameters:
{String} src: A URL for the image.
{Number} x: The X position of the image's upper left corner, measured in pixels from the left edge of the rendering area.
{Number} y: The Y position of the image's upper left corner, measured in pixels from the top edge of the rendering area.
{Number} width: The width, in pixels.
{Number} height: The height, in pixels.

Returns:: {Highcharts.Element} Highchart element object. The Element class is a JavaScript wrapper for SVG elements used in the rendering layer of Highchart.

<static> {Highcharts.Element} path(path)

Adds a path to the renderer based on SVG's path commands. In SVG-capable browsers, all path commands are supported, but in VML only a subset is supported, including the moveTo, lineTo, and curve commands. This example draws a path from the upper left corner of the rendering area (0, 0) to the points (100, 100), (200, 50), and (300, 100), where the first number represents the distance from the left edge of the rendering area and the second number represents the distance from the top edge of the rendering area:

	myRenderer.path(['M', 0, 0, 'L', 100, 100, 200, 50, 300, 100]);

Parameters:
{string[ ]|integer[ ]} path: An SVG path with attributes split up in array form.

Returns:: {Highcharts.Element} Highchart element object. The Element class is a JavaScript wrapper for SVG elements used in the rendering layer of Highchart.

<static> {Highcharts.Element} rect(x, y, width, height, r, strokeWidth)

Generates and draws a rectangle on the chart. This example draws a 100-pixel-by-100-pixel rectangle 100 pixels from the left and top edges of chart area with 5-pixel-radius quarter-circles as edges:

	myRenderer.rect(100, 100, 100, 100, 5);

Parameters:
{Number} x: The X position of the rectangle's upper left corner, measured in pixels from the left edge of the rendering area.
{Number} y: The Y position of the rectangle's upper left corner, measured in pixels from the top edge of the rendering area.
{Number} width: The width, in pixels.
{Number} height: The height, in pixels.
{Number} r: The corner radius, measured in pixels.
{Number} strokeWidth: Stroke measurement to support crisp drawing.

Returns:: {Highcharts.Element} Highchart element object. The Element class is a JavaScript wrapper for SVG elements used in the rendering layer of Highchart.

<static> {void} setSize(width, height, animate)

Resizes the rendering area and re-aligns all aligned elements. This example resizes the renderer area to 500 pixels by 500 pixels:

	myRenderer.setSize(500, 500);

Parameters:
{Object} width: The width, in pixels.
{Object} height: The height, in pixels.
{Boolean} animate: Optional. Whether to animated the resize. Default is true.

Returns:: {void}

<static> {Highcharts.Element} text(str, x, y, useHTML)

Adds text to the Scalable Vector Graphic object. This example adds a text graphic that reads "Series 1" 140 pixels from the left edge of the rendering area and 150 pixels from the top edge of the rendering area:

	myRenderer.text('Series 1', 140, 150, false);

Parameters:
{String} str: The text in this text element.
{Number} x: The X position of the text's lower left corner, measured in pixels from the left edge of the rendering area.
{Number} y: The Y position of the text's lower left corner, measured in pixels from the top edge of the rendering area.
{Boolean} useHTML: Specifies whether to use HTML to render the text.

Returns:: {Highcharts.Element} Highchart element object. The Element class is a JavaScript wrapper for SVG elements used in the rendering layer of Highchart.

Classes

Class actuate.report.HTML5Chart.Renderer