chart.series[id].remove()无法刷新高位图表/高位股票中其他系列的图例属性

Question

当我从图表中删除第一个系列时，即chart.series[0].remove（）；其他系列的图例属性不会更新。即系列1的传奇人物在我删除了系列0之后不知道他在位置0。

所以我的基本问题是，在删除一个系列后，我需要更新/所有系列的图例。

我该怎么做？

更新#：我的场景：我有带十字图标的图例（使用html）。如果我点击关闭图标，该系列将被删除。如果我点击图例名称，就会打开一个jQuery对话框，为您提供更新yAxis的功能，为该属性系列键入

图例格式化程序代码：

 legend: {
                                enabled: true,
                                useHTML: true,
                                labelFormatter: function test() {
                                    console.log("in label fomatter");
                                        console.log("in test");
                                        console.log(this);
                                    if (this.userOptions.yAxis == 0) {
                                        return "<input type="button"onclick="updateSeries('"+this.index+"','"+this.userOptions.yAxis+"','"+this.userOptions.type+"')" class="ui-widget" value="" + this.name + " (RH)"/> <input type="button" onclick="removeSeries(" + this.index + ")" class="ui-widget" value=" X " />";
                                    } else if (this.userOptions.yAxis == 1) {
                                        return "<input type="button"onclick="updateSeries('"+this.index+"','"+this.userOptions.yAxis+"','"+this.userOptions.type+"')" class="ui-widget" value="" + this.name + " (LH)"/> <input type="button" onclick="removeSeries(" + this.index + ")" class="ui-widget" value=" X " />";
                                    } else if (this.userOptions.yAxis == 2) {
                                        return "<input type="button"onclick="updateSeries('"+this.index+"','"+this.userOptions.yAxis+"','"+this.userOptions.type+"')" class="ui-widget" value="" + this.name + " (3rd)"/> <input type="button" onclick="removeSeries(" + this.index + ")" class="ui-widget" value=" X " />";
                                    }
                                    return "";
                                }
                            },

删除系列代码：

    function removeSeries(id) {
        console.log("in remove series");
        var chart = $('#container')
            .highcharts();
        chart.series[id].remove();
        chart.isDirtyLegend = true;
        chart.isDirtyBox = true;
        chart.legend.render();
        return;
    };

更新系列的代码（当点击图例时，我正在创建一个对话框）：

 function updateSeries(index, yAxis, type) {
                console.log("in update series");
                //console.log(chart.get())
                console.log("in update series"+index);
                var chart = $('#container')
                .highcharts();
                chart.isDirtyLegend = true;
                chart.isDirtyBox = true;
                chart.legend.render();
                console.log(chart.get("USSW1Y:3M Carry").index);
                $("#dialog")
                    .dialog("open");
                $("#legendTable")
                    .html("");
                $('#legendTable')
                    .append("<tr><td>Axis</td><td><select onchange="updateSeriesFromDialog(" + index + ")" id="legendAxis" name="legendAxis"><option value="0">1</option><option value="1">2</option><option value="2">3</option></select></td><td>Type</td><td><select onchange="updateSeriesFromDialog(" + index + ")" id="legendType" name="legendType"><option value="line">Line</option><option value="column">Column</option><option value="bar">Bar</option><option value="scatter">Scatter</option><option value="area">Area</option><option value="spline">Spline</option><option value="areaspline">Area Spline</option></select></td></tr>");
                $("#legendAxis").val(yAxis);
                $("#legendType").val(type);
                return;
            };
            function updateSeriesFromDialog(id){
                 var chart = $('#container').highcharts();
                 console.log("in update from Dialog series");
                 chart.series[id].update({
                     type: $("#legendType").val(),
                     yAxis: parseInt($("#legendAxis").val())
                });
            };

Answer 1

不要基于索引，而是将id用于系列，demo：http://jsfiddle.net/14jL9no0/3/

因此，现在每个系列都有一个ID:

    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
        id: "one",
        yAxis: 0
    }, {
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4].reverse(),
        id: "two",
        yAxis: 1
    }, {
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4].sort(),
        id: "three",
        yAxis: 2
    }]

现在，将该ID传递给您的方法：

 return "<input type="button"onclick="updateSeries('" + this.index + "','" + this.userOptions.yAxis + "','" + this.userOptions.type + "')" class="ui-widget" value="" + this.name + " (3rd)"/> <input type="button" onclick="removeSeries('" + this.options.id + "')" class="ui-widget" value=" X " />";

最后一步，removeSeries可以从图表中得到序列：

function removeSeries(id) {
  console.log("in remove series");
  var chart = $('#container')
    .highcharts();
  chart.get(id).remove();
  return;
};

现在，您可以在更新系列中执行同样的操作。与其传递多个参数，不如只传递一个ID，然后使用chart.get(id)来获取相应的序列。

Answer 2

您应该能够在图表的图例上调用render()来重新渲染它：

chart.legend.render();