如何在angular6中使用Amcharts4？

Question

我正在angular6项目中实现amcharts4“ Animated-Gauge”演示。

这是我的代码：

StackBlitz

在StackBlitz在线编辑器上工作正常，但是在我的angular6项目中实现时抛出错误。它在第25行发出了错误警告，这是

var axis = chart.xAxes.push(new am4charts.ValueAxis());

当我将鼠标悬停在第25行错误时，就会抛出此错误。

Argument of type 'ValueAxis<AxisRenderer> is not assignable to parameter'
of type Axis<AxisRendererCircular>

这是我的错误图片：

如何解决此问题？

Answer 1

有时您需要给打字稿编译器一些提示，以便它知道您用于量规图表的轴类型。尝试将新的值轴实例修改为：

var chart.xAxes.push(new am4charts.ValueAxis<am4charts.AxisRendererCircular>());

如果在量规图表的类别轴上遇到类似的错误（如果有），请使用

chart.yAxes.push(new am4charts.CategoryAxis<am4charts.AxisRendererRadial>());

还请确保您的本地项目具有TypeScript> = 2.8.1（stackblitz使用3.1.1），并确保tsconfig.json中包含以下行，如here

所述

{
  "compilerOptions": {
    "strictNullChecks": false,
    "strictFunctionTypes": false
  }
}

Answer 2

转到第25行，然后替换此行。

var axis = chart.xAxes.push（new am4charts.ValueAxis（）：any）;

实际上问题是，您不是在声明数据类型

将类型分配为“ any”。它会工作，并且您不会再收到错误