问题标签 [ng2-charts]

如何更改图例的位置（默认显示在图表顶部）？我正在使用ng-charts，我正在尝试根据文档更改位置，但它似乎不起作用。

该模板包含以下内容：

组件变量是：

我ng2-charts正在开发我的 Angular-cli 构建应用程序。我很新，所以任何帮助表示赞赏。我在 Firebase 上有数据设置。我在服务中创建了一个方法来访问该数据，并且当我使用此代码时

控制台记录正确的数据。

前任。[1000, 5000, 2000]

问题是当我更改方法以返回结果时，如下所示：

并尝试将其分配给组件中的变量。我总是得到以下控制台日志：

我已经看到了不同的方法来获得我想要的结果，例如使用flatMap，Observable.combineLatest() 但我无法获得任何其他结果。我有 json 数据，我想将其作为数组分配给一个变量，以便在我的条形图中显示它。

图.ts

我想分配firstVar新的 Firebase 数据。有什么建议么？

我通常访问这样的方法：

我的问题是，我想看看悬停时每个点之间的区别。fe 我有 5,4,3 点，所以我不想在悬停时看到 5,4,3。我想看 0（因为它是起点）、1、1。

有人能帮助我吗。

谢谢

我正在尝试开始使用 ng2-charts。我以前从未见过从 node_modules 目录中嵌入 .js，因为它们在此处指定：

我正在使用 Angular CLI。据我了解，没有提供 node_modules 目录，如果是，我不知道如何访问它。

我确实尝试复制这些包并在 src/ 中链接到它们，但我得到：

我不知道这应该如何工作，所以我试图找到一个工作示例。即使在Github 上的项目中，这种嵌入的唯一示例也在自述文件中。

我刚开始使用 angular2，我做了英雄之旅教程： https ://angular.io/docs/ts/latest/tutorial/

我更进一步，做了一些自定义代码，一切都很好。

但是，当我尝试使用 ng2-chart 模块时，我无法使其工作：http: //valor-software.com/ng2-charts/

我做了这个

还有这个

但是，将 js 导入我的索引文件时，这不起作用：

所以我不得不用这个来修复它：

接下来是让我头疼的部分：

我总是得到

很高兴知道如果我导入

我的服务器哭了

要记住的事情：我对 js 和 angular2 世界真的很陌生，我仍然不太了解这里的工作原理。我见过一些人和我有同样问题的人，但我不明白答案/我不能使用它们，因为我的应用程序架构是英雄之旅中的架构，我对 angular2 不太熟悉来改变它目前。

我怀疑有 3 个问题：我应该将“ng2-charts”绑定到“node_modules/ng2-charts”/路径本身是错误的/应该“编译”ng2-charts 以生成一些 .js 文件，但事实并非如此。

一些可以提供帮助的信息：

（如果有人可以给我一个链接以了解如何将英雄架构之旅打包到生产中，那就太好了）谢谢大家

通过将此添加到我的 systemjs.config.js 文件中解决了问题：

希望有一天它会帮助某人

我的 HTML 标记如下所示，我使用的是依赖于 chart.js 的 NG2-Chart 库的饼图：

我已经编写了以下代码添加它工作得很好。我也可以看到图表并获得对事件处理程序的调用。我的组件代码（工作）如下所示：

但是当我尝试从 Web 服务获取数据并将其分配给饼图时，我得到了奇怪的错误。我的组件代码（不工作）：

我最初得到的错误堆栈树如下：

例外：未捕获（在承诺中）：TypeError：无法设置只有 getter 的 [object Object] 的属性堆栈 TypeError：无法设置在 assignAll 处只有 getter 的 [object Object] 的属性堆栈（http://localhost:3000 /node_modules/zone.js/dist/zone.js:704:29）在 ViewWrappedError.ZoneAwareError （http://localhost:3000/node_modules/zone.js/dist/zone.js:775:16）在 ViewWrappedError.BaseError [作为构造函数] ( http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:1104:38 ) 在 ViewWrappedError.WrappedError [作为构造函数] ( http://localhost:3000/node_modules /@angular/core/bundles/core.umd.js:1133:20）在新的 ViewWrappedError （http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:5106:20）在_View_HomeComponent_Host0.DebugAppView._rethrowWithContext（http://localhost:3000/node_modules/@angular/core/bundles /core.umd.js:9427:27 ) 在 _View_HomeComponent_Host0.DebugAppView.detectChanges ( http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:9413:22 ) 在 ViewRef_.detectChanges ( http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:7398:24）在RouterOutlet.activate（http://localhost:3000/node_modules/@angular/router/bundles/router .umd.js:3458:46 ) 在 ActivateRoutes.placeComponentIntoOutlet (http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:2955:20 ) 在 ActivateRoutes.activateRoutes ( http://localhost:3000/node_modules/@angular/router/bundles/router .umd.js:2933:26 ) at eval ( http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:2902:23 ) at Array.forEach (native) at ActivateRoutes.activateChildRoutes ( http://localhost:3000/node_modules/@angular/router/bundles/router.umd.js:2901:33 ) 在 ActivateRoutes.activate ( http://localhost:3000/node_modules/@angular/router/bundles/路由器.umd.js:2896:18 )

