Highcharts:如何更改图表类型

时间:2014-08-05 12:48:07

标签: jquery highcharts

我正在使用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()会改变我的图形类型......有没有办法做到这一点?

1 个答案:

答案 0 :(得分:5)

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

// 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();