首页 > 编程知识 正文

用一个小例子快速上手echarts,apache echarts

时间:2023-05-06 19:19:05 阅读:248992 作者:1396

echart下载安装|以及第一个echart图表快速上手 echart官网网站从GitHub下载解压缩,在dist文件夹下找到echarts.min.js写第一个图标文件结果展示

echart官网网站

Apache ECharts: https://echarts.apache.org/zh/index.html.

从GitHub下载




选择一种压缩文件下载

解压缩,在dist文件夹下找到echarts.min.js

写第一个图标文件

讲echarts.min.js复制出来,在该文件夹下写一个html文件,将以下这段代码键入html文件,游览器打开运行出结果。

<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>ECharts</title> <!-- including ECharts file --> <script src="echarts.min.js"></script></head><body> <!-- prepare a DOM container with width and height --> <div id="main" style="width: 600px;height:400px;"></div> <script type="text/javascript"> // based on prepared DOM, initialize echarts instance var myChart = echarts.init(document.getElementById('main')); // specify chart configuration item and data var option = { title: { text: 'ECharts entry example' }, tooltip: {}, legend: { data:['Sales'] }, xAxis: { data: ["shirt","cardign","chiffon shirt","pants","heels","socks"] }, yAxis: {}, series: [{ name: 'Sales', type: 'bar', data: [5, 20, 36, 10, 10, 20] }] }; // use configuration item and data specified to show chart myChart.setOption(option); </script></body></html> 结果展示


到此为止,Apache ECharts下载安装完成,以及第一个echart图表快速上手。

正则表达式的基本语法有哪些

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。