Polar Chart
This interactive Polar chart is rendered within the browser using SVG.
View source
---
Methods
Main Methods
Name | Return | Description |
---|---|---|
.Chart (id, 'polar', series, options) | this | Creates, draws and returns the Chart object. |
.attachTooltip (xmlString, width, height) | this | Attachs a user defined tooltip to the selected element. The user defined HTML5 tooltip is included in a SVG foreignObject element (requires IE12+). |
Event Methods
Name | Return | Description |
---|---|---|
.addEventListener (type, listener) | this | Registers the specified listener on the EventTarget it's called on. |
.addOneTimeEventListener (type, listener) | this | Registers the specified listener on the EventTarget it's called on for a one-time event. |
.removeEventListener (type, listener) | this | Removes the event listener previously registered with addEventListener (). |
.on (type, listener) | this | Alias on addEventListener (). |
.one (type, listener) | this | Alias on addOneTimeEventListener (). |
.off (type, listener) | this | Alias on removeEventListener (). |
Event Types
Attribute | Type | Object | Info |
---|---|---|---|
'over' | String | OverEvent | Fired when the mouse enters on a new element. |
'out' | String | - | Fired when the mouse leaves the selected element. |
Event Objects
OverEvent
Attribute | Type | Info |
---|---|---|
x | String | The x-axis value of the SVG element(s) that fired the event. |
series | Array | The attributes of the selected SVG element(s). The array contains one object per SVG element(s). |
series[n].label | String | The name of the serie. |
series[n].value | String | The y value of the SVG element. |
series[n].color | String | The color associated to this SVG element. |
Series Options
The series are specified in an array of objects. The serie object has the following attributes:
Attribute | Type | Default | Info |
---|---|---|---|
label | String | empty | The name of the data value. |
prefix | String | The prefix attribute. | |
suffix | String | The suffix attribute. | |
type | String | line | The options are line, column and area. |
data | Array | Array having an object with the key(s) being the map element ID. | |
style | Object | null | The style to apply to the SVG elements that belong to the serie. By default, the css style is applied. |
style.fillColor | String | undefined | The fill color attribute. |
style.fillOpacity | Number | undefined | The color opacity attribute. |
style.stroke | String | undefined | The stroke color attribute. |
style.strokeOpacity | Number | undefined | The stroke color opacity attribute. |
style.strokeWidth | Number | undefined | The stroke width attribute. |
over | Object | null | The style to apply to the SVG elements that belong to the serie when the mouse is over the element. By default, the css style is applied. |
over.fillColor | String | undefined | The fill color attribute. |
over.fillOpacity | Number | undefined | The color opacity attribute. |
over.stroke | String | undefined | The stroke color attribute. |
over.strokeOpacity | Number | undefined | The stroke color opacity attribute. |
over.strokeWidth | Number | undefined | The stroke width attribute. |
Chart Options
Attribute | Type | Default | Info |
---|---|---|---|
chart | Object | The attributes of the chart. | |
chart.type | String | 'polar' | The type of Polar chart (currently, 'polar' option only). |
chart.width | Number | 420 | The outer width of the chart. |
chart.height | Number | 330 | The outer height of the chart. |
chart.grid | Object | - | The position and the size of the chart inside the outer box. |
chart.grid.x | Number | - | The horizontal position of the polar center. |
chart.grid.y | - | The vertical position of the polar center. | |
chart.grid.width | Number | - | The width of the chart. |
chart.grid.height | Number | - | The height of the chart. |
chart.grid.margin | Object | The inner box margins. | |
chart.grid.margin.top | Number | 0 | The inner box top margin. |
chart.grid.margin.left | Number | 0 | The inner box left margin. |
chart.grid.margin.right | Number | 0 | The inner box right margin. |
chart.grid.margin.bottom | Number | 0 | The inner box bottom margin. |
title | Object | The title attributes. | |
title.label | String | The name of the title. | |
title.x | Number | - | The horizontal anchor position of the title. |
title.y | Number | - | The vertical anchor position of the title. |
subtitle | Object | The subtitle attributes. | |
subtitle.label | String | The text for the subtitle. | |
subtitle.x | Number | - | The horizontal anchor position of the subtitle. |
subtitle.y | Number | - | The vertical anchor position of the subtitle. |
legend | Object | The legend attributes. | |
legend.enabled | Boolean | true | Enables or disables the legend. |
legend.floating | Boolean | true | Enables or not the legend to float above the map. |
legend.layout | String | vertical | The legend could be horizontal or vertical. |
legend.align | Object | The legend position on the grid. | |
legend.align.horizontal | String | right | The legend position on x axis could be: left, right or middle |
legend.align.vertical | String | top | The legend position on y axis could be: top, bottom or middle |
legend.shift | Object | The shift position of the legend on the grid. | |
legend.shift.x | Number | 0 | Moves slightly the legend on the x direction. |
legend.shift.y | Number | 0 | Moves slightly the legend on the y direction. |
legend.icon | Object | The icon rectangle size. | |
legend.icon.width | Number | 10 | The icon rectangle width. |
legend.icon.height | Number | 10 | The icon rectangle height. |
tooltip | Object | The tooltip attributes. | |
tooltip.enabled | Boolean | true | Enables (true) or disables (false) the tooltip. |
tooltip.animated | Boolean | true | smoothly moves (true) or not (false) the tooltip from previous item to current. |
xAxis | Object | The attributes of the X axis. | |
xAxis.min | Number | 0 | The minimal value on X axis. |
xAxis.max | Number | 360 | The maximal value on X axis. |
xAxis.tick | Number | 45 | The value of the increment on X axis. |
xAxis.suffix | String | '' | The suffix parameter. |
yAxis | Object | The attributes of the Y axis. | |
yAxis.min | Number | 0 | The minimal value. |
yAxis.max | Number | 10 | The maximal value. |
yAxis.minor | Number | 4 | The incremental value. |
yAxis.title | Object | The attributes of the Y Axis legend. | |
yAxis.title.label | String | The legend name. | |
yAxis.title.x | Number | - | The horizontal anchor point. |
yAxis.title.y | Number | - | The vertical anchor point. |
plotOptions | Object | It defines how to position the elements of the serie on the chart. | |
plotOptions.plotStart | Number | 0 | The position of the first element of the serie on the X axis. |
plotOptions.pointInterval | Number | 45 | The increment between two elements of the serie. |
- means a computed value.