[英]how to understand What is the type of chart displayed in echarts?
I use these options for the chart:我将这些选项用于图表:
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'}};
how to change tootlip formatter in when magicType change?当magicType更改时如何更改tootlip格式化程序?
You can use magictypechanged event.您可以使用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"
}
}
});
}
});
The code above is a modification on this example上面的代码是对这个例子的修改
you can simply check the component subtype, and display the tooltip based on that.您可以简单地检查组件子类型,并根据它显示工具提示。 Although the componentSubType is not documented in the eCharts API, but i found it presented in the formatter's callback parameter尽管 eCharts API 中没有记录 componentSubType,但我发现它出现在格式化程序的回调参数中
sample code:示例代码:
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";
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.