在高图标点上单击事件后更改页面输出视图

Question

我的主页面显示多个图表，我可以选择如果用户点击某个条形图或图表上的点，它将更改页面视图以显示所点击的点上的相对内容。

我的问题是，我不确定如何正确连接我的内容，以便我仍然显示我的菜单栏，但我的主页内容将与点击点的数据一起切换。

点击事件是通过highcharts，这有点让我失去了如何正确实现这一点。

这是我的主要内容：

import { Router } from '@angular/router';  

constructor(private myService: MyService, private router: Router) {}

plotOptions: {
                      bar: {
                          dataLabels: {
                              enabled: false
                          }
                      },
                      series: {
                          pointWidth: 15,
                          cursor: 'pointer',
                          point: {
                              events: {
                                  click: function(event: any){
                                     //navigate to another component
                                  }
                              }
                          }
                      }
                  }

我会在newComponent.ts或newComponent.html中链接吗？我不确定需要哪些其他信息来提供帮助，但我会很感激任何意见。

Answer 1

当您提出类似

之类的内容时，您可能会使用Highcharts Drilldown

  

当您点击条形图上的条形图时，它应该分解为解释所单击条形图的子条形图。

这张图片是来自JSFiddle的快照，用于解释

的想法

供您参考：

Highcharts Column with Drilldown
Highcharts Map Drilldown