javascript - Angular HighCharts ParlimentChart 不工作

Question

您好，我正在尝试将 Parliment 图表用于 Angular highchart。这个链接是关于js但我想以 Angular 使用它。在 html 中

  <highcharts-chart [Highcharts]="Highcharts" [options]="chartOptions" [(update)]="updateFromInput" [oneToOne]="oneToOne"></highcharts-chart>

在组件中

Highcharts: typeof Highcharts = Highcharts;
  updateFromInput = false;
  chartOptions = {
    chart: { type: 'item'},title: { text: ''},subtitle: { text: ''},
    legend: {labelFormat: '{name} <span style="opacity: 0.7">{y}</span>'},
    series: [{
        keys: ['name', 'y',  'label'],
        dataLabels: { enabled: true, format: '{point.label}'},
        center: ['50%', '88%'], size: '170%', startAngle: -100,endAngle: 100,
        data: [
            ['The Left', 69,  'DIE LINKE'],
            ['Social Democratic Party', 153, 'SPD']
        ],
    }]
  };

当我运行它在下面给出错误
错误

Error: Highcharts error #17:www.highcharts.com/errors/17/?missingModuleFor=item

• missingModuleFor: item

如何以 Angular 运行议会图表。这是 demo这不起作用

Answer 1

我通过添加它的图表 js 库来解决它。在 js 文件中的这种类型图表中，您可以看到运行图表使用

<script src="https://code.highcharts.com/modules/item-series.js"></script>

对于 Angular 部分，我们需要从模块中导入它

import ItemSeries from 'highcharts/modules/item-series';

然后使用 ItemSeries(Highcharts);接受它