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:

Copy codeThe 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:

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:

Function showChart4 (names, values) {var chartObj = new ChartObject (); var xmlString = ""; chartObj. caption = "sales comparison of vehicles 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:

Copy codeThe 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:

The above is all the content of this article. If you need it, you can refer to it.