如何在Highcharts中从0绘制面积图

Question

我想从零开始创建图表，而不必在序列数组中添加0

Highcharts.chart('most_sale_at', {
            chart: {
                type: 'area',
                backgroundColor: null
            },
            title: {
                text: null
            },
            colors: ['#3bbf93', '#494747'],
            subtitle: {
                text: null
            },
            xAxis: {
                categories: ["11:00 AM", "12:00 PM", "1:00 PM", "2:00 PM", "3:00 PM", "4:00 PM", "5:00 PM", "6:00 PM", "7:00 PM", "8:00 PM", "9:00 PM"],
                crosshair: true,
                startOnTick: true
            },
            yAxis: {
                labels: {
                    format: '{value}'
                },
                title: {
                    text: 'Gross Sales'
                }
            },
            tooltip: {
                shared: true
            },
            plotOptions: {
                area: {
                    marker: {
                        enabled: false
                    }
                }
            },
            credits: {
                enabled: false
            },
            series: [{
                name: 'This week',
                data: [17788, 54236, 42461, 23809, 6921, 4785, 6888, 12035, 17403, 15740, 9536],
                tooltip: {
                    valueSuffix: ''
                }
            }, {
                name: 'Last week',
                data: [12488, 44236, 50461, 33809, 18921, 3785, 5888, 10035, 12403, 740, 936],
                tooltip: {
                    valueSuffix: ''
                },
                marker: {
                    enabled: false
                }
            }]
        });

<script src="https://code.highcharts.com/highcharts.js"></script>
<div id="most_sale_at">Placeholder for most sales</div>

Answer 1

将tickmarkPlacement属性设置为on，并通过min和max选项更正空白：

xAxis: {
    categories: ["11:00 AM", "12:00 PM", "1:00 PM", "2:00 PM", "3:00 PM", "4:00 PM", "5:00 PM", "6:00 PM", "7:00 PM", "8:00 PM", "9:00 PM"],
    crosshair: true,
    tickmarkPlacement: 'on',
    min: 0.5,
    max: 9.5
}

实时演示：http://jsfiddle.net/BlackLabel/uqLp0rjh/

API：https://api.highcharts.com/highcharts/xAxis