PieChart Class
yui3/src/charts/js/PieChart.js:1
Parent Module: charts
The PieChart class creates a pie chart
Constructor
PieChart
()
Index
Methods
- _addAxes
- _addSeries
- _addTooltip
- _buildSeriesKeys
- _dataProviderChangeHandler
- _getAllKeys
- _getAriaMessage
- _getAxisClass
- _getDefaultAxes
- _getGraph
- _getSeriesCollection
- _getTooltip
- _groupMarkersChangeHandler
- _itemRendered
- _markerEventDispatcher
- _parseAxes
- _parseSeriesAxes
- _planarLabelFunction
- _positionTooltip
- _redraw
- _setAriaElements
- _setDataValues
- _setOffscreen
- _setText
- _showTooltip
- _sizeChanged
- _tooltipChangeHandler
- _tooltipLabelFunction
- _updateTooltip
- _wereSeriesKeysExplicitlySet
- bindUI
- destructor
- getAxisByKey
- getCategoryAxis
- getSeries
- getSeriesItem
- hideTooltip
- initializer
- renderUI
- syncUI
- toggleTooltip
Attributes
Methods
_addAxes
()
private
Adds axes to the chart.
_addSeries
()
private
Renders the Graph.
_addTooltip
()
private
<p>Adds a tooltip to the dom.</p>
_buildSeriesKeys
-
dataProvider
<p>Constructs seriesKeys if not explicitly specified.</p>
Parameters:
-
dataProviderArray<p><p>The dataProvider for the chart.</p></p>
Returns:
<p><p>Array</p></p>
_dataProviderChangeHandler
-
e
<p>Event handler for dataProviderChange.</p>
Parameters:
-
eObject<p><p>Event object.</p></p>
_getAllKeys
-
dp
<p>Returns all the keys contained in a <code>dataProvider</code>.</p>
Parameters:
-
dpArray<p><p>Collection of objects to be parsed.</p></p>
Returns:
<p><p>Object</p></p>
_getAriaMessage
-
key
Returns the appropriate message based on the key press.
Parameters:
-
keyNumberThe keycode that was pressed.
Returns:
String
_getAxisClass
-
t
<p>Helper method that returns the axis class that a key references.</p>
Parameters:
-
tString<p><p>The type of axis.</p></p>
Returns:
<p><p>Axis</p></p>
_getDefaultAxes
()
private
Generates and returns a key-indexed object containing Axis instances or objects used to create Axis instances.
Returns:
Object
_getGraph
()
private
<p>Default value function for the <code>Graph</code> attribute.</p>
Returns:
<p><p>Graph</p></p>
_getSeriesCollection
()
private
Calculates and returns a seriesCollection.
Returns:
Array
_getTooltip
()
private
<p>Default getter for <code>tooltip</code> attribute.</p>
Returns:
<p><p>Object</p></p>
_groupMarkersChangeHandler
-
e
<p>Handles groupMarkers change event.</p>
Parameters:
-
eObject<p><p>Event object.</p></p>
_itemRendered
-
e
<p>Handler for itemRendered event.</p>
Parameters:
-
eObject<p><p>Event object.</p></p>
_markerEventDispatcher
-
e
<p>Event handler for marker events.</p>
Parameters:
-
eObject<p><p>Event object.</p></p>
_parseAxes
-
val
Creates Axis instances.
Parameters:
-
valObjectObject containing
Axisinstances or objects in which to constructAxisinstances.
Returns:
Object
_parseSeriesAxes
-
c
Parse and sets the axes for the chart.
Parameters:
-
cArrayA collection
PieSeriesinstance.
_planarLabelFunction
-
categoryAxis -
valueItems -
index -
seriesArray -
seriesIndex
<p>Formats tooltip text when <code>interactionType</code> is <code>planar</code>.</p>
Parameters:
-
categoryAxisAxis<p><p>Reference to the categoryAxis of the chart.</p></p>
-
valueItemsArray<p><p>Array of objects for each series that has a data point in the coordinate plane of the event. Each object contains the following data: <dl> <dt>axis</dt><dd>The value axis of the series.</dd> <dt>key</dt><dd>The key for the series.</dd> <dt>value</dt><dd>The value for the series item.</dd> <dt>displayName</dt><dd>The display name of the series. (defaults to key if not provided)</dd> </dl></p></p>
-
indexNumber<p><p>The index of the item within its series.</p></p>
-
seriesArrayArray<p><p>Array of series instances for each value item.</p></p>
-
seriesIndexNumber<p><p>The index of the series in the <code>seriesCollection</code>.</p></p>
Returns:
_positionTooltip
-
e
<p>Positions the tooltip</p>
Parameters:
-
eObject<p><p>Event object.</p></p>
_redraw
()
private
Redraws the chart instance.
_setAriaElements
-
cb
<p>Creates an aria <code>live-region</code>, <code>aria-label</code> and <code>aria-describedby</code> for the Chart.</p>
Parameters:
-
cbNode<p><p>Reference to the Chart's <code>contentBox</code> attribute.</p></p>
_setDataValues
-
val
<p>Setter method for <code>dataProvider</code> attribute.</p>
Parameters:
-
valArray<p><p>Array to be set as <code>dataProvider</code>.</p></p>
Returns:
<p><p>Array</p></p>
_setOffscreen
()
private
<p>Sets a node offscreen for use as aria-description or aria-live-regin.</p>
Returns:
<p><p>Node</p></p>
_setText
-
label -
val
<p>Updates the content of text field. This method writes a value into a text field using <code>appendChild</code>. If the value is a <code>String</code>, it is converted to a <code>TextNode</code> first.</p>
Parameters:
-
labelHTMLElement<p><p>label to be updated</p></p>
-
valString<p><p>value with which to update the label</p></p>
_showTooltip
-
msg -
x -
y
<p>Shows a tooltip</p>
_sizeChanged
-
e
Handler for sizeChanged event.
Parameters:
-
eObjectEvent object.
_tooltipChangeHandler
-
e
<p>Event handler for the tooltipChange.</p>
Parameters:
-
eObject<p><p>Event object.</p></p>
_tooltipLabelFunction
-
categoryItem -
valueItem -
itemIndex -
series
Formats tooltip text for a pie chart.
Parameters:
-
categoryItemObjectAn object containing the following: <dl> <dt>axis</dt><dd>The axis to which the category is bound.</dd> <dt>displayName</dt><dd>The display name set to the category (defaults to key if not provided)</dd> <dt>key</dt><dd>The key of the category.</dd> <dt>value</dt><dd>The value of the category</dd> </dl>
-
valueItemObjectAn object containing the following: <dl> <dt>axis</dt><dd>The axis to which the item's series is bound.</dd> <dt>displayName</dt><dd>The display name of the series. (defaults to key if not provided)</dd> <dt>key</dt><dd>The key for the series.</dd> <dt>value</dt><dd>The value for the series item.</dd> </dl>
-
itemIndexNumberThe index of the item within the series.
-
seriesCartesianSeriesThe
PieSeriesinstance of the item.
Returns:
_updateTooltip
-
val
<p>Updates the tooltip attribute.</p>
Parameters:
-
valObject<p><p>Object containing properties for the tooltip.</p></p>
Returns:
<p><p>Object</p></p>
_wereSeriesKeysExplicitlySet
()
private
<p>Utility method to determine if <code>seriesKeys</code> was explicitly provided (for example during construction, or set by the user), as opposed to being derived from the dataProvider for example.</p>
Returns:
<p><p>boolean true if the <code>seriesKeys</code> attribute was explicitly set.</p></p>
bindUI
()
private
destructor
()
protected
Destructor implementation for the PieChart class.
getAxisByKey
-
val
<p>Returns an <code>Axis</code> instance by key reference. If the axis was explicitly set through the <code>axes</code> attribute, the key will be the same as the key used in the <code>axes</code> object. For default axes, the key for the category axis is the value of the <code>categoryKey</code> (<code>category</code>). For the value axis, the default key is <code>values</code>.</p>
Parameters:
-
valString<p><p>Key reference used to look up the axis.</p></p>
Returns:
<p><p>Axis</p></p>
getCategoryAxis
()
<p>Returns the category axis for the chart.</p>
Returns:
<p><p>Axis</p></p>
getSeries
-
val
<p>Returns a series instance by index or key value.</p>
Parameters:
-
valObject
Returns:
<p><p>CartesianSeries</p></p>
getSeriesItem
-
series -
index
Returns an object literal containing a categoryItem and a valueItem for a given series index.
Parameters:
-
seriesObjectReference to a series.
-
indexObjectIndex of the specified item within a series.
Returns:
Object
hideTooltip
()
<p>Hides the default tooltip</p>
initializer
()
private
renderUI
()
private
syncUI
()
private
toggleTooltip
-
e
<p>Event listener for toggling the tooltip. If a tooltip is visible, hide it. If not, it will create and show a tooltip based on the event object.</p>
Parameters:
-
eObject<p><p>Event object.</p></p>
Properties
_axes
Array
private
<p>Collection of axes.</p>
_axisClass
Object
private
<p>Key value pairs of axis types.</p>
_dataProvider
Array
private
<p>Storage for the <code>dataProvider</code> attribute.</p>
_direction
String
private
<p>Default direction of the chart.</p>
Default: horizontal
_seriesCollection
Array
private
<p>Storage for <code>seriesCollection</code> attribute.</p>
_setSeriesCollection
Unknown
private
<p>Setter method for <code>seriesCollection</code> attribute.</p>
Sub-properties:
-
valArray<p><p>Array of either <code>CartesianSeries</code> instances or objects containing series attribute key value pairs.</p></p>
Attributes
categoryType
String
<p>Indicates the type of axis to use for the category axis.</p> <p><dl> <dt>category</dt><dd>Specifies a <code>CategoryAxis</code>.</dd> <dt>time</dt><dd>Specifies a `TimeAxis</dd> </dl></p>
Default: category
groupMarkers
Boolean
<p>Indicates whether or not markers for a series will be grouped and rendered in a single complex shape instance.</p>
interactionType
String
<p>Indicates the the type of interactions that will fire events.</p> <p><dl> <dt>marker</dt><dd>Events will be broadcasted when the mouse interacts with individual markers.</dd> <dt>planar</dt><dd>Events will be broadcasted when the mouse intersects the plane of any markers on the chart.</dd> <dt>none</dt><dd>No events will be broadcasted.</dd> </dl></p>
Default: marker
seriesCollection
Array
Collection of series to appear on the chart. This can be an array of Series instances or object literals used to describe a Series instance.
seriesKeys
Array
<p>A collection of keys that map to the series axes. If no keys are set, they will be generated automatically depending on the data structure passed into the chart.</p>
tooltip
Object
<p>Reference to the default tooltip available for the chart. <p>Contains the following properties:</p> <dl> <dt>node</dt><dd>Reference to the actual dom node</dd> <dt>showEvent</dt><dd>Event that should trigger the tooltip</dd> <dt>hideEvent</dt><dd>Event that should trigger the removal of a tooltip (can be an event or an array of events)</dd> <dt>styles</dt><dd>A hash of style properties that will be applied to the tooltip node</dd> <dt>show</dt><dd>Indicates whether or not to show the tooltip</dd> <dt>markerEventHandler</dt><dd>Displays and hides tooltip based on marker events</dd> <dt>planarEventHandler</dt><dd>Displays and hides tooltip based on planar events</dd> <dt>markerLabelFunction</dt><dd>Reference to the function used to format a marker event triggered tooltip's text. The method contains the following arguments: <dl> <dt>categoryItem</dt><dd>An object containing the following: <dl> <dt>axis</dt><dd>The axis to which the category is bound.</dd> <dt>displayName</dt><dd>The display name set to the category (defaults to key if not provided).</dd> <dt>key</dt><dd>The key of the category.</dd> <dt>value</dt><dd>The value of the category.</dd> </dl> </dd> <dt>valueItem</dt><dd>An object containing the following: <dl> <dt>axis</dt><dd>The axis to which the item's series is bound.</dd> <dt>displayName</dt><dd>The display name of the series. (defaults to key if not provided)</dd> <dt>key</dt><dd>The key for the series.</dd> <dt>value</dt><dd>The value for the series item.</dd> </dl> </dd> <dt>itemIndex</dt><dd>The index of the item within the series.</dd> <dt>series</dt><dd> The <code>CartesianSeries</code> instance of the item.</dd> <dt>seriesIndex</dt><dd>The index of the series in the <code>seriesCollection</code>.</dd> </dl> The method returns an <code>HTMLElement</code> which is written into the DOM using <code>appendChild</code>. If you override this method and choose to return an html string, you will also need to override the tooltip's <code>setTextFunction</code> method to accept an html string. </dd> <dt>planarLabelFunction</dt><dd>Reference to the function used to format a planar event triggered tooltip's text <dl> <dt>categoryAxis</dt><dd> <code>CategoryAxis</code> Reference to the categoryAxis of the chart. <dt>valueItems</dt><dd>Array of objects for each series that has a data point in the coordinate plane of the event. Each object contains the following data: <dl> <dt>axis</dt><dd>The value axis of the series.</dd> <dt>key</dt><dd>The key for the series.</dd> <dt>value</dt><dd>The value for the series item.</dd> <dt>displayName</dt><dd>The display name of the series. (defaults to key if not provided)</dd> </dl> </dd> <dt>index</dt><dd>The index of the item within its series.</dd> <dt>seriesArray</dt><dd>Array of series instances for each value item.</dd> <dt>seriesIndex</dt><dd>The index of the series in the <code>seriesCollection</code>.</dd> </dl> </dd> </dl> The method returns an <code>HTMLElement</code> which is written into the DOM using <code>appendChild</code>. If you override this method and choose to return an html string, you will also need to override the tooltip's <code>setTextFunction</code> method to accept an html string. </dd> <dt>setTextFunction</dt><dd>Method that writes content returned from <code>planarLabelFunction</code> or <code>markerLabelFunction</code> into the the tooltip node. Has the following signature: <dl> <dt>label</dt><dd>The <code>HTMLElement</code> that the content is to be added.</dd> <dt>val</dt><dd>The content to be rendered into tooltip. This can be a <code>String</code> or <code>HTMLElement</code>. If an HTML string is used, it will be rendered as a string.</dd> </dl> </dd> </dl></p>
Events
markerEvent:click
<p>Broadcasts when <code>interactionType</code> is set to <code>marker</code> and a series marker has received a click event.</p>
Event Payload:
-
eEventFacade<p><p>Event facade with the following additional properties: <dl> <dt>categoryItem</dt><dd>Hash containing information about the category <code>Axis</code>.</dd> <dt>valueItem</dt><dd>Hash containing information about the value <code>Axis</code>.</dd> <dt>node</dt><dd>The dom node of the marker.</dd> <dt>x</dt><dd>The x-coordinate of the mouse in relation to the Chart.</dd> <dt>y</dt><dd>The y-coordinate of the mouse in relation to the Chart.</dd> <dt>pageX</dt><dd>The x location of the event on the page (including scroll)</dd> <dt>pageY</dt><dd>The y location of the event on the page (including scroll)</dd> <dt>series</dt><dd>Reference to the series of the marker.</dd> <dt>index</dt><dd>Index of the marker in the series.</dd> <dt>seriesIndex</dt><dd>The <code>order</code> of the marker's series.</dd> <dt>originEvent</dt><dd>Underlying dom event.</dd> </dl></p></p>
markerEvent:mousedown
<p>Broadcasts when <code>interactionType</code> is set to <code>marker</code> and a series marker has received a mousedown event.</p>
Event Payload:
-
eEventFacade<p><p>Event facade with the following additional properties: <dl> <dt>categoryItem</dt><dd>Hash containing information about the category <code>Axis</code>.</dd> <dt>valueItem</dt><dd>Hash containing information about the value <code>Axis</code>.</dd> <dt>node</dt><dd>The dom node of the marker.</dd> <dt>x</dt><dd>The x-coordinate of the mouse in relation to the Chart.</dd> <dt>y</dt><dd>The y-coordinate of the mouse in relation to the Chart.</dd> <dt>series</dt><dd>Reference to the series of the marker.</dd> <dt>index</dt><dd>Index of the marker in the series.</dd> <dt>seriesIndex</dt><dd>The <code>order</code> of the marker's series.</dd> </dl></p></p>
markerEvent:mouseout
<p>Broadcasts when <code>interactionType</code> is set to <code>marker</code> and a series marker has received a mouseout event.</p>
Event Payload:
-
eEventFacade<p><p>Event facade with the following additional properties: <dl> <dt>categoryItem</dt><dd>Hash containing information about the category <code>Axis</code>.</dd> <dt>valueItem</dt><dd>Hash containing information about the value <code>Axis</code>.</dd> <dt>node</dt><dd>The dom node of the marker.</dd> <dt>x</dt><dd>The x-coordinate of the mouse in relation to the Chart.</dd> <dt>y</dt><dd>The y-coordinate of the mouse in relation to the Chart.</dd> <dt>series</dt><dd>Reference to the series of the marker.</dd> <dt>index</dt><dd>Index of the marker in the series.</dd> <dt>seriesIndex</dt><dd>The <code>order</code> of the marker's series.</dd> </dl></p></p>
markerEvent:mouseover
<p>Broadcasts when <code>interactionType</code> is set to <code>marker</code> and a series marker has received a mouseover event.</p>
Event Payload:
-
eEventFacade<p><p>Event facade with the following additional properties: <dl> <dt>categoryItem</dt><dd>Hash containing information about the category <code>Axis</code>.</dd> <dt>valueItem</dt><dd>Hash containing information about the value <code>Axis</code>.</dd> <dt>node</dt><dd>The dom node of the marker.</dd> <dt>x</dt><dd>The x-coordinate of the mouse in relation to the Chart.</dd> <dt>y</dt><dd>The y-coordinate of the mouse in relation to the Chart.</dd> <dt>series</dt><dd>Reference to the series of the marker.</dd> <dt>index</dt><dd>Index of the marker in the series.</dd> <dt>seriesIndex</dt><dd>The <code>order</code> of the marker's series.</dd> </dl></p></p>
markerEvent:mouseup
<p>Broadcasts when <code>interactionType</code> is set to <code>marker</code> and a series marker has received a mouseup event.</p>
Event Payload:
-
eEventFacade<p><p>Event facade with the following additional properties: <dl> <dt>categoryItem</dt><dd>Hash containing information about the category <code>Axis</code>.</dd> <dt>valueItem</dt><dd>Hash containing information about the value <code>Axis</code>.</dd> <dt>node</dt><dd>The dom node of the marker.</dd> <dt>x</dt><dd>The x-coordinate of the mouse in relation to the Chart.</dd> <dt>y</dt><dd>The y-coordinate of the mouse in relation to the Chart.</dd> <dt>series</dt><dd>Reference to the series of the marker.</dd> <dt>index</dt><dd>Index of the marker in the series.</dd> <dt>seriesIndex</dt><dd>The <code>order</code> of the marker's series.</dd> </dl></p></p>