As jquery, mootools, prototype, and other well-known JavaScript frameworks become more and more powerful, browsers support the CSS attributes of the latest version, except for flash applications on pages, chart applications become more and more widely used. This article provides you with six practical jquery chart plug-ins, which outline their respective functions and advantages.
1.Flot
In terms of interactivity, the effects of flot charts implemented by jquery and those implemented by Flash are very similar. The chart output is smooth and smooth, with a focus on visual effects. You can also use it with data points data nodes. When you move the cursor to a data node, you will get feedback about the value description of the corresponding node.
As shown in, you can also select a part of the graph table to obtain data in these special regions. You can also zoom in on data nodes.
Advantages: A combination of lines, nodes, area fills, bar charts, and the above functions.
2.Sparklines
Sparklines is my favorite micro-chart implementation tool. It truly implements a visual chart style (you will know what it looks like when you log on to your Google Analytics ). Another good function is to help implement self-refresh in all chart plug-ins.
Advantages: Combination of wedge, lines, bar charts, and the above functions.
3.Google charts plugin
Google charts plugin is a very simple way to apply Google charts APIs to web programs through the jquery plug-in. This API is also very easy to use. Simple jquery call is allowed to set the parameters you need:
. ATTR (<span> 'src' </span>, API. make (<span> <strong >{</strong> </span> data: [[<span> 153 </span>, <span> 60 </span>, <span> 52 </span>], [<span> 113 </span>, <span> 70 </span>, <span> 60 </span>], [<span> 120 </span>, <span> 80 </span>, <span> 40 </span>] <strong >}</strong> ))
Advantages: Column chart, overlapping column chart, line, wedge, 3D wedge.
4.Jquery chart
Jquery chart does not seem to be a very nice chart plug-in. It also implements basic functions, but its usage is very flexible and easy to use.
Instance (add value to chart)
. Chartadd ({"label": "leads", "type": "line", "color": "#008800", "values": ["100 ", "124", "222", "44", "123", "23", "99"]})
Advantages: A combination of blocks, lines, bar charts, and the above functions.
5.Jqchart
Jqchart supports drag and drop actions and animation conversion in charts. If your CSS application is good enough, you can achieve good chart appearance. Compared with other plug-ins, The jqchart implementation function seems to be a bit single.
Advantages: Bar chart and line
6.Tuftegraph
The bar chart generated by tuftegraph is exquisite and can be stacked. Compared with flot, tuftegraph can also reduce the pressure and make it lighter.
Advantages: Column chart, overlapping column chart.
The chart effects achieved through jquery in the above 6 versions have their own advantages and limitations. You can select and use them based on your project requirements. Our principle is: simple, practical, and compatible.