如何理解echarts中显示的图表类型是什么



我对图表使用以下选项:

option = {
legend: {},
tooltip: {},
label :{},
toolbox:{ show: true,
feature: {
magicType: {
type: ['bar','line','stack']
},
}},
tooltip :{
show: true,
formatter: params=> {
return params.value[params.value.length-1];
}
},
dataset: {
source: data
},
xAxis: {type: 'category'},
yAxis: {},
series: {type: 'bar'}};

当magicType更改时,如何更改中的tootlp格式化程序?

您可以使用magictypechanged事件。

option = {
color: ['#3398DB'],
legend: {},
toolbox: {
feature: {
magicType: {
type: ['line', 'bar', 'stack']
}
},    
},
tooltip: {
trigger: 'axis',
axisPointer: {            
type: 'shadow'        
}
},
grid: {
left: 100,
right: 100,
bottom: 100,
top: 100,
containLabel: true
},
xAxis: [
{
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
axisTick: {
alignWithLabel: true
}
}
],
yAxis: [
{
type: 'value'
}
],
series: [
{
name: 'test',
type: 'bar',
barWidth: '60%',
data: [10, 52, 200, 334, 390, 330, 220]
}
]
};

myChart.on('magictypechanged', function(e) {
if (e.currentType === "line")
{
myChart.setOption({
legend: {
textStyle: {
color: "#0f0"
}
}
});
}
else {
myChart.setOption({
legend: {
textStyle: {
color: "#000"
}
}
});        
}
});

上面的代码是对这个示例的修改

您可以简单地检查组件子类型,并在此基础上显示工具提示。虽然在eCharts API中没有记录componentSubType,但我发现它出现在格式化程序的回调参数中

示例代码:

formatter: params=> {
if(params.componentSubType == "line")
return "LINE logic";
else if(params.componentSubType == "bar")
return "BAR logic";
else if(params.componentSubType == "stack")
return "STACK logic";
else
return "default logic";
}