Highcharts（Highstock） - Highcharts不会按预期删除yAxis

Question

我在highcharts（highstock）中删除yaxis时遇到问题。我有以下代码片段以更好的方式解释这个问题。

我的图表加载了3个初始yAxis，然后我尝试动态添加或删除yAxis。出于某种原因，它没有删除相应的y轴，而是删除了另一个yAxis的系列。

要重现此问题，请尝试执行以下步骤 -

1. 点击＆＃34;添加yAxis＆＃34;按钮
2. 在文本字段中输入1，然后单击＆＃34;删除yAxis＆＃34;按钮
3. 点击＆＃34;删除yAxis＆＃34;再次按钮
4. 点击添加yAxis添加另一个轴
5. 再次点击添加yAxis以添加另一个轴
6. 在文本字段中输入2，然后单击＆＃34;删除yAxis＆＃34;按钮

您将观察我们尝试移除的yAxis被移除但是它也从我们添加的最后一个yAxis中删除了该系列。

＆＃13;
＆＃13;
var chart;
$(function () {
  var index = 0;
  var data1 = [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4];
    
  var highchartOptions = {
    chart:{
      renderTo:'container'
    },
    navigator: {
      outlineColor: '#0066DD',
      outlineWidth: 1
    },
    xAxis: {
      categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },
    yAxis:[{
      title:{
        text:"initial data"
      },
      id:'myaxis-'+ index++,
      height:'14%',
      top:'0%'
  },
  {
    title:{
      text:"initial data"
    },
    id:'myaxis-'+ index++,
    top:'15%',
    height:'14%'
  },
  {
    title:{
      text:"initial data"
    },
    id:'myaxis-'+ index++,
    top:'30%',
    height:'14%'
  }],

  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]
  },
  {
    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],
    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],
    yAxis:2
  }]
};
    
  chart = new Highcharts.StockChart(highchartOptions);
  $button = $('#button');
  $delButton = $('#delbutton');
	var axisCount = 4; // axisCount is 4 because the chart is loaded with 3 axis + 1 for the navigator
  $button.click(function () {
        var axisObj = {
          title: {
              text: "axis-" + axisCount,
              id:'myaxis-'+ (index++)
          },
        };
		chart.addAxis(axisObj, false);
        
		var seriesData = new Object();
		seriesData.name = 'axis-' + axisCount;
    seriesData.yAxis = axisCount;
    seriesData.data = data1;
    seriesData.type = 'line';
    chart.addSeries(seriesData);
    chart.yAxis[axisCount].update({ height: '14%',top: (axisCount*15) + '%',offset:0 });
    axisCount++;
  });
    
    
  $delButton.click(function () {
  
    var delAxis = $('#delAxis').val();
    chart.yAxis[delAxis].remove();
    for(var i=delAxis;i<axisCount-1; i++){
      chart.yAxis[i].update({ height: '14%',top: (i*15) + '%',offset:0 });
    }
    axisCount--;
  });
});
＆＃13;
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
    <script src="http://code.highcharts.com/stock/highstock.js"></script>
    <script src="http://code.highcharts.com/stock/highcharts-more.js"></script>
    <script src="http://code.highcharts.com/modules/exporting.js"></script>

<button id="button" class="autocompare">Add yAxis</button><br>
Entrt yAxis index to delete:<input type='text' id="delAxis"/>
<button id="delbutton" class="autocompare">Delete yAxis</button>
<div id="container" style="height: 800px"></div>
＆＃13;
＆＃13;
＆＃13;