首先導入echarts的包 <script src = "js/echarts.min.js"></script>
<style>
.box{
width:300px;
height:300px;
background:lightgreen;
}
</style>
<body >
<div class="box"></div> //設置一個div用來做放置圖表的容器。
<script>
//1.echarts初始化。
var myChart = echarts.init(document.querySelector(".box"));
//2.設置圖表配置項
var option = {
xAxis: {
type: 'category', //該部分可從echarts官網來獲得option內的代碼。
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
yAxis: {
type: 'value'
},
series: [{
data: [120, 200, 150, 80, 70, 110, 130],
type: 'bar',
showBackground: true,
backgroundStyle: {
color: 'rgba(220, 220, 220, 0.8)'
}
}]
};
myChart.setOption(option); //配置
</script>
</body>
