PDA

View Full Version : Pie Charts angle



marco.napetti
18 Jul 2014, 12:17 AM
Hello everybody,
I was trying to generalize the tips for the charts series for ExtJs 4.2.
For "generalize" I mean creating a renderer for the tip that doesn't know the field related to the focused sprite.

In many series, for example in column series, the work is easy, the item passed to the renderer has an array "value" property which on first position has xField's value and on second position has yField's value.

On pie series it isn't true, the value field is inside the "slice" object, but the value itself isn't really comprensible, it would work better as a percentage.
I was looking to understand the angle fields, knowing the angle is equivalent to knowing the percentage, but I can't understand the data, is it in radiants?
I has no sense, how can an angle be like -70000 radiants?
Can somebody help me understand this please?

This is an example of the data I can find inside item:

endAngle: -71474.10614044641
endRho: 115
index: 1
margin: 0
middle: Object { x=120.7382400455893, y=110.96874464680093}
rho: 115
series: Object { chart={...}, seriesId="pie", seriesStyle={...}, other elements...}
shadows: [Object { id="ext-sprite-1867", transformations=[0], surface={...}, other elements...}, Object { id="ext-sprite-1869", transformations=[0], surface={...}, other elements...}, Object { id="ext-sprite-1871", transformations=[0], surface={...}, other elements...}]
slice: Object { series={...}, value=499036, startAngle=-20679.208063897204, other elements...}
sprite: Object { id="ext-sprite-1905", transformations=[0], surface={...}, other elements...}
startAngle: -20679.208063897204
startRho: 0
storeItem: Object { raw={...}, modified={...}, data={...}, other elements...}

slemmon
29 Jul 2014, 9:30 AM
Hi,

You might check out the example at the top of the Pie series' API doc page. Its tip renderer displays the percentage of the slice.
http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.chart.series.Pie

*to understand the angles you'll need to dig into the pie series' source code. Check out the series' rad and accuracy properties and the drawSeries method - though if it were me I'd just that example in the API docs. :)