Question

任何人都可以帮助我使用highcharts stack column我的问题是我对数据有很大的不同，图表只显示大数据。我尝试minPointLength，但在我的情况下没有帮助。请在此处查看示例：http://jsfiddle.net/17jd6frn/

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'column'
        },
        title: {
            text: 'Stacked column chart'
        },
        xAxis: {
            categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
        },
        yAxis: {

            min: 0,
            title: {
                text: 'Total fruit consumption'
            },
            stackLabels: {
                enabled: true,
                style: {
                    fontWeight: 'bold',
                    color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
                }
            }
        },
        legend: {
            align: 'right',
            x: -30,
            verticalAlign: 'top',
            y: 25,
            floating: true,
            backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || 'white',
            borderColor: '#CCC',
            borderWidth: 1,
            shadow: false
        },
        tooltip: {
            headerFormat: '<b>{point.x}</b><br/>',
            pointFormat: '{series.name}: {point.y}<br/>Total: {point.stackTotal}'
        },
        plotOptions: {
            column: {
                stacking: 'normal',
                dataLabels: {
                    enabled: true,
                    color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
                    style: {
                        textShadow: '0 0 3px black'
                    }
                }
            }
        },
        series: [{
            name: 'John',
            data: [2000, 3, 4, 7, 2]
        }, {
            name: 'Jane',
            data: [7000, 2, 3, 2, 1]
        }, {
            name: 'Joe',
            data: [3, 4, 4, 2, 5]
        }]
    });
});

Answer 1

一种选择是使用对数刻度（http://api.highcharts.com/highcharts/yAxis.type）。它会显示您的小数字和大数字。请注意，您不能在对数刻度上显示0或负数。

yAxis: [{
  type: "logarithmic",
  min: 1,
  title: {
    text: 'Total fruit consumption'
  },
  stackLabels: {
    enabled: true,
    style: {
      fontWeight: 'bold',
      color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
    }
  }
}],

http://jsfiddle.net/17jd6frn/1/

Answer 2

您有两种选择。 1.）使用“minPointLength”。这是y轴绘图的最小值。您可以使用此设置并将其设置为一个值，如果值太小而无法绘图，则会显示该值。您可以使用此设置，如

E/launcher - Cannot read property 'forEach' of undefined
 E/launcher - TypeError: Cannot read property 'forEach' of undefined
    at C:\Users\mako\AppData\Roaming\npm\node_modules\jasmine2-protractor-utils\reporter\jasmine2_reporter.js:112:24
    at Array.forEach (native)
    at self.jasmineDone (C:\Users\mako\AppData\Roaming\npm\node_modules\jasmine2-protractor-utils\reporter\jasmine2_reporter.js:108:16)
    at dispatch (C:\Users\mako\AppData\Roaming\npm\node_modules\protractor\node_modules\jasmine-core\lib\jasmine-core\jasmine.js:1966:28)
    at ReportDispatcher.jasmineDone (C:\Users\mako\AppData\Roaming\npm\node_modules\protractor\node_modules\jasmine-core\lib\jasmine-core\jasmine.js:1
949:11)
    at C:\Users\mako\AppData\Roaming\npm\node_modules\protractor\node_modules\jasmine-core\lib\jasmine-core\jasmine.js:758:18
    at QueueRunner.clearStack (C:\Users\mako\AppData\Roaming\npm\node_modules\protractor\node_modules\jasmine-core\lib\jasmine-core\jasmine.js:660:9)
    at QueueRunner.run (C:\Users\mako\AppData\Roaming\npm\node_modules\protractor\node_modules\jasmine-core\lib\jasmine-core\jasmine.js:1881:12)
    at C:\Users\mako\AppData\Roaming\npm\node_modules\protractor\node_modules\jasmine-core\lib\jasmine-core\jasmine.js:1898:16
    at C:\Users\mako\AppData\Roaming\npm\node_modules\protractor\node_modules\jasmine-core\lib\jasmine-core\jasmine.js:1842:9
 E/launcher - Process exited with error code 199

2.。）您可以将“堆叠”选项更改为“百分比”并删除“minPointLength”。这将导致堆叠列显示为w.r.t到它们的值百分比。

请使用以上两个选项，看看它是否适合你!!!

Highcharts堆叠列不显示堆叠的最小值

2 个答案: