定义
echart是一个将数据可视化的库
可以用于移动设备绘制表格
版本区别
4.0之前底层使用canvas
4.0之后底层使用svg
使用方式
1、导入echart插件
2、准备一个容器
3、获取容器
4、创建echart对象，传入容器
5、配置对象options
6、将配置传递给echarts
<script src="js/echarts.js"></script>
<body>
<div style="width: 500px;height: 400px;border: 1px solid #000000"></div>
<script>
let oDiv=document.querySelector("div");
let oChart=echarts.init(oDiv);
let options={
toolTip:{
show:true,
trigger:"axis"
},
title: {
text: 'ECharts 入门示例',
// subtext: "子标签",
// borderWidth:"5",
// borderColor:"red",
},
toolbox:{
show:true,
feature:{
saveAsImage: {
show:true,
}
}
},
legend: {
data:['销量','产量','容量']
},
series: [{
type: 'pie',
data: [
{value:123,name:"销量"},
{value:456,name:"产量"},
{value:789,name:"容量"},
]
}]
}
oChart.setOption(options);
</script>
</body>
