javascript - 在 HighChart 中添加点之间的间距

问题描述

有没有办法在具有相似值的点之间添加更多间距，这样它们看起来就不会像照片中那样混乱？我正在使用 HighCharts。我改变了 Y 轴的步长，但它看起来一样，因为值有 1-5% 的差异。

Highcharts.chart('id', {
    chart: {
        type: 'line'
    },
    title: {
        text: chartName
    },
    xAxis: {
        categories: chartCategories
    },
    yAxis: {
        title: {
            text: ''
        },
        labels: {
            format: '{value} %'
        }
    },
    plotOptions: {
        line: {
            dataLabels: {
                enabled: false,
                format: '{y} %'
            },
            enableMouseTracking: true
        }
    },
    tooltip: {
        pointFormat: '<span style="color:{series.color}; padding:0"> {series.name}: ' + '<b>{point.y} %</b></span>',
        useHTML: true
    },
    series: chartSeries
});

});

标签： javascripthighcharts

您可以使用该tickPositioner功能并最大化系列占用的空间：

yAxis: {
    tickPositioner: function(){
        const positions = [],
            step = (this.dataMax - this.dataMin) / 5;
        
        for (var i = this.dataMin; i <= this.dataMax; i += step) {
            positions.push(i);
        }
        
        return positions;
    }
}

现场演示：http: //jsfiddle.net/BlackLabel/pe7qy816/

API 参考： https ://api.highcharts.com/highcharts/yAxis.tickPositioner

javascript - 在 HighChart 中添加点之间的间距

问题描述

解决方案

推荐阅读