Highcharts 添加动态钻取

Question

当从 api 获取数据时，drilldown 事件对象为 null 并且在控制台中出现错误：“无法读取 null xAxis 的属性”，由 null e.point 引起

这里是现场示例：https://stackblitz.com/edit/highcharts-angular-line-ovpnfa?file=src%2Fapp%2Fapp.component.ts

Answer 1

首先，要使用钻取，您需要导入模块并对其进行初始化。

import * as Highcharts from 'highcharts';
import Drilldown from 'highcharts/modules/drilldown';
Drilldown(Highcharts);

文档：https://github.com/highcharts/highcharts-angular#to-load-a-module

另一个问题是您将对象数组而不是单个对象传递给 addSeriesAsDrilldown() 方法。

const series = {
    type: 'pie',
    name: 'Documente',
    data: [
        {
            name: 'Test 1',
            y: 500,
            drilldown: 'test2',
        },
        ['123', 400],
        ['1345', 300],
        ['432', 245]
    ]
};

chart.addSeriesAsDrilldown(e.point, series as Highcharts.SeriesOptionsType);

演示：https://stackblitz.com/edit/highcharts-angular-addseriesasdrilldown
API：https://api.highcharts.com/class-reference/Highcharts.Chart#addSeriesAsDrilldown
https://api.highcharts.com/class-reference/Highcharts#.SeriesOptionsType