高图表X轴值无论系列数据如何

时间:2016-06-21 16:13:49

标签: highcharts

我跟随jsFiddle

http://jsfiddle.net/9v636zt3/

$(function () {
$('#container').highcharts({
    title: {
        text: 'Monthly Average Temperature',
        x: -20 //center
    },
    subtitle: {
        text: 'Source: WorldClimate.com',
        x: -20
    },
    xAxis: {
        categories: [0.0001,0.001,0.01,0.1,1,10,100]
    },
    yAxis: {
        title: {
            text: 'Temperature (°C)'
        },
        plotLines: [{
            value: 0,
            width: 1,
            color: '#808080'
        }]
    },
    tooltip: {
        valueSuffix: '°C'
    },
    legend: {
        layout: 'vertical',
        align: 'right',
        verticalAlign: 'middle',
        borderWidth: 0
    },
    series: [{
        name: 'Tokyo',
        data: [7.0, 6.9, 9.5, 14.5]
    }, {
        name: 'New York',
        data: [-0.2, 0.8, 5.7, 11.3]
    }, {
        name: 'Berlin',
        data: [-0.9, 0.6, 3.5, 8.4]
    }, {
        name: 'London',
        data: [3.9, 4.2, 5.7, 8.5]
    }]
});
});

使用highcharts,我想显示x轴标签0.0001,0.001,0.01,0.1,1,10,100。但没有表现出一些如何。

如何强制显示所有x轴值?

请帮忙。

1 个答案:

答案 0 :(得分:-2)

我认为您遗失了一些内容,我可以使用以下代码在您提供的数据上绘制聊天内容。

$(function () {
$('#container').highcharts({
    chart: {
        type: 'areaspline'
    },
    title: {
        text: 'Average fruit consumption during one week'
    },
    legend: {
        layout: 'vertical',
        align: 'left',
        verticalAlign: 'top',
        x: 150,
        y: 100,
        floating: true,
        borderWidth: 1,
        backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'
    },
    xAxis: {
        categories: [0.0001,0.001,0.01,0.1,1,10,100],
        plotBands: [{ 
            from: 4.5,
            to: 6.5,
            color: 'rgba(68, 170, 213, .2)'
        }]
    },
    yAxis: {
        title: {
            text: 'Fruit units'
        }
    },
    tooltip: {
        shared: true,
        valueSuffix: ' units'
    },
    credits: {
        enabled: false
    },
    plotOptions: {
        areaspline: {
            fillOpacity: 0.5
        }
    },
    series: [{
    name: 'Tokyo',
    data: [7.0, 6.9, 9.5, 14.5,0,0,0]
}, {
    name: 'New York',
    data: [-0.2, 0.8, 5.7, 11.3]
}, {
    name: 'Berlin',
    data: [-0.9, 0.6, 3.5, 8.4]
}, {
    name: 'London',
    data: [3.9, 4.2, 5.7, 8.5]
}]
});

});