简体   繁体   English

Highcharts - 如何正确更新VUMeter的系列[0] .data和yAxis标题?

[英]Highcharts - how to properly update series[0].data and yAxis title of a VUMeter?

I am preparing a VU Meter graph in Highcharts to display an array of values. 我正在Highcharts中准备一个VU Meter图来显示一组值。 These values are displayed one at a time, by choosing an <OPTION> of a <SELECT> . 通过选择<SELECT><OPTION> ,一次显示一个这些值。 I managed to understand how to change the title of the graph to match the selected label of the <OPTION> , but unfortunately I am a noob and I was not able to properly update the data of the series . 我设法理解如何更改图表的title以匹配<OPTION>的选定label ,但不幸的是我是菜鸟,我无法正确更新seriesdata

A minimal working example is available on jsFiddle . jsFiddle上提供了一个最小的工作示例 In particular, the following function is fired when the <SELECT> is changed: 特别是,更改<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: 我的问题如下:

  1. Is the change of the yAxis 's title supported? 是否支持更改yAxistitle This is similar to the command to update the graph's title, but it doesn't work, of course. 这类似于更新图形标题的命令,但它当然不起作用。
  2. How am I supposed to change the data? 我该如何更改数据? Both chart.series[0].setData(...) and chart.series[0].update(...) only made the needle to disappear to to stay still. chart.series[0].setData(...)chart.series[0].update(...)都只使指针消失以保持静止。 data is not properly formatted, maybe? data格式不正确,也许? Could you please point me out my mistake? 你能指出我的错误吗?
  3. This is unneeded, right (provided that the above works)? 这是不必要的,对(如果以上工作)?

Thanks in advance for any suggestion you may provide! 提前感谢您提供的任何建议!


Thanks to Sebastian Bochan who pointed me towards the right direction, I managed to solve the above problems! 感谢Sebastian Bochan向我指出了正确的方向,我设法解决了上述问题! Please find below the final version of the above function: 请在下面找到上述功能的最终版本:

$('#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
    });
});
  1. Yes it is possible by update function on called on axis. 是的,可以通过调用轴上的更新功能实现。 http://api.highcharts.com/highcharts#Axis.update() http://api.highcharts.com/highcharts#Axis.update()

  2. update, works on point, so it should be chart.series[0].data[0].update(20); 更新,适用于点,所以它应该是chart.series [0] .data [0] .update(20);

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM