Link to home
Start Free TrialLog in
Avatar of cofactor
cofactor

asked on

any easy pie chart library ?

I want to use Pie chart in my  jsp web application.

Could you please suggest me an easy to use  library for pie chart

I am looking for a dynamic pie chart like this ...

you may look at this sample pie chart.  This is the type of pie chart I am looking for.

http://www.conceptdraw.com/How-To-Guide/picture/Percentage-pie-chart-DA-determinations.png
Avatar of gurpsbassi
gurpsbassi
Flag of United Kingdom of Great Britain and Northern Ireland image

I would suggest using D3.js. Very powerful library for data visualisation. You should be able to extract out your data into JavaScript.
http://d3js.org/
Avatar of cofactor
cofactor

ASKER

I don't see any pie chart in D3.js .  

I want a very simple and easy to use solution for showing a pie chart like this ..
http://www.conceptdraw.com/How-To-Guide/picture/Percentage-pie-chart-DA-determinations.png

I am very much comfortable with jquery.  But I guess Jquery does not have pie chart.

Does D3.js can help in this regard ?  I am already using Jquery in my web application ....I don't want to use another third party library unless this requirement is filled.
>>>http://www.jqchart.com/jquery/chart/ChartTypes/PieChart

one slice is cut out in this example .... can we keep it same as other slices.
Hi!

Read the Doc section :)
I guess that has something to do with the
 explodedSlices: [5],

keywords.
In the example you see the China data (no 5 in the data-array) exploded.

So if you omit the explodeSlices line no slice will be cut out. Likewise if you put
 explodedSlices: [1,5],
both data/slices for United Kingdom and China will be cut out.

Regards,
     Tomas Helgi
I don't see any pie chart in D3.js .  

There are many examples of D3.js pie charts.

Go to the D3.js site and hit examples, you will find a humongous range of examples.
I am testing JFree chart

I have this code ..

 DefaultPieDataset myServletPieChart = new DefaultPieDataset();
                myServletPieChart.setValue("Maths", 74);
                myServletPieChart.setValue("Physics", 87);
                myServletPieChart.setValue("Chemistry", 62);
                myServletPieChart.setValue("Biology", 92);
                myServletPieChart.setValue("English", 51);        
                JFreeChart mychart = ChartFactory.createPieChart("",myServletPieChart,true,true,false);  
                mychart.setBack
                response.setContentType("image/png"); /* Set the HTTP Response Type */
                ChartUtilities.writeChartAsPNG(out, mychart, 400, 300);

Open in new window



This  generated output like this ...

https://drive.google.com/file/d/0B-XtIZwNPaowSEh6V0hmdU9aeXRJMlM4THBhUmhJMURkc0tz/view?usp=sharing



But I want  to generate output like this...
https://drive.google.com/file/d/0B-XtIZwNPaowS09jLXpxVHR0ck9fUHR1dHBLQkpmVmpUQkVF/view?usp=sharing

Could you please suggest what code I may need to add in my existing snippet ?
@Tomas,
I am using this
               
mychart.getPlot().setBackgroundPaint(new Color(255,255,255,0));

Open in new window

This sets background as transparent....good.

But you missed another part I asked in JFreechart. I  require  the texts  to be inside the slice.
How do I achieve this ?

please see again my desired output :  

https://drive.google.com/file/d/0B-XtIZwNPaowS09jLXpxVHR0ck9fUHR1dHBLQkpmVmpUQkVF/view?usp=sharing

see the text  "Physics" , "Maths" , "English"  etc are inside the slice.  How do I achieve this ?
Hi!

Maybe this helps
PiePlot plot = (PiePlot) chart.getPlot();
plot.setSimpleLabels(true);

http://www.jfree.org/jfreechart/api/javadoc/org/jfree/chart/plot/PiePlot.html#setSimpleLabels%28boolean%29
Otherwise for the labels you should look at PieSectionLabelGenerator
You will probably need to implement/extend that class for your needs.

http://www.ktipsntricks.com/data/ebooks/java/jfreechart-1.0.12-A4.pdf

Regards,
     Tomas Helgi
PiePlot plot = (PiePlot) chart.getPlot();
plot.setSimpleLabels(true);

Open in new window


This worked fine. Thank you.

Now I want to change  the color of each slices of my choice.
Could you please tell how to achieve this ?
I dont like default color of  slices.
Hi!

This is achived by using this
plot.setSectionPaint("Apples", Color.black);
plot.setSectionPaint("Oranges", new Color(120, 0, 120));

I gave you an example on that in my earlier post :)
This one
https://javabeanz.wordpress.com/2007/08/06/creating-pie-charts-using-custom-colors-jfreechart/

Regards,
    Tomas Helgi
I am confused as to where to use your code in my existing snippet.

My present code is ..

DefaultPieDataset dataset = new DefaultPieDataset();
                dataset.setValue("XXXXXXXXXXXXXXX", 40);
                dataset.setValue("yyyyyyyy", 30);
                dataset.setValue("ZZZZZZZZZZZZZZZZZZZZZZ", 30);
                    
                JFreeChart mychart = ChartFactory.createPieChart("",dataset,true,true,false);  
                mychart.getPlot().setBackgroundPaint(new Color(255,255,255,0));
                
                PiePlot plot = (PiePlot) mychart.getPlot();
                plot.setSimpleLabels(true);
                
                response.setContentType("image/png"); 
                ChartUtilities.writeChartAsPNG(out, mychart, 400, 300);

Open in new window


As you see I have 3 different slice in this code.

Now how do I give

slice  XXXXXXXXXXXXXXX  to color  yellow
slice  yyyyyyyy  to color  pink
slice  ZZZZZZZZZZZZZZZZZZZZZZ to color  black

I don't understand where to fit your code into my existing snippet.  Could you please take a look at it.

Thanks
ASKER CERTIFIED SOLUTION
Avatar of Tomas Helgi Johannsson
Tomas Helgi Johannsson
Flag of Iceland image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Thanks. This filled my requirement perfectly.
Excellent