1

如何限制在 Highcharts 的 X 轴上显示刻度?最后一个在 X 轴外: 在此处输入图像描述

我的来源:

var options = {
chart: {
    renderTo: 'chart',
    events: {
        load: function(event) {
        }
    },
    type: 'spline',
    animation: false
},
title: {
    text: ''
},
colors: [
    '#499878','black'
],
rangeSelector: {
    enabled: false
},
credits: {
    enabled: false
},
tooltip: {
    shared: true,
    crosshairs: true
},






series: [{
    name: 'Temperature (°C)',
    type: 'spline',
    tooltip : {
        valueDecimals: 2,
        valueSuffix: ' °C'
    },
    yAxis: 0,
    color: '#89A54E',
    data: []

},{
    name: 'Wind speed (m/s)',
    type: 'spline',
    tooltip : {
        valueDecimals: 2,
        valueSuffix: ' m/s'
    },
    yAxis: 1,
    color: '#4572A7',
    data: []
},{
    name: 'Humidity (%)',
    type: 'spline',
    tooltip : {
        valueDecimals: 2,
        valueSuffix: ' %'
    },
    yAxis: 2,
    color: '#910000',
    data: []
},{
    name: 'Wind direction (°)',
    type: 'spline',
    tooltip : {
        valueDecimals: 2,
        valueSuffix: ' °'
    },
    yAxis: 3,
    color: '#000000',
    dashStyle: 'shortdot',
    data: []
}],



xAxis: {
    type: 'datetime',
    tickInterval: 10000,
    min: 0,
    max: 0
},



yAxis: [{
    labels: {
        style: {
            color: '#89A54E'
        }
    },
    title: {
        text: 'Temperature',
        style: {
            color: '#89A54E'
        }
    },
    gridLineWidth: 1,
    opposite: true
},{
    labels: {
        formatter: function() {
            return this.value +' m/s';
        },
        style: {
            color: '#4572A7'
        }
    },
    title: {
        text: 'Wind speed',
        style: {
            color: '#4572A7'
        }
    },
    gridLineWidth: 1,
    opposite: false,
    min: 0
},{
    labels: {
        formatter: function() {
            return this.value +' %';
        },
        style: {
            color: '#910000'
        }
    },
    title: {
        text: 'Humidity',
        style: {
            color: '#910000'
        }
    },
    gridLineWidth: 1,
    opposite: true
},{
    labels: {
        formatter: function() {
            return this.value +' °';
        },
        style: {
            color: '#000000'
        }
    },
    title: {
        text: 'Wind direction',
        style: {
            color: '#000000'
        }
    },
    opposite: false,
    reversed: true,
    min: 0,
    max: 360,

    minorGridLineDashStyle: 'longdash',
    minorTickInterval: 'auto',
    minorTickWidth: 0,
    tickInterval: 90
}],




plotOptions: {
    spline: {
        lineWidth: 3,
        states: {
            hover: {
                lineWidth: 5
            }
        },
        marker: {
            enabled: false
        }
    },
    scatter: {
        marker: {
            enabled: true
         }
    }
}
};
4

2 回答 2

0

我发现它的问题oveflow: 'justify'jsfiddle

于 2013-10-22T17:53:39.063 回答
-1

如果您使用 'spacingRight' ( http://api.highcharts.com/highcharts#chart.spacingRight ) 会发生什么,如下所示:

chart: {
    renderTo: 'chart',
    events: {
        load: function(event) {
        }
    },
    type: 'spline',
    animation: false,
    spacingRight: 100 // you may change this for testing...
},
于 2013-08-05T02:31:03.257 回答