echarts 使用一些配置项整理
1、刻度控制
min:0, //取0为最小刻度 max: 100, //取100为最大刻度 min:'dataMin', //取最小值为最小刻度 max: 'dataMax', //取最大值为最大刻度 min: function(value) {//取最小值向下取整为最小刻度 return Math.floor(value.min) }, max: function(value) {//取最大值向上取整为最大刻度 return Math.ceil(value.max) }, scale: true, //自适应 minInterval: 0.1, //分割刻度
2、控制图表位置(也可限制大小)
grid: { left: "12", right:'35%', top:'0', bottom:'0', containLabel: true, },
3、控制轴字体样式
splitLine: { show: false, }, inverse:true,//翻转顺序 axisLabel: { textStyle: { color: "white", //y轴字体颜色 fontSize: "16", align: "left", }, },
4、series 表中data显示
{ // name: '销量', type: "bar", data: [28.71, 19.45, 15.91, 10.15, 6.53, 5.16,3.59,3.03,2.40,1.92,1.52,1.35,0.20,0.09,0.01,0.00,0.00], itemStyle: { //上方显示数值 normal: { label: { show: true, //开启显示 position: 'right', //在上方显示 textStyle: { //数值样式 color: 'white', fontSize: 16 } } } }, barWidth: 20, //柱图宽度 },
5、柱状图阴影
{//shadow
type:'bar',
name:'目标',
barWidth: 20, //柱图宽度
barGap:'-100%',//左移一个位置
barCategoryGap:'0%',
data:[10,15,18,20,22,24,26,30,25,24,22,20,18,16,14,10,10,10,10,10,10,10,10],
itemStyle: { //上方显示数值
normal: {
color:'rgba(220, 220, 220,0.4)',
label: {
textStyle: { //数值样式
color: 'white',
fontSize: 16
}
}
}
},
},
个人随笔,各位大牛见谅哈,毕竟头一次写这玩意儿,不喜勿喷,也是为了我自己后边使用的方便才这么写的

浙公网安备 33010602011771号