嗨,伙计们,我一直在做 highcharts ,我陷入了一个逻辑,我找不到一个方法。如果有人能帮助我,这将是非常有帮助的。
HTML格式
<highcharts-chart
id="container"
[Highcharts]="Highcharts"
[options]="chartOptions"
style="width: 100%; height: 400px; display: block;"
>
</highcharts-chart>
TS文件
chartoptions:Highchart.options
chartOneRender() {
this.chartoptions = {
title : {
text: "Chsart1",
},
exporting : {
sourceWidth: 1500,
sourceHeight: 300,
scale: 1,
enabled: true,
buttons: {
contextButton: {
menuItems: ["viewFullscreen", "downloadCSV", "downloadPNG", "downloadPDF"],
theme: {
stroke: '#adaaaa00',
fill: '#adaaaa00',
},
y: 10,
x: 0,
},
custom: this.buttonClicker(optionchart)
}
},
series : [
{
name: "s1",
type: 'column',
data: [20,30,40,50]
visible: true,
}, {
name: "s2",
type: 'column',
data: [90,98,76,54],
visible: false,
}, {
name: "s3",
type: 'column',
data: [67,78,89,54],
visible: false,
},
{
name: "s4",
type: 'column',
data: [89,78,65,45],
visible: false,
},
{
name: "s5",
type: 'column',
data: [78,56,90,98],
visible: false,
}
],
}
}
buttonClicker(chartOptions: any) {
var button = {
y: 10,
x: -630,
text: 'Select All',
theme: {
stroke: '#000',
states: {
hover: {
stroke: '#298AFC',
fill: '#fff'
},
select: {
stroke: '#298AFC',
fill: '#fff'
}
}
},
onclick: () => {
this.chartOptions.series.update({
visible:true
})
this.chartOneRender()
}
return button
}
在上面有一个函数称为buttonClicker()
我想选择所有的图例,同时点击按钮。如果有人知道任何解决方案,请帮助我。
1条答案
按热度按时间q7solyqu1#
在您的代码中,
this.chartOptions.series
引用图表中的所有序列。您需要对所有序列和update()
分别进行迭代。简化的演示:https://jsfiddle.net/BlackLabel/oL45egh8/
**API参考:**https:api.highcharts.com/class-reference/Highcharts.Series#update