javascript Highcharts - 如何正确更新 VUMeter 的 series[0].data 和 yAxis 标题？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20119347/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Highcharts - how to properly update series[0].data and yAxis title of a VUMeter?
提问by Stefano Bragaglia
I am preparing a VU Metergraph in Highcharts to display an array of values.
These values are displayed one at a time, by choosing an <OPTION>of a <SELECT>.
I managed to understand how to change the titleof the graph to match the selected labelof the <OPTION>, but unfortunately I am a noob and I was not able to properly update the dataof the series.
我正在VU MeterHighcharts 中准备一个图表来显示一组值。这些值一次显示一个，通过选择<OPTION>一个<SELECT>。让我进一步了解如何改变title图形以匹配选定的label的<OPTION>，但不幸的是我是一个小白，我是不是能够正确地更新data的series。
A minimal working exampleis available on jsFiddle. In particular, the following function is fired when the <SELECT>is changed:
jsFiddle上提供了一个最小的工作示例。特别是，当更改时会触发以下函数：<SELECT>
$('#receptorsList0').change(function() {
var selectedOption = $("#receptorsList0 option:selected");
var selectedValue = selectedOption.val();
var selectedText = selectedOption.text();
alert("i: "+selectedOption+", val: "+selectedValue+", text: "+selectedText);
// 1. Possible?
chart.yAxis.setTitle({ text: table[selectedText] + '<br/><span style="font-size:8px">' + selectedText + '</span>' });
// 2. Doesn't work, suggestions? Same with chart.series[0].update(...)
chart.series[0].setData([selectedValue], true);
chart.setTitle({ text: selectedText });
// 3. Unneeded, right?
chart.redraw();
});
My questions are the following:
我的问题如下：
- Is the change of the
yAxis'stitlesupported? This is similar to the command to update the graph's title, but it doesn't work, of course. - How am I supposed to change the data? Both
chart.series[0].setData(...)andchart.series[0].update(...)only made the needle to disappear to to stay still.datais not properly formatted, maybe? Could you please point me out my mistake? - This is unneeded, right (provided that the above works)?
- 在变化
yAxis的title支持？这类似于更新图表标题的命令，但它当然不起作用。 - 我应该如何更改数据？两者
chart.series[0].setData(...)也chart.series[0].update(...)只是让针消失到静止不动。data格式不正确，也许？你能指出我的错误吗？ - 这是不需要的，对吧（前提是上述方法有效）？
Thanks in advance for any suggestion you may provide!
预先感谢您提供的任何建议！
Thanks to Sebastian Bochanwho pointed me towards the right direction, I managed to solve the above problems! Please find below the final version of the above function:
感谢Sebastian Bochan 为我指明了正确的方向，我设法解决了上述问题！请在下面找到上述功能的最终版本：
$('#receptorsList0').change(function () {
var selectedOption = $("#receptorsList0 option:selected");
var selectedValue = parseFloat(selectedOption.val());
var selectedText = selectedOption.text();
chart.yAxis[0].update({
title: {
text : table[selectedText] + '<br/><span style="font-size:8px">'+selectedText+'</span>',
y : -40
}
});
chart.series[0].data[0].update(selectedValue);
chart.setTitle({
text: selectedText
});
});
回答by Sebastian Bochan
Yes it is possible by update function on called on axis. http://api.highcharts.com/highcharts#Axis.update()
update, works on point, so it should be chart.series[0].data[0].update(20);
是的，可以通过在轴上调用的更新函数来实现。 http://api.highcharts.com/highcharts#Axis.update()
更新，在点上工作，所以它应该是 chart.series[0].data[0].update(20);
