Highcharts - Update a series point [x,y] values?

Question

I'm trying to update a point[x,y] in the chart. What's the problem? Ok, I chart and its chart series are like this:

     series: [
            {
                enableMouseTracking: false,
                name: 'Line1',
                type: 'line',
                color: '#5d5d5d',
                yAxis: 1,
                data: [[12000, 55.068493], [15064, 42.842]],
                marker: {
                    symbol: 'circle'
                }
            },
            {
                enableMouseTracking: false,
                name: 'Line2',
                type: 'line',
                color: '#5d5d5d',
                yAxis: 1,
                marker: {
                    symbol: 'circle'
                },
                data: [[12000, 57.671527], [16000, 42.620069]]

            },{
                name: 'TOM',
                //type: 'line',
                color: '#ff4100',
                yAxis: 1,
                marker: {
                    symbol: 'url(icons/tom.png)'
                },
                data: [
                    {
                        id:'tom_point',
                        color: '#00FF00',
                        y: fi_variable,
                        x: tom_variable
                    }
                ]
             }

Now the thing is that, I'm checking if fi_variable or tom_variable has changed and if its true, update these two variables, and finally update the chart.

I have tried already, some methods like chart.series[0].data[0].update(y = 10); and its working for some points with fixed x,y values, but no luck for the rest of the points. For Instance I use chart.series[0].data[1].update(y = 10); will work ok, but this chart.series[0].data[3].update(y = 10); will not work.

1- Is there any way to replace the data[0] from the above code line with an id of a point in our case tom_point ?

Also I've tried this chart.series[0].setData([[tom_variable,fi_variable, 'tom_point']]); and again it wont working when the point is with an id or without fixed values.

But If I try chart.series[0]data[0].setData([[tom_variable,fi_variable]]); it works but again not on 3rd element (in our case - as shown above) of the series.

I can get the values for this point with the following, var tomPoint = chart.get('tom_point').y; but I can't set any x,y values back to chart and update it (the chart).

I have also tried to check if the variables have changed and to redraw the chart with chart.redraw but nothing.

Any Ideas how can I get this to work? Am I losing something?

Thank you in Advance for your time.

Answer 1

Ok, the solution finally was simple.

I've managed to update the point:

The third element in the series with the name TOM corresponds to chart.series[2].

               { // chart.series[2]
                name: 'TOM',
                //type: 'line',
                color: '#ff4100',
                yAxis: 1,
                marker: {
                    symbol: 'url(icons/tom.png)'
                },
                data: [
                    {
                        id:'tom_point',
                        color: '#00FF00',
                        y: fi_variable,
                        x: tom_variable
                    }
                ]
             }

So in order to update [x,y] values of this point, you have to do it like that:

// TOM Point

`chart.series[2].data[0].update({x:var_x, y:var_y});`

Answer 2

First of all you try to update point (data[3]) which doens't exist in serie. Secondly in case when you update you need to use

chart.series[0].data[1].update(10); or chart.series[0].data[1].update({y:10}); but not yoru figure

Answer 3

if you want to change the x value also then use

chart.series[0].data[0].update({
x: 10,
y: 100
})

this will update both x and y values like in this example http://jsfiddle.net/DCA8W/

Hope this is what you are looking for.