在互联网上挖掘后，我意识到这不是真正的错误。我在互联网上找到了一些建议以找到真正的错误，而我发现的真正错误是：

“TypeError：Chart.controllers[meta.type] 不是 Chart.Controller 的构造函数。( http://localhost:3000/node_modules/chart.js/dist/Chart.bundle.js:8508:24 ) 在 Object. helpers.each ( http://localhost:3000/node_modules/chart.js/dist/Chart.bundle.js:9345:15 ) 在 Chart.Controller.buildOrUpdateControllers ( http://localhost:3000/node_modules/chart.js /dist/Chart.bundle.js:8497:12 ) 在 Chart.Controller.initialize ( http://localhost:3000/node_modules/chart.js/dist/Chart.bundle.js:8356:7 ) 在新图表。新图表 ( http://localhost:3000/node_modules/chart.js/dist/Chart 的控制器 ( http://localhost:3000/node_modules/chart.js/dist/Chart.bundle.js:8339:6 )。 bundle.js:10684:21) 在 BaseChartDirective.getChartBuilder ( http://localhost:3000/node_modules/ng2-charts/components/charts/charts.js:73:16 ) 在 BaseChartDirective.refresh ( http://localhost:3000/node_modules/ng2-charts /components/charts/charts.js:114:27 ) 在 BaseChartDirective.ngOnInit ( http://localhost:3000/node_modules/ng2-charts/components/charts/charts.js:18:18 ) 在 Wrapper_BaseChartDirective.detectChangesInInputProps (/ ChartsModule/BaseChartDirective/wrapper.ngfactory.js:89:53) 在 _View_HomeComponent0.detectChangesInternal (/AppModule/HomeComponent/component.ngfactory.js:74:32) 在 _View_HomeComponent0.AppView.detectChanges ( http://localhost:3000/node_modules /@angular/core/bundles/core.umd.js:9305:18) 在 _View_HomeComponent0.DebugAppView.detectChanges ( http://localhost:3000/node_modules/@angular/core/bundles/core.umd.js:9410:48 ) 在 _View_HomeComponent_Host0.AppView.detectViewChildrenChanges ( http://localhost:3000/ node_modules/@angular/core/bundles/core.umd.js:9331:23 ) 在 _View_HomeComponent_Host0.detectChangesInternal (/AppModule/HomeComponent/host.ngfactory.js:33:8)"

我不知道从这里去哪里。我在 ng2-charts gihub repo 上发布了问题。我被困住了，我将非常感谢您的帮助。

我不确定如何将插件准确地导入 ng2-charts，特别是注释插件。我正在使用 Angular2 / Ionic2。似乎没有任何文档或答案。

我需要一个像这样的非常简单的图表

我知道如何使用 chart.js

，但看起来使用 ng2-charts 并不那么容易。我有这个

1）我需要不同的颜色 2）对齐问题（当我通过将长标签分隔为数组来修复长标签时）

更新 终于我来了

剩下的唯一问题是我想要底部的标签，但我可以用 html

我正在使用 ng2-charts 并需要一个复合条形图和折线图。这可能吗？

目前我可以让条形图和折线图分开工作，我的模板看起来像......

我目前正在开发一个使用 angular 2 并在项目中使用 ng2-charts 的应用程序。该项目由cordova包裹后在浏览器中运行良好。但是，一旦使用 cordova 在 iOS 上运行，所有 ng2-charts 都不会显示。

我想知道是因为 ng2-chart 和 iOS 不兼容还是其他原因？

非常感谢。:)

例如，饼图组件在 iOS 上不起作用，但在浏览器中显示良好。这是我的 pie-chart.component.ts 代码：

pie-chart.html 的代码：