The jfreechart plug-in displays data as pie charts, bar charts, and line charts.

The jfreechart plug-in displays data as pie charts, bar charts, and line charts.

This article introduces how to display a bar chart. Of course, this is only one method. There are also many ways to display charts, such as customizing chart labels and using the jfreechart plug-in;

1. Importing a js file contains many display methods:

The Code is as follows:

<Script type = "text/javascript" src = <select: link page = "/js/ChartObject. js "/> </script> <script type =" text/javascript "src = <select: link page ="/js/FusionCharts. js "/>></script>

 

2. obtain data from the backend:

1 2 3 4 5 6 7 8 9

Function init (){   Var name3 = "<% = request. getAttribute (" accountlist. name ") %> "; Var value3 = "<% = request. getAttribute (" accountlist. values ") %> "; Var rate3 = "<% = request. getAttribute (" accountlist. valueshb ") %> "; ShowChart4 (name3, rate3 ); // ShowChart3 (name3, value3 ,"");   }

3. Assign data to the legend:

1 2 3 4 5 6 7 8 9 10 11 12

Function showChart4 (names, values ){ Var chartObj = new ChartObject (); Var xmlString = ""; ChartObj. caption = "vehicle sales comparison chart of each carrier "; ChartObj. showValues = '0 '; ChartObj. showLabels = '1 '; ChartObj. sNumberSuffix = '% 25 '; XmlString = chartObj. createDualYMSColumnXmlByValues (names, values, "", "sales ratio = cigarette sales % vehicle capacity ;",""); Var chart = new FusionCharts ("Charts/MSColumn3DLineDY.swf", "ChartId2", "1000", "230", "0", "0 "); Chart. setDataXML (xmlString ); Chart. render ("chartDiv2 "); }

4. On the jsp page, you only need to write:

 

The Code is as follows:

<Div style = "margin-top: 3px; margin-left: 3px;"> <span id = "chartDiv2" style = "width: 100%; "> </span> </div>

 

5. The results are as follows: