Javascript 如何使用highchart在柱状图中隐藏列后填充空间？

在一列被隐藏后，有没有办法通过单击图例项来填充空间

<div id="container" style="height: 300px"></div>
<script src="http://code.highcharts.com/highcharts.src.js"></script>

    var chart = new Highcharts.Chart({

    chart: {
        type: 'column',
        renderTo: 'container'
    },

    "title":{  
      "text":"TITLE",
      "align":"left"
   },
   "subtitle":{  
      "text":"Subtitle Text",
      "align":"left",
      "style":{  
         "paddingBottom":"20px"
      }
   },
   "xAxis":{  
      "categories":[  
         "Category1",
         "Category2",
         "Category3",
         "Category4",
         "Category5"
      ],
      "crosshair":true,
      "title":{  

      },
      "labels":{  
         "enabled":false,
         "format":"{value}"
      }
   },
   "yAxis":{  
      "min":0,
      "title":{  
         "text":"Meters"
      },
      "labels":{  
         "format":"{value}"
      }
   },
   "tooltip":{  
      "enabled":true,
      "headerFormat":"<span style=\"font-size:10px\">{point.key}</span><br/>",
      "shared":true,
      "useHTML":true
   },
   "legend":{  
      "enabled":true,
      "align":"left",
      "useHTML":true
   },
   "plotOptions":{  
      "column":{  
         "pointPadding":0.2,
         "borderWidth":0,
         "dataLabels":{  
            "enabled":true,
            "format":"{point.y:.2f} ",
            "style":{  
               "textShadow":0
            }
         }
      },
      "series":{  
         "grouping":false
      }
   },
    "series":[  
      {  
         "name":"Category1",
         "data":[  
            {  
               "name":"Category1",
               "y":45,
               "x":0
            }
         ]
      },
      {  
         "name":"Category2",
         "data":[  
            {  
               "name":"Category2",
               "y":43,
               "x":1
            }
         ]
      },
      {  
         "name":"Category3",
         "data":[  
            {  
               "name":"Category3",
               "y":43,
               "x":2
            }
         ]
      },
      {  
         "name":"Category4",
         "data":[  
            {  
               "name":"Category4",
               "y":42,
               "x":3
            }
         ]
      },
      {  
         "name":"Category5",
         "data":[  
            {  
               "name":"Category5",
               "y":42,
               "x":4
            }
         ]
      },
      {  
         "name":"",
         "data":[  
            {  

            }
         ],
         "visible":false,
         "showInLegend":false,
         "exporting":false
      },
      {  
         "name":"Bla bla bla",
         "data":[  
            45,
            43,
            43,
            42,
            42
         ],
         "showInLegend":false,
         "visible":false,
         "exporting":true
      }
   ],
   "exporting":{  
      "enabled":false,
      "chartOptions":{  
         "legend":{  
            "enabled":true,
            "maxHeight":null,
            "itemStyle":{  
               "fontFamily":"Arial"
            }
         }
      }
   },
   "loading":{  
      "style":{  
         "opacity":0.9
      }
   },
   "drilldown":{  
      "drillUpButton":{  
         "theme":{  
            "style":{  
               "display":"none"
            }
         }
      }
   }
});

