Highcharts:如何更改图表类型

Question

我是Graphs的Highcharts插件...这是我的代码:

$(function () {
            $('#graph1').highcharts({
                chart: {
                    type: 'bar'
                },
                xAxis: {
                    categories: mesesGraph1
                },
                yAxis: {
                    title: {
                        text: 'WO / month'
                    },
                    plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                    }]
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'middle',
                    borderWidth: 0
                },
                series: arrayFocal
            });
        });

现在我想要一个按钮,onclick()改变我的图形类型......有没有办法做到这一点？

Answer 1

您可以通过更新类型来更改类型.这是一个适用于普通按钮的示例:

// Set type
$.each(['line', 'column', 'spline', 'area', 'areaspline', 'scatter'], function(i, type) {
  $('#' + type).click(function() {
    $.each(chart.series, function(j, series) {
      series.update({
        type: type
      });
    });
  });
});

如您所见,按钮固定在类型上,onClick图表中的每个系列都会更新为您按下的任何按钮.在图表上直接进行操作同样容易,只需设置click事件即可更新系列.

此外,我的"图表"实例将在您的情况下如下:

var chart = $('#graph1').highcharts();