问题标签 [highcharts-ng]

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 回答
6490 浏览

javascript - 用于具有动态 ajax 数据的 Highcharts 的 AngularJS

我通过集成两个示例来学习 Javascript 和 AngularJS:Spring MVC 和 AngularJS以及AngularJS 和 Highcharts

这个看似简单的任务让我困惑了几天:在 Spring REST 驱动的后端中,我添加了带有属性“价格”的 Book 类,这是一个代表图书每月或每年价格的双精度数组。AngularJS 客户端通过将以下代码添加到 html 来显示“价格”:

以及控制器的以下代码:

该表使用来自后端的数据动态更新。相当整洁和优雅!

令我困惑的是highcharts部分。我在 html 中添加了以下内容:

以及控制器的“价格”的一些静态值:

hichcharts 与 AngularJS 配合得很好。

然后我尝试通过向控制器添加一些代码来更新从后端到图表的动态“价格”:

或者

一段时间后意识到这是对 AngularJS 的一种非常幼稚的理解。我也遵循了中描述的方式

如何使用来自 Ajax 请求的 json 数据生成高图(使用 Angular js)但未成功。

有没有像上面显示的价格表那样优雅的方式来显示来自后端的动态数据?

0 投票
2 回答
458 浏览

javascript - 关闭点标记似乎不适用于 Highcharts-ng

我正在尝试使用highcharts-ng关闭折线图上的标记。

我检查了 highcharts API,我相信我需要传递选项:

但是,我在 highcharts-ng 中尝试了这个,它似乎没有工作,我很困惑。这是一个稍作修改的股票示例,我通过此选项无效:http: //jsfiddle.net/BnnVN/

0 投票
1 回答
5620 浏览

javascript - Highcharts-ng 指令(Angular)未更新

我正在使用highcharts-ng Angular-JS 指令在我的页面上绘制图表。

我希望能够更新控制器中的数据,并将这些值反映在图表中。但是,当我使用赋值更新 $scope 变量时,例如:

...然后图表不会更新。我可以更新图表的唯一方法是将值推送到数据中,例如:

...但是这仅在第一次执行时才有效。这是一个 JS-fiddle 显示我的意思:http: //jsfiddle.net/K6hL8/

我是 Angular 的新手,所以我想在开始指责第三方指令之前检查我的 Angular 代码是否存在明显问题(也许我误解了 $scope 和双向绑定?)。

提前致谢!

编辑:

所以看起来(在这个小提琴中:http: //jsfiddle.net/K6hL8/)Angular确实看到了chartData的变化(我已经放了一个带有警报的手表),但只有当watch被称为“true “为了平等。指令中的所有手表都使用'true',所以我很难过......

0 投票
1 回答
13128 浏览

angularjs - 更新图表中的数据,使用角度的 highcharts,highcharts-ng

为 Angular 的 highcharts-ng 尝试一个 highcharts 指令。https://github.com/pablojim/highcharts-ng

我在更新数据时遇到了一些问题。更新系列值没问题。但我无法更新 X 轴标题。我在这里有一个 js-fiddle http://jsfiddle.net/user1572526/3stqK/2/

我的工厂有chartConfig:

然后我将它暴露在我的控制器中:

最后是一个设置一些新值的函数

除 X 轴外,一切正常。

知道这里有什么问题吗?

0 投票
1 回答
407 浏览

angularjs - angular.js 使用 highcharts-ng 不维护系列顺序,除非我强制 $apply (这会引发已经在进行中的错误)

这可能无法修复,但我希望有人之前可能遇到过这个问题并找到了解决方法。

Highcharts-ng 似乎将系列数据与现有数据合并在一起,以至于我无法保持系列的顺序。我特别想展示两个系列,从左到右分别称为 A 和 B(因为表单控件是这样组织的)。

所以,我从 A 系列开始,然后我添加一个 B,然后更改A,现在它的顺序是 B 和 A。

我查看了 highcharts-ng 代码,我可以理解它发生的原因(参见下面的 processSeries 方法)。

我能够开始工作的唯一解决方法是完全重置系列数据并调用 $apply,这当然不能在另一个应用的中间进行。

我真的很想知道是否有我可以设置的选项,或者其他一些解决方法可以让我按照自己的意愿使用它,而不必求助于编辑指令。

非常感谢!

0 投票
2 回答
5862 浏览

javascript - Highcharts-ng 与向下钻取

我一直在我的 angularjs 项目中使用 highcharts-ng。一切都做得很好,但现在我需要使用一些钻取来详细说明我的信息,并且使用 Drilldown.js 无法正常工作。我按照highcharts'drilldown tryout fiddle上给出的示例进行操作,但它似乎不适用于angular-ng。原始Highchart 示例不适用于 angular-ng,正如您在我的向下钻取复制中看到的那样。关于出了什么问题的任何想法?

忽略下面的代码(stackoverflow 想要这个问题中的一些代码)

0 投票
1 回答
1240 浏览

javascript - Highcharts-ng 重置缩放

我在使用 highcharts-ng 时遇到了这个问题:当我尝试将新数据系列推送到图表中已经存在的数据系列上时,新系列将使用旧缩放进行缩放。我的问题是:有没有办法在加载后缩放到新系列的默认值?

PS:函数 zoomOut() 不适用于 highcharts-ng。

不管怎么说,多谢拉

0 投票
3 回答
3083 浏览

angularjs - 是否可以使用 highchart-ng 进行自定义渲染?!

我尝试使用 Highcharts Renderer创建自己的自定义形状。不幸的是,我找不到调用那些methods.

甚至可以使用 Highchartsmethods吗?与highcharts-ng?!

我的笨拙

我的代码:

0 投票
1 回答
703 浏览

charts - 向 Highcharts-ng 添加渐变饼图功能

我在应用程序中使用 Highcharts-ng。一切正常。我已经成功地在 javascript 文件中添加了一个额外的“drilldown”属性——太棒了!但是如何添加饼图渐变填充的代码呢?

我的困难是它使用“Highcharts.map”和“Highcharts.Color”的事实?

0 投票
0 回答
121 浏览

angularjs - highchart-ng边框不显示

我有一个无法显示边框的图表。

我设置相关属性的代码:

除边框外,上述代码的其他所有内容都可以正常工作。还有什么我需要做的吗?我在 Highchart 论坛上问了同样的问题,但没有得到答复,所以我希望这里有人可以帮助我。