Flex Charting Example: Data Based Renderers
June 6th, 2006
There’s been a discussion going on FlexCoders today about extending charts, how easy/hard it might be, and how to make a PieChart that renders the wedges in a different color based on the value of the wedge.
Rather than spend a lot more time arguing about it and justifying the tradeoffs of more features vs. more extensibility in the Flex Charts, I thought maybe I’d just shut up and write it myself ;)
Check out the example here, then come back and leave feedback and comments.
June 6th, 2006 at 10:30 am
Would this serve as a good starting point for a renderer that renders each wedge with a potentially different radius? (similar to the radiusField in a BubbleSeries)
June 6th, 2006 at 11:10 am
Hi Martin. A custom renderer like this would be a quick and dirty way to get that kind of a render. But to do that right, you’d probably want to add an extra axis of data to the series itself (which is how the bubbleSeries does it). Assuming you have an abitrary range of data, you’ll need to compare all the values in the chart to figure out what the max and min is and scale them appropriately, which is what the axes are for. If you have a fixed min/max that you know your data will fall within, you could just take this code, look up the extra data value you care about, , divide it by your max, and use that fraction to scale the radius.
Also, if you want labels on the chart, you’ll need to extend the series to make sure they pick up the adjusted wedge values.
I’ll see if I can throw an example together to get you started.
June 7th, 2006 at 8:38 am
Nothing appears on your flash pages. Im using OS X with firefox 1.5.0.2
December 12th, 2006 at 1:27 pm
Great blog Ely,
Your examples and code help and inspire more then you’d ever know :)
That said, i’m getting an error page trying to download the dataBasedRenderer example :(
Routing Error
Recognition failed for “/dataBasedRenderers/srcview/DataBasedRenderers.zip”
January 30th, 2007 at 9:34 am
This is very useful information, and repurposing the code to render items in a plot chart was easy enough until I tried to use dynamic data for the values of StopLightThreshold. I’m using . The item renderer’s getFill method ignores any threshold with a binded value. in the Flex Language Reference shows a working example of using outerDocument. I assume the problem has something to do with the qc namespace, but I haven’t found a way around it yet. Any ideas?
May 10th, 2007 at 8:28 pm
Just starting to look at Flex charting for work. Some of your demos fit neatly into what we want to do buT i am a bit stymied by lack of doco e.g. How do I write a data renderer thta changes the colour of a bubblechart datapoint based on a function (eg countries in america are blue, countries in Europe are green etc).
Second your demo of zooming axes (can’t get them to pan) is good but it no longer displays the axis title. Is there more detailed doco about how to subclass the chart components?
June 28th, 2007 at 10:24 pm
Hi,
How to Create a scatterd graph?
can we use buuble graph or Plot Graph of Flex?
Requirement is like there were two values x and y.
So (x,y) = (10,20) , (10,22), (10,23), (11,23) etc
for each point there will be a dot.
July 3rd, 2007 at 7:14 am
How to get coordinate of Graph when user click on the graph with respect to X’s and Y’s values
July 10th, 2007 at 5:42 pm
hi guys I have just started looking into flex and actionscript
.. i want to make a chart using charting component …
can I have a line drawn in the suppose a Bar graph representing the average…