根据官网的配置手册,看legend的配置项中有个_height_设置组件的高度,但是我试的时候没体现出效果来,而宽度_width_的设置是起作用的。
1.
2.
是不是文档没描述清楚,要配合其它配置一起用才能起作用?
因为我在对legend设置_tooltip_时也遇到了个问题, 文档的描述是“_图例的 tooltip 配置,配置项同 tooltip_”,我以为是跟tooltip一样去配置legend的_tooltip_,然而我配置的时候一直都没起作用, 后面还是添加了顶级的tooltip的时候legend的_tooltip_才起作用的,类似下面的配置:
{
tooltip: {
trigger: 'item'
},
legend: {
....
tooltip: {
show: true
}
},
}
var legendData = [
'option1option1option1option1option1',
'option2option2option2option2option2',
'option3option3option3option3option3',
'option3option3option3option3option4',
'option3option3option3option3option5',
'option3option3option3option3option6',
'option3option3option3option3option7',
'option3option3option3option3option8',
'option3option3option3option3option9',
]
var xAxisData = ['Day 1', 'Day 2']
var series = []
$.each(legendData, function(i, k){
series.push({
yAxisIndex: 0,
name: k,
type: 'line',
data: [
parseInt((Math.random() + 3) *10),
parseInt((Math.random() + 2) *10)
]
})
})
var l = ['充值人数', '充值金额', '测试1']
option = {
grid: [
{x: '7%', y: '20%', height: '75%'}
],
tooltip: {
trigger: 'item'
},
legend: {
zlevel: 3,
borderColor: 'rgb(191, 191, 191)',
borderWidth: 2,
height: 100, // 100、100px、80%这样的都试过
data: legendData,
tooltip: {
show: true
}
},
xAxis: {
type: 'category',
boundaryGap: false,
data: xAxisData
},
yAxis: {
type: 'value',
name: '充值人数'
},
series: series
}
orient="horizontal"的时候,只有width会起作用,height为auto;orient="vertical"的时候只有height会起作用,width为auto。感觉文档方面要多多完善才行啊,而且讲道理的话, 一般都不会有人希望legend的宽度会超出整个图吧~
Most helpful comment
orient="horizontal"的时候,只有width会起作用,height为auto;orient="vertical"的时候只有height会起作用,width为auto。感觉文档方面要多多完善才行啊,而且讲道理的话, 一般都不会有人希望legend的宽度会超出整个图吧~