Question

我正在使用Angular 7，highcharts和highcharts-angular渲染3个甜甜圈图。但是，由于某些原因，它们没有呈现。

这里是stackblitz来说明问题。

我遵循了此tutorial使其正常工作，但是没有工作。

所有3个图表都正确获得了选项，但这些图表未呈现。

<div id="chart{{chartIndex}}">
<highcharts-chart>
  [Highcharts] = "highcharts" 
  [options] = "options"
  style = "width: 100%; height: 100%; display: block;"
</highcharts-chart>
</div>

Answer 1

您的hc-chart组件中的html中有错字：

<highcharts-chart>
  [Highcharts] = "highcharts" 
  [options] = "options"
  style = "width: 100%; height: 100%; display: block;"
</highcharts-chart>

您的选项未传递到highcharts-chart组件。

将代码更改为：

<highcharts-chart
  [Highcharts] = "highcharts" 
  [options] = "options"
  style = "width: 100%; height: 100%; display: block;">
</highcharts-chart>
</div>

请注意角撑杆>的移动。

Here是更新的StackBlitz。

highcharts-angular不呈现图表

1 个答案: