echarts3 条形图,设置barWidth的大小后,再设置barMaxWidth的大小,当barWidth的大小超出barMaxWidth的大小之后,实际显示以barWidth为准,也就是说,这里设置的barMaxWidth限制不起作用
1.1.引入echart3.2.2的js包,
2.option属性见下面
条形图中,设置barWidth后,再加上barMaxWidth的限制之后,如果barWidth超出范围,以barMaxWidth为准。
option = {
title : {
show : true,
text : '城市天气预报',
subtext : '杭州天气',
left : 'center',
top : 'bottom',
},
grid : {
left : 50,
top : 60,
right : 150,
bottom : 160,
borderWidth : 0,
},
tooltip : {
show : true,
showContent : true,
trigger : 'item',
triggerOn : 'mousemove',
formatter : '',
islandFormatter : '{a} < br/>{b} : {c}',
},
legend : {
show : true,
orient : 'horizontal',
left : 'center',
top : "top",
selectedMode : true,
data : [ {
name : '蒸发量',
}, {
name : '蒸发量2',
} ],
},
toolbox : {
show : false,
orient : 'horizontal',
feature : {
dataZoom : {
show : false,
},
dataView : {
show : false,
readOnly : false,
},
magicType : {
show : false,
},
restore : {
show : false,
},
saveAsImage : {
show : false,
},
}
},
xAxis : [ {
show : true,
type : 'category',
boundaryGap : true,
name : '',
nameLocation : '',
axisLine : {
show : true,
onZero : true,
},
axisTick : {
show : true,
onGap : false,
inside : false,
},
axisLabel : {
show : true,
},
splitLine : {
show : true,
},
splitArea : {
show : false,
},
data : ["2:00", "2:15", "2:30", "2:45", "3:00", "3:15", "3:30", "3:45", "4:15", "4:00", "4:30", "4:45"],
}, ],
yAxis : [ {
show : true,
type : 'value',
boundaryGap : true,
}, ],
series : [ {
name : '蒸发量',
z : 0,
type : 'line',
data : ["3", "5", "6", "13", "12", "13", "19", "17", "25", "13", "16", "11"],
markPoint : {
data : [ {
type : 'max',
name : '最大值'
}, {
type : 'min',
name : '最小值'
} ]
},
markLine : {
data : [ {
type : 'average',
name : '平均值'
} ]
},
}, {
name : '蒸发量2',
z : 0,
type : 'bar',
barWidth : 10,
barMaxWidth : 30,
data : [ 13, 15, 17, 23, 22, 23, 29, 27, 25, 28, 22, 27 ],
markPoint : {
data : [ {
type : 'max',
name : '最大值'
}, {
type : 'min',
name : '最小值'
} ]
},
markLine : {
data : [ {
type : 'average',
name : '平均值'
} ]
},
}, ],
}
barGap也没起作用
barWidth 优先级比 barMaxWidth 高
如果说barWidth 优先级比 barMaxWidth 高,感觉这点不能理解,只能默默接受barWidth 优先级比 barMaxWidth 高这个事实了