Angular2高图表中的切换选项

我正在用Angular2和TypeScript编写SPA Web应用程序。 屏幕的重要部分被Highcharts图形区域占据， 其中可能有几个完全不同的图形（具有不同的比例、图例等，因此有不同的选项）。 所以最初我在这里指定了Options1（OptionsDflt），但用户可以与应用程序交互， 它应该显示选项2或选项3。。。 那么有没有办法改变选项呢（到目前为止，我还没有成功，我试过setOptions（），update（），draw（）-运气不好）

或者将每个图形放在面板上，像一堆卡片一样操作，这有意义吗

这是我的一段代码，也许会有帮助

因此，在Angular2.0页面模板中，我将HighCharts图形定义为：

<chart id="linechart" (load)="saveChart($event.context)" [options]="optionsDflt" ></chart>

then in Constructor I define optionsDflt and options1.

optionsDflt : Object; 
options1 : Object; 
chart1 : any; 

saveChart(chart) {
this.chart1 = chart; 
}

onUserClick() { // that is where it should switch to graph defined by options1
// populate options1 series with data from JSON retrieved from DB
// populate xAxis categories 
this.chart1.xAxis[0].setCategories(this.options1.xAxis.categories, true);

// here I try to set options1 in chart1 - but all 3 lines give me that it "is not a function"
this.chart1.update(this.options1);
this.chart1.setOptions(this.options1);
this.chart1.redraw(this.options1);

this.saveChart(this.options1); // tried that also - did not work
}

然后在构造函数中定义optionsDflt和options1。
选项DFLT：对象；
选项1：对象；
图1：任何；
保存图表（图表）{
this.chart1=图表；
}
onUserClick（）{//这是它应该切换到由选项1定义的图形的位置
//使用从数据库检索到的JSON数据填充options1系列
//填充xAxis类别
this.chart1.xAxis[0].setCategories（this.options1.xAxis.categories，true）；
//在这里，我试图在图表1中设置选项1，但所有3行都告诉我它“不是一个函数”
this.chart1.update（this.options1）；
this.chart1.setOptions（this.options1）；
此.chart1.重新绘制（此.options1）；
this.saveChart（this.options1）；//也尝试过-不起作用
}

知道如何将图形设置为选项1吗

我做错什么了吗

我对海图很陌生，对安格拉尔2也很陌生

请告知

蒂亚，

---

Oleg.

您尚未在图表标记中定义单击事件。应该是这样的，这是朝着正确方向迈出的好一步。现在尝试在onClick中修改它，它实际上正在更改为另一个选项。比如：onClick（）{this.chart.update（this.options1）；//或者this.chart1.update（this.options1）；}这对我不起作用。