网站首页 > 开源技术 正文
ECharts是一个使用 JavaScript 实现的开源可视化库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器（IE9/10/11，Chrome，Firefox，Safari等），底层依赖矢量图形库 ZRender，提供直观，交互丰富，可高度个性化定制的数据可视化图表。
从官网下载echarts库，其中一个是echarts.js。下面实例就是用了这个js。
试了一下官网提供的入门示例：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>echarts实例1</title>
<script src="echarts.js"></script>
</head>
<!--为echart准备一个定义了宽高的DOM!-->
<body>
<div id="main" style="width:650px;height:500px;"></div>
<script type="text/javascript">
//基于准备好的dom，初始化echarts实例
var myChart=echarts.init(document.getElementById('main'));
//制定图标的配置项和数据
var option ={
title:{
text:'echart入门实例'
},
tooltip:{},
legend:{
data:['销量']
},
xAxis:{
data:['电冰箱','洗衣机','空调','电饭锅','空气炸锅','高压锅']},
yAxis:{},
series:[
{
name:'销量',
type:'bar',
data:[500,200,300,1000,1000,300]
}
]
};
//使用上述自定的配置项和数据显示图表
myChart.setOption(option);
</script>
</body>
</html>
官网网址：
https://echarts.apache.org/zh/index.html
猜你喜欢
- 2024-10-11 前端开发:推荐开源图形库——数据可视化
- 2024-10-11 这些好用的前端开发工具/框架，你用了么?
- 2024-10-11 Echart可视化学习笔记(五)（echarts数据可视化原理）
- 2024-10-11 百度数据可视化实验室正式成立，发布深度学习可视化平台 Visual DL
- 2024-10-11 亲测!这些好用的数据可视化工具，真的爽到了
- 2024-10-11 快速入门前端图表插件E-chart（前端图表可视化工具）
- 2024-10-11 AI知识小科普丨知识图谱的主要技术你了解吗?
- 2024-07-05 数据可视化—Echarts图表应用（echarts数据可视化书）
- 2024-07-05 优化无止境，爱奇艺中后台 Web 应用性能优化实践
- 2024-07-05 小颖的前端框架（2020主流前端框架）
欢迎 你 发表评论:
- 最近发表
- 标签列表
-
- jdk (81)
- putty (66)
- rufus (78)
- 内网穿透 (89)
- okhttp (70)
- powertoys (74)
- windowsterminal (81)
- netcat (65)
- ghostscript (65)
- veracrypt (65)
- asp.netcore (70)
- wrk (67)
- aspose.words (80)
- itk (80)
- ajaxfileupload.js (66)
- sqlhelper (67)
- express.js (67)
- phpmailer (67)
- xjar (70)
- redisclient (78)
- wakeonlan (66)
- tinygo (85)
- startbbs (72)
- webftp (82)
- vsvim (79)
本文暂时没有评论，来添加一个吧(●'◡'●)