问题标签 [ng2-charts]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
1043 浏览

javascript - 有没有办法将 rxjs 与 ng2-charts 一起使用?

我找不到使用 ng2-charts 实现实时图表的方法。

当我这样做时出现错误:

我认为,即使我让它以某种方式工作,这也是最糟糕的方式。


如果没有解决此错误的方法,请推荐任何其他具有内置实时图表的库。


编辑:

app.component.html:

app.component.ts:

0 投票
2 回答
679 浏览

angular - ng2-chartjs2 Ionic 2 如何添加选项

我基于这个项目做了一个带有 ng2-chartjs2 图表的小型 ionic2项目。我需要添加选项,并且没有关于如何添加它的文档。这是我的项目回购

我的选项代码片段。

主页.html

任何意见将是有益的。

0 投票
2 回答
567 浏览

angular - Angular 2 & ng2-charts:(SystemJS)导入了意外的指令“BaseChartComponent”

我正在尝试使用 Node.js 后端让 ng2-charts 模块与我的 Angular 2 应用程序一起使用。这是我的app.module.ts文件

当我运行应用程序时,我在浏览器控制台中收到的消息如下:

在此处输入图像描述

所以我做了一些探索node_modules/ng2-charts/ng2-charts.js,这就是我所看到的:

然后我去components/charts/charts.js,这是代码的最后一行

我该如何解决这个问题?

后编辑- 我改变了app.module.ts所以CHART_DIRECTIVES现在是declarations,这是我得到的新错误:

在此处输入图像描述

这是app.component.ts--- 请记住,在我尝试添加chart.jsng2-charts.js

app.component.ts

0 投票
0 回答
914 浏览

javascript - Angular 2 - (SystemJS) 无法解析 AppComponent 的所有参数:(?, ?).(...)

我正在尝试构建一个应用程序,但我遇到了一个又一个的障碍,而就在我认为我突破的时候,我没有。现在,曾经接受 AppComponent 的应用程序,一旦我介绍了 ng2-charts.js,现在不接受了。我收到此错误:

在此处输入图像描述

我正在使用 System.js 和 Node.js 来运行这个应用程序。我已经卸载并重新安装了我的节点模块文件夹。这是我app.module.ts和我的 app.component.ts 文件:

app.module.ts

app.component.ts

需要注意的是,socket.io 在子组件中使用和声明,但我注释掉了子组件中的代码以确保这不是问题。对此的任何帮助将不胜感激。

0 投票
1 回答
5249 浏览

angular - ng2-charts - 无法绑定到“数据集”,因为它不是“基本图表”的已知属性

版本:Cordova:6.3.1,Gulp CLI:1.2.2,Ionic 框架:2.0.0-rc.0,Ionic CLI 版本:2.1.0


我在我的 ionic2 应用程序中使用ng2-charts

导入不是import {ChartsModule} from "ng2-charts"; 因为import {ChartsModule} from "ng2-charts/components/charts/charts;"这个(issue #440)

我的整个app.module.ts

图表组件

我认为这可能是Chart.js. 而且我发现在我的 aschart.js中引用它时,使用 npm 安装会导致 404 。index.htmlnode_modules/chart.js/src/chart.js

所以我下载了Chart.bundle.min.js在这不起作用之后我尝试下载Chart.js本身。(把它放在src/assets/js/...)。

ng2-charts\ng2-charts.js does not export ChartsModule 的评论部分也解决了这个问题。但是由于没有提供答案,而且这不是根本问题,所以我发布了这个。

错误:(抑制错误消息无济于事,因为它会阻止我的应用程序加载)。

0 投票
1 回答
487 浏览

angular - ng2-Charts 未填充信息首次加载

我有一个 ng2-charts 实现,我只是在其中显示一些信息。我有两个选项卡,一个带有表格,一个带有图表。当我最初进入第一个选项卡时,折线图为空,但在我切换回选项卡后,信息被加载。

这是我的 Component.ts

的HTML:

我有一个加载信息的父组件,因此子组件(图表选项卡和表格选项卡)可以使用此信息。

此 HTML 如下所示:

如果我需要提供更多代码问我,但我认为这已经足够了。我现在遇到的问题是图表正在显示,但它应该等待显示何时显示他的信息。我应该通过为此详细视图实施“主要”路线解析来解决此问题吗?

0 投票
1 回答
10595 浏览

javascript - Angular2 ng2-chart 自定义?

我已经开始使用 angular2 ng2-chart。我对使用 angular2 ng2-chart 创建的下图有几个问题,但仍想进行更多自定义:

示例图表

问题:

1)当没有像上图 Nov-7 中的值具有值 0(零)时,如何在两点之间绘制虚线?

2) 如何制作阴影效果、不透明度或多种颜色的组合?

3)当我将鼠标悬停在任何定义的点上时,如果我想在鼠标悬停时更改 y 轴网格颜色,如何获取 y 轴的值。使用 ng2-chart 悬停功能的最佳方法是什么?

当前示例代码和配置文件:

索引.html

index.component.ts

配置文件:

0 投票
0 回答
115 浏览

angular - 如何从 ng2-Chart 中的另一个页面获取数据?

angular2 的新手,我已经开始使用 angular2 ng2-chart。关于自定义如何从另一个页面获取图表数据并且需要应用宽度和高度,我几乎没有问题

我得到数据甜甜圈数据如何整合价值、颜色、标签

应用程序.compound.ts

需要将此数据集成到 app.compound.ts

0 投票
0 回答
1055 浏览

javascript - 使用ng2-charts在Angular2组件内绘制垂直线?

我正在使用最新的 ng2-charts 版本1.4.1和 chart.js 2.4.0。有人可以告诉我如何使用 ng2-charts 或 chart.js 制作一条垂直线

点击http://jsfiddle.net/dbyze2ga/14/

我想用 ng2-charts 画线。如何访问 Angular2 component.ts 文件中的 chart.js?

0 投票
1 回答
12110 浏览

angular - 调整 ng2 图表的宽度和高度

如何使用 ng2-charts 设置图表的宽度和高度?我正在制作条形图,就像 ng2-charts 网站上的演示一样。