前端ECharts可视化框架快速上手详解(一)

var xDataArr = [‘张三’,‘李四’,‘王五’,‘闰土’,‘小明’,‘茅台’,‘蘑菇头’,‘王炸’,];

var yDataArr = [88,92,63,77,94,80,72,86];

var option = {

xAxis: {

type: ‘category’,

data: xDataArr,

},

yAxis: {

type: ‘value’,

},

series: [

{

name: ‘语文’,

type: ‘bar’,

data: yDataArr,

}

],

};

// 4.使用刚指定的配置项和数据显示图表。

myChart.setOption(option);

3.1、柱状图常见效果

---

3.1.1、标记

• 标记：最大值、最小值、平均值

• markPoint、markLine、

3.1.2、显示

• 显示：数值显示、柱宽度、横向柱状图

• label、barWidth、更改 x轴和 y轴的角色

4、折线图

=======================================================================