Question

我的角色就是这样。我想将On Air Target 2G和Actual 2G上面的2G和其他两个字段On Ait Target 3G和Actual 3G合并为3G。

在梳理它之前，显示如下。enter image description here

添加新的2G和3G之后它应该显示出来。enter image description here 当我按2G tha 2G时，应该隐藏On Ait Target 2G和Actual 2G。以及功能....

$(function () { var chart = new Highcharts.Chart({ chart: { renderTo: "barchartloadmunthlydatachart", type: "column" }, title: { style: { 'fontSize': '1em' }, useHTML: true, x: -27, y: 8, text: '<span class="chart-title"> Grouped categories <span class="chart-subtitle">plugin by </span></span>' }, plotOptions: { column: { stacking: 'normal' } }, series: [ { name: "On Air Target 2G", data: [1, 3, 5, 5, 6, 7, 14, 15, 18], stack: 'target' }, { name: "Actual 2G", data: [3, 5, 10, 15, 16, 18, 18, 18, 19], stack: 'actual' }, { name: "On Air Target 3G", data: [1, 3, 5, 5, 6, 7, 14, 15, 18], stack: 'target' }, { name: "Actual 3G", data: [3, 5, 10, 15, 16, 18, 18, 18, 19], stack: 'actual' } ], xAxis: { categories: [{ name: "2016-05", categories: ["1st wk", "2nd wk", "3dr wk"] }, { name: "2016-06", categories: ["1st wk", "2nd wk", "3rd wk"] }, { name: "2016-07", categories: ["1st wk", "2nd wk", "3rd wk"] }] } }); });

Answer 1

添加两个假系列（具有唯一ID）以在图例中打印符号并捕获legendItemClick事件。在函数内部，定义检查G2 / G3的条件，并在特定系列上调用series.update（）。

events: {
      legendItemClick: function() {
        var chart = this.chart,
          series = chart.series,
          visible;

        if (this.name === '2G') {
          visible = series[0].visible;

          series[0].update({
            visible: !visible
          }, false);

          series[1].update({
            visible: !visible
          }, true);
          return false;
        }

        if (this.name === '3G') {
          visible = series[2].visible;
          series[2].update({
            visible: !visible
          }, false);

          series[3].update({
            visible: !visible
          }, true);
          return false;
        }
      }
    }

示例：

http://jsfiddle.net/o8py1ahc/

在highcharts中组合两个数据字段

1 个答案: