Highcharts Drilldown在IE中没有工作

时间:2017-04-03 12:24:27

标签: javascript html highcharts

这个小提琴在IE浏览器中不起作用,在这里停留了好几个小时。帮助我解决这个问题。我不知道为什么会出错。代码在Mozilla和Chrome中运行良好

Here is JSFiddle

var chart = new Highcharts.Chart({
  chart: {
    renderTo: 'container',
    type: 'column',
    events: {
      drilldown: function(e) {
        var chart = this;
        drilldowns = chart.userOptions.drilldown.series;
        series = [];
        e.preventDefault();
        Highcharts.each(drilldowns, function(p, i) {
          if (p.id.includes(e.point.drilldown)) {
            chart.addSingleSeriesAsDrilldown(e.point, p);
          }
        });
        chart.applyDrilldown();
      }
    }
  },
  title: {
    text: 'Scores par paliers'
  },
  xAxis: {
    type: 'category',
    labels: {
      rotation: -45,
      align: 'right',
      style: {
        fontFamily: 'Verdana, sans-serif'
      }
    },
    min: 0
  },
  yAxis: {
    title: {
      text: 'Score'
    },
    max: 100,
    tickInterval: 10,
    min: 0
  },
  legend: {
    enabled: true
  },
  plotOptions: {
    series: {
      borderWidth: 0,
      dataLabels: {
        enabled: true
      }
    }
  },
  exporting: {
    enabled: true
  },
  tooltip: {
    formatter: function() {
      if (this.point.drilldown) {
        var s = this.key + ' : <b>' + this.y + ' %</b>';
      } else {
        var s = this.key + ' : <b>' + this.y + '</b>';
      }
      return s;
    }
  },
  series: [{
    name: 'Marches',
    colorByPoint: true,
    data: [{
        name: 'september',
        y: 89,
        drilldown: 'step1'
      },
      {
        name: 'october',
        y: 17,
        drilldown: 'step2'
      }, {
        name: 'nov',
        y: 89,
        drilldown: 'step3'
      },
      {
        name: 'dec',
        y: 17,
        drilldown: 'step4'
      }, {
        name: 'jan',
        y: 89,
        drilldown: 'step5'
      },
      {
        name: 'feb',
        y: 17,
        drilldown: 'step6'
      },
    ]
  }, {
    type: 'spline',

    data: [{
        name: 'september',
        y: 89,
        drilldown: 'step1'
      },
      {
        name: 'october',
        y: 17,
        drilldown: 'step2'
      }, {
        name: 'nov',
        y: 89,
        drilldown: 'step3'
      },
      {
        name: 'dec',
        y: 17,
        drilldown: 'step4'
      }, {
        name: 'jan',
        y: 89,
        drilldown: 'step5'
      },
      {
        name: 'feb',
        y: 17,
        drilldown: 'step6'
      },
    ]
  }],
  drilldown: {
    drillUpButton: {
      relativeTo: 'spacingBox',
      position: {
        y: 0,
        x: -50
      }
    },
    series: [{
        id: 'step1',
        name: 'Step 1',
        type: 'column',
        data: [
          ['Game 1', 100],
          ['Game 2', 100],
          ['Game 3', 100]
        ]
      },
      {
        id: 'step2',
        name: 'Step 2',
        type: 'column',
        data: [
          ['Game 1', 0],
          ['Game 2', 100],
          ['Game 3', 0]
        ]
      },
      {
        id: 'step1',
        name: 'Step 1',
        type: 'spline',
        data: [
          ['Game 1', 83],
          ['Game 2', 82],
          ['Game 3', 79]
        ]
      },
      {
        id: 'step2',
        name: 'Step 2',
        type: 'spline',
        data: [
          ['Game 1', 0],
          ['Game 2', 100],
          ['Game 3', 0]
        ]
      },
      {
        id: 'step3',
        name: 'Step 3',
        type: 'column',
        data: [
          ['Game 1', 100],
          ['Game 2', 100],
          ['Game 3', 100]
        ]
      },
      {
        id: 'step4',
        name: 'Step 4',
        type: 'column',
        data: [
          ['Game 1', 0],
          ['Game 2', 100],
          ['Game 3', 0]
        ]
      },
      {
        id: 'step3',
        name: 'Step 3',
        type: 'spline',
        data: [
          ['Game 1', 83],
          ['Game 2', 82],
          ['Game 3', 79]
        ]
      },
      {
        id: 'step4',
        name: 'Step 4',
        type: 'spline',
        data: [
          ['Game 1', 0],
          ['Game 2', 100],
          ['Game 3', 0]
        ]
      },
      {
        id: 'step5',
        name: 'Step 5',
        type: 'column',
        data: [
          ['Game 1', 100],
          ['Game 2', 100],
          ['Game 3', 100]
        ]
      },
      {
        id: 'step6',
        name: 'Step 6',
        type: 'column',
        data: [
          ['Game 1', 0],
          ['Game 2', 100],
          ['Game 3', 0]
        ]
      },
      {
        id: 'step5',
        name: 'Step 5',
        type: 'spline',
        data: [
          ['Game 1', 83],
          ['Game 2', 82],
          ['Game 3', 79]
        ]
      },
      {
        id: 'step6',
        name: 'Step 6',
        type: 'spline',
        data: [
          ['Game 1', 0],
          ['Game 2', 100],
          ['Game 3', 0]
        ]
      }
    ]
  }
});
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/data.js"></script>
<script src="https://code.highcharts.com/modules/drilldown.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container" style="width:100%;height:400px;">
</div>

1 个答案:

答案 0 :(得分:0)

由于您使用的是IE中不支持的include方法,因此在IE中无法进行深入分析。使用polyfill方法可以使它工作。

Error 0063: The following error occurred during evaluation of R script:
---------- Start of error message from R ----------
cannot open the connection


cannot open the connection
----------- End of error message from R -----------
Start time: UTC 04/03/2017 21:09:34
End time: UTC 04/03/2017 23:33:48

以下是适用于IE的更新code