var图表=新的Highcharts.图表({
图表：{
键入：“列”，
renderTo:“容器”
},
“标题”：{
“文本”：“标题”，
“对齐”：“左”
},
“副标题”：{
“文本”：“字幕文本”，
“对齐”：“左”，
“风格”：{
“填充底部”：“20px”
}
},
“xAxis”：{
“类别”：[
“类别1”，
“类别2”，
“类别3”，
“类别4”，
“类别5”
],
“十字线”：没错，
“标题”：{
},
“标签”：{
“启用”：false，
格式“{value}”
}
},
“yAxis”：{
“min”：0，
“标题”：{
“文本”：“米”
},
“标签”：{
格式“{value}”
}
},
“工具提示”：{
“启用”：正确，
“headerFormat”：“{point.key}
”，
“共享”：是的，
“useHTML”：true
},
“图例”：{
“启用”：正确，
“对齐”：“左”，
“useHTML”：true
},
“打印选项”：{
“列”：{
“点填充”：0.2，
“边界宽度”：0，
“数据标签”：{
“启用”：正确，
“格式：“{point.y:.2f}”，
“风格”：{
“文本阴影”：0
}
}
},
“系列”：{
“分组”：false
}
},
“系列”：[
{  
“名称”：“类别1”，
“数据”：[
{  
“名称”：“类别1”，
“y”：45，
“x”：0
}
]
},
{  
“名称”：“类别2”，
“数据”：[
{  
“名称”：“类别2”，
“y”：43，
“x”：1
}
]
},
{  
“名称”：“类别3”，
“数据”：[
{  
“名称”：“类别3”，
“y”：43，
“x”：2
}
]
},
{  
“名称”：“类别4”，
“数据”：[
{  
“名称”：“类别4”，
“y”：42，
“x”：3
}
]
},
{  
“名称”：“类别5”，
“数据”：[
{  
“名称”：“类别5”，
“y”：42，
“x”：4
}
]
},
{  
“名称”：“，
“数据”：[
{  
}
],
“可见”：假，
“showInLegend”：false，
“出口”：假
},
{  
“姓名”：“布拉布拉布拉布拉”，
“数据”：[
45,
43,
43,
42,
42
],
“showInLegend”：false，
“可见”：假，
“出口”：正确
}
],
“出口”：{
“启用”：false，
“图表选项”：{
“图例”：{
“启用”：正确，
“maxHeight”：空，
“项目样式”：{
“fontFamily”：“Arial”
}
}
}
},
“加载”：{
“风格”：{
“不透明度”：0.9
}
},
“向下展开”：{
“钻取按钮”：{
“主题”：{
“风格”：{
“显示”：“无”
}
}
}
}
});

当我单击第一个或最后一个图例项时，图表会重新绘制，但当我单击中间的图例项时不会发生这种情况？这是一个bug还是功能？我如何改变中间图例项的这种行为，使它们也能够抛出事件，重新绘制图表

---

感谢advance

您可以为xAxis设置和更新中断以隐藏空白：

---

在你的X轴上，当你隐藏或显示第一点和最后一点时，你有一个正在改变的极端。当你改变中间点时，极端不会改变。我认为他们不应该改变。您可以使用chart.redraw（）手动重绘图表，也可以使用Axis.setextrems（）手动更改极值。因此，我尝试过这种方法，但没有成功，因为我无法填充隐藏列的空间，只需更改图表的比例即可。另外，使用chart.series[2].remove（true）可以获得相同的结果，但在本例中，图例项也被删除。也许你们知道我怎么能不做任何改变就留下传奇物品，只删除一个相关的系列？太神奇了！你能说，有一些替代方案吗highcharts@4.1.7？@slesh此解决方案在使用Highcharts 4.1.7版和断轴模块时有效-哦，对不起！我没有注意到依赖，我的坏。嗨，@Kacper-Madej。我曾经在你的代码中遇到过这个问题，但我自己无法处理，但问题似乎是highcharts.src.js:2924中x坐标（值参数）的浮点值。你能帮帮我吗。这是问题的关键。要重现问题，请取消选中图形上的值：iphone、ipad、N/A、sm-g935f、sm-g930f、android 2.0、iphone 6、sm-g920f、sm-g9005。实际结果：取消选中sm-g9005后，控制台中显示错误。也许你可以建议一些解决办法？谢谢。更新到最新版本没有帮助。

  events: {
    legendItemClick: function() {
      var series = this,
        seriesIndex = series._i,
        xAxis = series.xAxis,
        newBreaks = [];
      if (series.visible) {
        newBreaks = xAxis.options.breaks;
        newBreaks.push({
          from: seriesIndex,
          to: seriesIndex + 1,
          seriesIndex: seriesIndex
        });
      } else {
        Highcharts.each(xAxis.options.breaks, function(br) {
          if (br.seriesIndex !== seriesIndex) {
            newBreaks.push(br);
          }
        });
      }
      xAxis.update({
        breaks: newBreaks
      });
    }
  }