Angular HighCharts ParlimentChart 不起作用

pc_*_*der 5 javascript highcharts angular

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

  <highcharts-chart [Highcharts]="Highcharts" [options]="chartOptions" [(update)]="updateFromInput" [oneToOne]="oneToOne"></highcharts-chart>
Run Code Online (Sandbox Code Playgroud)

在组件中

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']
        ],
    }]
  };
Run Code Online (Sandbox Code Playgroud)

当我运行它时给出以下错误

错误

错误:Highcharts 错误 #17: www.highcharts.com/errors/17/?missingModuleFor=item

  • missingModuleFor: 项目

如何以角度运行议会图表。这是不工作的演示

pc_*_*der 6

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

<script src="https://code.highcharts.com/modules/item-series.js"></script>
Run Code Online (Sandbox Code Playgroud)

对于角度部分,我们需要从模块中导入它

import ItemSeries from 'highcharts/modules/item-series';
Run Code Online (Sandbox Code Playgroud)

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