为什么这个简单的Highcarts JS Fiddle示例没有使用SetCategories调用重置XAxis?

时间:2016-09-23 13:12:58

标签: javascript jquery highcharts

问题的标题说明了一切。我有这个小提琴SetCateforiesFiddleExample

我想要做的是将类别从几个月更改为数字,作为应用于我的实际应用程序的简单示例。有人可以帮我解释为什么这个小提琴没有正确地将类别设置为数字?

$(function () {
$('#container').highcharts({

    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },

    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    }]
});


// the button action
$('#button').click(function () {
    var chart = $('#container').highcharts();
    chart.xAxis[0].remove(false);
    chart.addAxis({
          lineWidth: 2,
          lineColor: '#08F'},
          true,false);
    chart.xAxis[0].setCategories(['1','2','3','4','5','6','7','8','9','10','11','12'], false);
    chart.redraw();
});

});

3 个答案:

答案 0 :(得分:1)

我不想删除您的轴,添加新轴并设置其类别,而是使用Axis.update()更新轴以及新的类别和选项:

    chart.xAxis[0].update({
    lineWidth: 2,
    lineColor: '#08F',
    categories: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12']
  },
  true, false);

在这里你可以看到一个如何工作的例子; http://jsfiddle.net/5tzjoq3h/17/

答案 1 :(得分:0)

如果我理解你想要将xAxis类别从几个月更改为数字,那么只需在调用highcharts方法时将它们放入

 xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    } 

而不是你可以简单地写

     xAxis: {
            categories: ['1','2','3','4','5','6','7','8','9','10','11','12']
}

here is the working example

答案 2 :(得分:0)

使用addSeries方法在加载时间后将系列添加到图表时触发。一个参数event传递给函数。通过event.options,您可以访问传递给addSeries方法的系列选项。返回false会阻止添加系列。所以你在chart.xAxis[0].setCategories([...], false);之后没有写错,而不是你必须写chart.xAxis[0].setCategories([...], true); 你还需要编写适当的语句链来调用重绘函数,如chart.events.redraw(); here is the working example