HighCharts Summary
HighCharts
It is the most popular chart plug-in and has a wide range of applications. It currently supports graphs, area graphs, 3D graphs, bar charts, pie charts, hash charts, and hybrid charts, it also supports extended special charts, such as meter charts, polar maps, box charts, and waterfall charts. Because it is used at work, I only use the most basic configuration here.
Official Website: www.highcharts.com. If you are interested, you can learn more.
Use
First, download the installation package-highcharts.
Decompress the package, import two js files, and write the code. The simplest example on the official website is as follows:
<! Doctype html>
Directly paste the above Code into the file, modify the js path, and run it.
It also supports dynamic expansion, such as dynamically adding Y axes and dynamically modifying titles.
// Obtain the highcharts object chart =$ ('# chart '). highcharts (); // chart. addAxis ({id: 'precipitation', title: {text: 'rainfall '}, lineWidth: 2, lineColor:' # 08f', labels: {format: '{value} mm', style: {color:' # 08f'}, opposite: true // displayed on the right axis, used when both axes need to be displayed .}); Chart. addSeries ({name: 'rainfall ', type: 'column', color: '# 08f', yAxis: 'precipitation', data: precipitationDatas, tooltip: {valueSuffix: 'mm'}); // dynamically Delete the Y axis. Chart. get ("precipitation"). remove ();
This is the running figure.
OK.