highcharts注释模块addAnnotations错误

我遇到了一个奇怪的错误。为了复制它，我这样做

我有一个图表可以重复使用。首先，我用数据_1加载图表，并使用addAnnotation（）加载注释_1，这很有效

然后我用数据_2更新图表，并通过removeAnnotations（id）删除注释_1。并加载注释2，这是有效的

如果我现在返回并重新加载数据_1，删除注释_2，然后尝试重新加载注释_1，则它不起作用。图表数据显示良好，但没有注释

[更新] 我不能保存或叉一根叉子！？，所以我把代码放在这里。现在我有一个稍微不同的错误。如果我再次单击“按钮1”，数据将不会重新更新。执行“按钮1”后，再执行“按钮2”

html

js+loadjquery

// Data generated from http://www.bikeforums.net/professional-cycling-fans/1113087-2017-tour-de-france-gpx-tcx-files.html
var elevationData_1 = [   [70.6, 597],
    [70.7, 591],
    [70.8, 590],
    [70.9, 587],
    [71.0, 584],
    [71.1, 584],
    [71.2, 582],
    [71.3, 574],
    [71.4, 572],
    [71.5, 570],
    [71.6, 572],
    [71.7, 573],
    [71.8, 575],
    [71.9, 578],
    [72.0, 590],
    [72.1, 595],
    [72.2, 595],]
var elevationData_2 = [ [71.9, 578],
    [72.0, 590],
    [72.1, 595],
    [72.2, 595],
    [72.3, 579],
    [72.4, 581],
    [72.5, 583],
    [72.6, 583],
    [72.7, 583],
    [72.8, 583],
    [72.9, 580],
    [73.0, 579],
    [73.1, 584],
    [73.2, 587],
    [73.3, 594],
    [73.4, 597],
    [73.5, 597],
    [73.6, 596],]

// Now create the chart
var chart = Highcharts.chart('container', {

    chart: {
        type: 'area',
        zoomType: 'x',
        panning: true,
        panKey: 'shift',
        scrollablePlotArea: {
            minWidth: 600
        }
    },



    xAxis: {
        labels: {
            format: '{value} km'
        },
        minRange: 5,
        title: {
            text: 'Distance'
        },

    },

    yAxis: {
        startOnTick: true,
        endOnTick: false,
        maxPadding: 0.35,
        title: {
            text: null
        },
        labels: {
            format: '{value} m'
        }
    },


    series: [{

        lineColor: Highcharts.getOptions().colors[1],
        color: Highcharts.getOptions().colors[2],
        fillOpacity: 0.5,
        name: 'Elevation',
        id: 'Elevation',

        marker: {
            enabled: false
        },
        threshold: null
    }]

});

  $(document).ready(function () {

        $("#btn1").click(
            function () {
               chart.get('Elevation').setData(elevationData_1)
            }            
        );
         $("#btn2").click(
            function () {
               chart.get('Elevation').setData(elevationData_2)
            }            
        );
    });

---

你们能在一些在线编辑器上重现你们的代码吗？我可以调试一下，看看它是如何工作的。问题是用一些代码更新的。这是你们代码的一个演示。您能否添加注释并描述查看问题的步骤？它在JSFIDLE中运行良好，无法复制。我做了一些挖掘，它与series.setData有关，我的图表是highcharts vue包装器。我第一次使用setData时，它工作得很好。但是，如果我在setData中再次使用数据集的副本，它会很好地绘制图表，但数据长度设置不正确……有些地方不正确，您有什么建议吗？——

#container, .highcharts-data-table table {
    min-width: 350px; 
    max-width: 800px;
    margin: 1em auto;
}

#container {
    height: 450px;
}

// Data generated from http://www.bikeforums.net/professional-cycling-fans/1113087-2017-tour-de-france-gpx-tcx-files.html
var elevationData_1 = [   [70.6, 597],
    [70.7, 591],
    [70.8, 590],
    [70.9, 587],
    [71.0, 584],
    [71.1, 584],
    [71.2, 582],
    [71.3, 574],
    [71.4, 572],
    [71.5, 570],
    [71.6, 572],
    [71.7, 573],
    [71.8, 575],
    [71.9, 578],
    [72.0, 590],
    [72.1, 595],
    [72.2, 595],]
var elevationData_2 = [ [71.9, 578],
    [72.0, 590],
    [72.1, 595],
    [72.2, 595],
    [72.3, 579],
    [72.4, 581],
    [72.5, 583],
    [72.6, 583],
    [72.7, 583],
    [72.8, 583],
    [72.9, 580],
    [73.0, 579],
    [73.1, 584],
    [73.2, 587],
    [73.3, 594],
    [73.4, 597],
    [73.5, 597],
    [73.6, 596],]

// Now create the chart
var chart = Highcharts.chart('container', {

    chart: {
        type: 'area',
        zoomType: 'x',
        panning: true,
        panKey: 'shift',
        scrollablePlotArea: {
            minWidth: 600
        }
    },



    xAxis: {
        labels: {
            format: '{value} km'
        },
        minRange: 5,
        title: {
            text: 'Distance'
        },

    },

    yAxis: {
        startOnTick: true,
        endOnTick: false,
        maxPadding: 0.35,
        title: {
            text: null
        },
        labels: {
            format: '{value} m'
        }
    },


    series: [{

        lineColor: Highcharts.getOptions().colors[1],
        color: Highcharts.getOptions().colors[2],
        fillOpacity: 0.5,
        name: 'Elevation',
        id: 'Elevation',

        marker: {
            enabled: false
        },
        threshold: null
    }]

});

  $(document).ready(function () {

        $("#btn1").click(
            function () {
               chart.get('Elevation').setData(elevationData_1)
            }            
        );
         $("#btn2").click(
            function () {
               chart.get('Elevation').setData(elevationData_2)
            }            
        );
    });