如何简单使用echarts实现数据可视化？

01 echarts简介

• 百度开发团队制作，开源交个apache基金管理
• 制作图表的javascript库
• 同类型产品hightCharts  D3

02 echarts步骤

1. 初始化

var echart = echarts.init(dom节点,主题)

2. 定义选项option

const option = {
 title标题
 legend图例
 color调试版本
 tooltip提示
 xAxis 轴线X
 yAxis 轴线Y
 series 系列数据
}

3. 更新选项

echart.setOption(option)

03 选项 option

标题 title：text 文本

图例 legend：{data:["name1","name2"]}

提示 tooltip

x轴线：{data:["x1","x2",...]}

y轴线：{data:["y1","y2",...]}

系列数据：

bar 柱状图

{
name:"名称",
type:"bar",
data:[10,{value:10}],
itemStyle:{color:xxx}
}

line

{
   name:“名称”，
   t