上篇博客中,介绍了最简单的下载echarts.min.js的方式
这篇实际运用一下echarts.min.js,将其引入HTML中,制作一个柱状图
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>echarts-柱状图练习</title>
<script src="echarts.min.js"></script>
</head>
<body>
<div id="demo" style="height: 500px;width: 500px"></div>
<script type="text/javascript">
var myChart = echarts.init(document.getElementById('demo'));
var option = {
title:{
text:'柱状图',
},
tooltip:{},
legend:{
//图例,说明
data:['重量/kg'],
},
xAxis: {
data:["苹果","香蕉","橘子"]
},
yAxis:{},
series:[{
name:'重量/kg',
type:'bar',
data:[5,8,10]
}],
};
myChart.setOption(option);
</script>
</body>
</html>
效果如图所示: