Add Flag based on button event

问题:

series: [{

type: 'flags',
name: 'Flags on axis',

data: [{
x: Date.UTC(2011, 2, 1),
title: 'A'

}, {
x: Date.UTC(2011, 5, 1),
title: 'C'
}],

shape: 'squarepin'
}]

 $("#btnAddFlag").click(function () {

chart.series[0].setData(
{

x: Date.UTC(2011, 2, 1),
title: 'B'
});

});

Above code is part of highstock chart option and I want to add flag based on user event click. However I able to add the new point flag into the chart but the existing flags which title A and C will be missed out.

1. how can I add the new flag into the chart with the existing flags ?

2. On the other hand, I am able get the flag data but I'm unsure to generate the correct data structure and reinitialize the old and new flag data back into the chart.

Thank you.

回答1:

Use addPoint instead of setData.

http://api.highcharts.com/highstock#Series.addPoint()

$("#btnAddFlag").click(function () {
  chart.series[0].addPoint({
    x: Date.UTC(2011, 2, 1),
    title: 'B'
  });
});