问题标签 [ng2-charts]

我正在尝试使用 NG2-Charts 的基本图表（http://valor-software.com/ng2-charts/）

我复制粘贴了 HTML 部分

和 TypeScript 部分

我跑npm install ng2-charts --save和 npm install chart.js --save。然后我导入<script src="node_modules/chart.js/src/chart.js"></script>我的index.html.

在此之后，我将它导入到我的 AppModule 中：

然后我添加'ng2-charts':'npm:ng2-charts/bundles/ng2-charts.umd.js'到我的systemjs.config.js

现在我也尝试执行我的 Angular 2 应用程序，但出现以下错误：

和

我希望你能帮助我们，因为我发现没有任何解决方案有效。

我正在尝试将 ng2-charts 与 Angular 4.0 一起使用，我希望通过使用 chart.js 来获得与此处相同的内容：

我所做的是

我添加了

到 src/index.html

和

到 src/app/app.module.ts

你能给我展示一个 src/index.html、src/app/app.component.html 和 app/component.ts 的工作示例吗？因为我有一些问题，例如示例

即使我更改了 chart.js 的位置。

src/index.html

src/app/app.component.html

src/app/app.component.ts

这是我的 components.ts。我想编写一个按计数对数组进行排序的函数，我将使用 html 中的排序数组数据来创建图表。

我想知道有没有一种方法可以控制要显示的标签数量 - 我知道有这个stepSize功能，但那是数字的。我正在寻找类似的东西interval:3，它会在图表上显示每三个标签。

这就是我渲染图表的方式：

html:

在我的 component.ts 中，我有：

我一直很难找到能够向我展示有关如何控制/自定义图表及其属性的所有可能功能的文档。

我想知道我是否在horizontalBar图表中显示数据有没有办法让长标签文本换行？我的图形大小受该功能的影响，我找不到允许我包装标签文本的方法。

我还想知道是否有一个属性，这样我就可以用条形图控制图形的实际宽度，而不影响垂直标签的宽度。所以我可以为垂直标签文本提供更多空间，而为图形部分提供更少空间。

这是我目前渲染图表的方式：

我有一个图表，上面有两条线。我希望当我将鼠标悬停在两条线中的任何一条上时，小工具提示框会显示该 x 点处两个点的值。是否有可能做到这一点？

这个想法是将chart.js与Angular 4和ng2-charts一起使用。我正在使用此处的示例，但无法使其正常工作。

我收到以下错误消息：

无法绑定到“数据”，因为它不是“画布”的已知属性

我已经将它导入 app.module.ts，因为大多数帖子都建议出现此错误。有什么我想念的吗？

...组件.html：

...组件.ts

索引.html：

app.module.ts：

系统.js

包.json：

我无法在Angular Seed中编译生产 AOT 构建（“npm run build.prod.rollup.aot”） - 在我的应用程序中实现ng2-charts之后（当我运行“npm run start.deving - 我本来可以看到图表，但 Karma UnitTesting 会失败 - 在 ***.spec.ts 文件中）。

我正在尝试将折线图放入一些非常小的表格单元格中：

如您所见，最右边点的工具提示被略微截断。这是唯一导致问题的一个。

最简单的解决方法可能是在工具提示上放一个更高的 z-index，但我已经用谷歌搜索了它，我认为这是不可能的。相反，是否可以将工具提示显示在该点的左侧而不是其下方？这就是倒数第二点的作用：

这是我的图表选项：

任何帮助表示赞赏。

图表一直运行良好，但突然就不行了。 这是问题的演示。

如您所见，工具提示是透明且闪烁的，它们不会移动到我悬停的下一个点。此外，当我单击它们的标签时，图例不会打开/关闭线条。

这是我的选择：

和 HTML：

编辑：它似乎与我的数据集和标签有关。我从 valor-software 的网站复制了折线图，它一直有效，直到我使用我自己的标签和数据集。还没有弄清楚他们有什么问题。