Question

我有条形图，我希望每个条形图开始不同的值。现在他们都从0开始。我只找到了如何改变起点，每个起点都是一样的。像所有人一样盯着。

但是我需要第一个像1-2，第二个：1-4和第三个：7-10。如何针对不同情况对其进行更改？

var chart = new Highcharts.Chart({
chart: {
        type: 'bar',
        renderTo: 'container'
 },
 xAxis: {
        categories: ['First', 'Second', 'Third']
 },
 series: [{
        data: [{
            name: 'Point 1',
            y: 2
        }, {
            name: 'Point 2',
            y: 4
        }, {
            name: 'Point 3',
            y: 10
        }]
 }]
 });

Answer 1

这是columnrange图表类型的用途：

http://www.highcharts.com/demo/columnrange

使用inverted属性使其成为条形而不是列：

http://api.highcharts.com/highcharts/chart.inverted）

示例：

    chart: {
        type: 'columnrange',
        inverted: true
    }

小提琴：

http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/columnrange/

Answer 2

可能的解决方案是使条形图“堆叠”并将新数据数组添加到系列中，其中将设置偏移，然后使它们“不可见”：

plotOptions: {
   series: {
     stacking: 'normal'
   }
},
series: [{
    data: [{name: 'Point 1', y: 2}, 
           {name: 'Point 2', y: 4}, 
           {name: 'Point 3', y: 10}]
    },{
    data: [{name: 'Point 1', y: 2}, 
           {name: 'Point 2', y: 4}, 
           {name: 'Point 3', y: 10}], 
    color: 'white',
    enableMouseTracking:false,
    showInLegend: false
}]

我希望this example能更好地解释

javascript - Highcharts - 类型栏 - 如何为每个栏设置不同的起点

2 个答案: