Echarts
ECharts,缩写来自Enterprise Charts,商业级数据图表,是百度的一个开源的数据可视化工具,提供了丰富的图表库,能够在PC端和移动设备上流畅运行
官网:
https://echarts.apache.org/zh/index.html
官方使用教程:
https://echarts.apache.org/zh/tutorial.html#5%20%E5%88%86%E9%92%9F%E4%B8%8A%E6%89%8B%20ECharts
使用它要下载对应的js文件
https://github.com/apache/incubator-echarts/releases
有一些比如词云图在拓展下载里面
https://echarts.apache.org/zh/download-extension.html
示例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="../static/js/echarts.min.js"></script> </head> <body> <div id="main" style="width: 600px;height: 800px;"></div> <script> var ectest = echarts.init(document.getElementById("main")); var option = { xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, yAxis: { type: 'value' }, series: [{ data: [1820, 932, 1901, 1934, 1290, 1330, 1320], type: 'line' }] }; ectest.setOption(option); </script> </body> </html>
直接运行就是这样
var option= 是怎么来的呢
https://echarts.apache.org/examples/zh/index.html 在官网的实例
点开一个图
复制这里的option就行了