今天項(xiàng)目用到了echarts做統(tǒng)計(jì)词顾;
做如下總結(jié):
echarts是Apache開(kāi)源項(xiàng)目缆蝉,特別好用朴译,可以做各種統(tǒng)計(jì)圖坏快;
先去echarts的官網(wǎng)看一下:https://www.echartsjs.com/zh/index.html
項(xiàng)目引用echarts.js文件
使用echarts總共分三步:
第一步:初始化一個(gè)chart
var myChart =echarts.init(document.getElementById( [ID] ));
第二部:做一個(gè)option
var option = {
? ? xAxis: {? type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] },
? ? yAxis: {? type: 'value'? },
? ? series: [{ data: [820, 932, 901, 934, 1290, 1330, 1320], type: 'line'? }]
};
第三部:把option裝進(jìn)去
myChart.setOption(option);
【注意事項(xiàng)】
1. chart應(yīng)該放在一個(gè)有高度的父控件中
2. option有各種各樣的屬性,詳細(xì)設(shè)置直接找官網(wǎng)例子和api唯卖,十分給力粱玲,實(shí)在找不到了再百度;
3. 統(tǒng)計(jì)圖窗體自適應(yīng) 拜轨,參考博客:https://blog.csdn.net/YLH19970086/article/details/80071823
? ??window.onresize =function(){for(var i = 0; i<charts.length;i++){charts[i].resize;}}