我想从JSON'Wind_direction'值动态更改极坐标图上的startAngle值。 代码如下:
$(function() { $.getJSON('wind_graph.php?callback=?', function(dataWind) { var direction = Wind_direction; var polarOptions = { chart: { polar: true, events : { load : function () { setInterval(function(){ RefreshDataWind(); }, 1000); } } }, title: { text: 'Wind Direction' }, pane: { startAngle: direction, }, xAxis: { tickInterval: 15, min: 0, max: 360 }, plotOptions: { series: { pointStart: 0, pointInterval: 30, }, } }; // The polar chart $('#graph-1').highcharts(Highcharts.merge(polarOptions, { yAxis: { tickInterval: 5, min: 0, max: 25, visible: false }, series: [{ type: 'line', name: 'Direction', data: [ [0, 0], [direction, 20] ], } ] })); function RefreshDataWind() { var chart = $('#graph-1').highcharts(); $.getJSON('wind_graph.php?callback=?', function(dataWind) { var direction = Wind_direction; chart.series[0].setData([[0,0],[direction, 20]]); }); } }); });在最后一个函数中,在'chart.series [0] .setData下面...我试图添加这样的东西:
chart.pane.setStartAngle(direction);但是这会引发错误:“无法读取未定义的属性'startAngle'”
还在尝试另一个想法:
polarOptions.pane({ startAngle: direction });但这里有错误:“polarOptions.pane不是一个函数”。
所以我是堆栈。 请帮忙。
I want to dynamically change the startAngle value on my polar chart from JSON 'Wind_direction' value. The code is below:
$(function() { $.getJSON('wind_graph.php?callback=?', function(dataWind) { var direction = Wind_direction; var polarOptions = { chart: { polar: true, events : { load : function () { setInterval(function(){ RefreshDataWind(); }, 1000); } } }, title: { text: 'Wind Direction' }, pane: { startAngle: direction, }, xAxis: { tickInterval: 15, min: 0, max: 360 }, plotOptions: { series: { pointStart: 0, pointInterval: 30, }, } }; // The polar chart $('#graph-1').highcharts(Highcharts.merge(polarOptions, { yAxis: { tickInterval: 5, min: 0, max: 25, visible: false }, series: [{ type: 'line', name: 'Direction', data: [ [0, 0], [direction, 20] ], } ] })); function RefreshDataWind() { var chart = $('#graph-1').highcharts(); $.getJSON('wind_graph.php?callback=?', function(dataWind) { var direction = Wind_direction; chart.series[0].setData([[0,0],[direction, 20]]); }); } }); });In the last function, below 'chart.series[0].setData... I was trying to add something like this:
chart.pane.setStartAngle(direction);but this throws the error: "Cannot read property 'startAngle' of undefined"
Also was trying another one idea:
polarOptions.pane({ startAngle: direction });but here is error: "polarOptions.pane is not a function".
So I'm stack. Please for help.
最满意答案
您应该能够使用Chart.update()更新所有图表选项。 不幸的是,它看起来对窗格没有任何影响 - 我在这里报告了这个问题。
现在,您可以通过破坏和创建新图表来更新窗格 - http://jsfiddle.net/highcharts/qhY8C/
另一种可能性是尝试解决方法 - 为窗格设置选项,删除窗格并更新轴 - 它应该创建一个带有新选项的新窗格。
const xAxis = chart.xAxis[0]; chart.options.pane.startAngle = 45; Highcharts.erase(chart.panes, xAxis.pane); chart.yAxis[0].update(null, false); xAxis.update();示例: http : //jsfiddle.net/v8L381Lj/
You should be able to update all chart options with Chart.update(). Unfortunately, it looks that it does not have any effect on pane - I reported the issue here.
Now you can update the pane in old-fashioned way - by destroying and creating a new chart - http://jsfiddle.net/highcharts/qhY8C/
The other possibility is trying the workaround - set options for pane, remove the pane and update the axis - it should create a new pane with new options.
const xAxis = chart.xAxis[0]; chart.options.pane.startAngle = 45; Highcharts.erase(chart.panes, xAxis.pane); chart.yAxis[0].update(null, false); xAxis.update();example: http://jsfiddle.net/v8L381Lj/
更多推荐
发布评论