重点！！！
首先引入
<script src="echarts.min.js"></script>
然后是初始化
var myEcharts=echarts.init(document.getElementById('main');
接着是数据的配置
var option={ }
最后是渲染
myEcharts.setOption(option)
简单使用如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>test_Echarts</title>
<!-- 引入echarts -->
<script src="echarts.min.js"></script>
</head>
<body>
<h1>Echarts案例</h1>
<!-- 定义图标显示区域 -->
<div id="main" style="width:600px;height:400px;"></div>
<script>
// 初始化图表
var myEcharts = echarts.init(document.getElementById('main'));
// 指定图表的配置和数据
var option = {
// x轴上的数据
xAxis: {
data: ['A', 'B', 'C', 'D', 'E']
},
// 设置y轴的数据
yAxis: {},
// 核心数据配置项
series: [{
type: 'bar',
data: [23, 24, 18, 25, 18],
barGap: '20%',
barCategoryGap: '40%'
}, {
type: 'bar',
data: [12, 14, 9, 9, 11]
}]
};
// 渲染图表
myEcharts.setOption(option)
</script>
</html>