问题标签 [ngx-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 回答
312 浏览

javascript - 构建新版本的 ngx-charts

我正在尝试为 ngx-charts 添加个人所需的功能。我使用标准的 src 目录让它工作,但是我想潜在地构建一个发布版本。

以下是重现该问题的步骤:

  1. npm i https://github.com/swimlane/ngx-charts/tarball/master --save(这抓住了整个项目,而不仅仅是发布)
  2. 进入您的node_modules/@swimlane/ngx-charts文件夹并删除发布目录
  3. 通过运行重建目录npm i && npm run package
  4. 请注意 index.d.ts 是如何无法找到任何模块的,即使它们在那里。

我注意到由于/common/base-chart.component.d.ts某种原因导致此问题从未创建该文件。但是,我终其一生都无法弄清楚为什么。我尝试了多个 webpack 版本 2-4,但是每次尝试都会导致相同的结果。

我相信我做错了什么,这就是我没有打开问题的原因。我将不胜感激对此问题的任何见解。感谢您的阅读!

0 投票
0 回答
600 浏览

angular - Angular5 Ngx-chart:甜甜圈图 - 内外标签

1.我们如何在图表下方为图表添加标题。2.我们如何在Angular ngx-chart的甜甜圈圈内添加标签。

提前致谢。

0 投票
1 回答
4071 浏览

angular - ngx-charts:组合多种图表类型

我需要用 ngx-charts 实现一个图表(参见:https ://github.com/swimlane/ngx-charts ),它将多种图表类型组合为一个。我已经在这里找到了组合图表组件示例,它结合了折线图和垂直条形图,但我需要的是折线图和散点图(气泡图)。我想了解组合图表示例背后的代码,以便能够将任何 2 个(或更多)图表类型组合成一个,但由于没有文档,我无法弄清楚源代码的哪些部分属于折线图和条形图。

在整个万维网中,没有其他示例可以使用 ngx-charts 将 2 种(或更多)不同的图表类型组合成一个。

谁能解释我需要从上面的示例中更改什么以使用气泡图而不是条形图?

...或者甚至可能提供一个完成的示例,我只需要复制并粘贴到我的项目中?:)

(我使用 angular 6 和 ngx-charts 9,但如果需要,我可以升级)

0 投票
0 回答
479 浏览

angular - 输入属性在 ngx-charts 模板中不起作用

根据这个答案,我确实想出了下面的代码可以正常工作:

现在我想将结果作为输入参数传递:

但它只是不能以这种方式工作,图表只是没有显示,我在控制台中也看不到任何错误。但是,我通过将输入值分配给我声明的另一个组件属性来想出窍门:

所以这种方式它可以工作,但我想知道你如何在不引入新变量和做黑客之类的情况下正确地做到这一点this.data = this.result;

0 投票
1 回答
2247 浏览

angular - 访问图表的 css 和 html 结构 [ngx-charts]

有谁知道是否有一种简单的方法来操作 ngx-chart 生成的图形的 css 和 html 结构?

例如,我希望能够将 x 轴的标签从图表底部移动到顶部。

我的图表

任何提示将不胜感激,谢谢!

0 投票
1 回答
58 浏览

aurelia - 有没有办法将 Ngx-Charts 与 Aurelia 框架一起使用?

我想在我的 Aurelia 应用程序中使用 ngx-chart 的一些图表,有没有办法做到这一点?

0 投票
0 回答
275 浏览

angular - 当 [showAxis]="false" 时如何使 ngx-charts-gauge 工具提示出现在弧附近

我正在使用带有单个结果集的 ngx-charts-gauge,我设置了 [showAxis]="false" 因为我不想要轴。但在弧形提示悬停时显示远离弧形。

我尝试使用#tooltipTemplate,但没有运气。

下面是我的数据源

在此处输入图像描述 单= [ {“名称”:“德语”,“价值”:8940000,“数据”:[ {“位置”:“底部”}]

0 投票
1 回答
6020 浏览

angular - Angular NGX-Charts:使用自定义图例

这里有一个先前的问题,但我需要澄清答案并且没有足够的代表发表评论。寻呼用户@Maya Sol。

我正在尝试重新创建她的答案,但我没有成功,我想知道我哪里出错了。

我没有收到任何错误,我可以看到图例标题,但图例中没有内容。

0 投票
2 回答
421 浏览

angular - 在具有多个数据集的 ngx-chart 中删除偶数、奇数类?

ngx-chart 中是否有配置来删除下图中的灰色背景:https ://embed.plnkr.co/2eQ9jheOTm8i74vp2EmP?show=preview

0 投票
0 回答
1187 浏览

angular - 错误类型错误:无法读取未定义的属性“toString”,ngx-charts

我之前在这里问过一个问题, 最后我找到了解决方案,但是图表上有问题,我们必须显示 4 条图表线但没有显示,第一条图表线(订单系列)是问题,没有图表线出现。但是,当我禁用其他(3 个其他图表线)并启用第一条图表线时,只出现第一条图表线。

在我的浏览器控制台中出现:

错误类型错误:无法读取 Object.eval [as updateRenderer] (XAxisTicksComponent.html:5) at Object.debugUpdateRenderer [as updateRenderer] (core.js: 11948) 在 checkAndUpdateView (core.js:11320) 在 callViewAction (core.js:11556) 在 execEmbeddedViewsAction (core.js:11519) 在 checkAndUpdateView (core.js:11316) 在 callViewAction (core.js:11556) 在 execComponentViewsAction ( core.js:11498) 在 checkAndUpdateView (core.js:11321)

在搜索修复它后,我在我的 .html 文件中添加了:

在我的 .ts 文件中:

console.log(this.ticks)返回:

图 1

图 2

这是我在 .ts 文件中的代码:

这是我在 .html 文件中的代码:

如何解决问题?

请帮帮我 。

先感谢您