Question

我的问题是主要和次要yAxis零不在同一级别。截图可以更好地描述我的问题。有没有可能解决这个问题？这是JSFiddle

Highcharts.chart('container', {
title: {
    text: 'Stückzahl'
},
xAxis: {
    categories: ['5007.205.1.1.1', '5007.225.1.1.1', '5007.285.1.1.1'],
    labels:{
        enabled: false
    }
},
credits: {
    enabled: false
},
legend:{
    enabled: false
},
yAxis: [{
    title: {
        text: 'Stückzahl',
    },
    opposite: false
},{
    title: {
        text: 'FOR[%]',
    },
            opposite: true,
    max:100,
    min:0
}],
series: [
{
        type: 'column',
    name: 'Sollwert',
    pointWidth:30,
    grouping: false,
    color: 'rgba(0,0,0,0.1)',
    data: [2000, 1500, 1600],
    yAxis: 0
},{
        dataLabels:{
        enabled:true
    },
    type: 'column',
    grouping: false,
    pointWidth:20,
    name: 'John',
    data: [1941, 975, 1936],
    yAxis: 0
},{
        dataLabels:{
        enabled:true
    },
    color:'#ef703e',
    grouping: false,
    pointWidth:20,
    type: 'column',
    data: [-27, -15, -350],
    yAxis: 0
},{
    color:'black',
    data: [80,60,99],
    yAxis: 1,
    type: 'line'
}]

});

要发布这个问题，我需要更好地描述我的问题。所以忽略这些最后一行：/

Answer 1

Highcharts用户语音有一个实验性的包装 - multiple axis alignment control。它是在不久前写的，但它仍然有效。

换行：

/**
 * Experimental Highcharts plugin to implement chart.alignThreshold option. This primary axis
 * will be computed first, then all following axes will be aligned to the threshold.
 * Author: Torstein Hønsi
 * Last revision: 2016-11-02
 */
(function (H) {
    var Axis = H.Axis,
        inArray = H.inArray,
        wrap = H.wrap;

    wrap(Axis.prototype, 'adjustTickAmount', function (proceed) {
        var chart = this.chart,
            primaryAxis = chart[this.coll][0],
            primaryThreshold,
            primaryIndex,
            index,
            newTickPos,
            threshold;

        // Find the index and return boolean result
        function isAligned(axis) {
            index = inArray(threshold, axis.tickPositions); // used in while-loop
            return axis.tickPositions.length === axis.tickAmount && index === primaryIndex;
        }

        if (chart.options.chart.alignThresholds && this !== primaryAxis) {
            primaryThreshold = (primaryAxis.series[0] && primaryAxis.series[0].options.threshold) || 0;
            threshold = (this.series[0] && this.series[0].options.threshold) || 0;

            primaryIndex = primaryAxis.tickPositions && inArray(primaryThreshold, primaryAxis.tickPositions);

            if (this.tickPositions && this.tickPositions.length &&
                    primaryIndex > 0 &&
                    primaryIndex < primaryAxis.tickPositions.length - 1 &&
                    this.tickAmount) {

                // Add tick positions to the top or bottom in order to align the threshold
                // to the primary axis threshold
                while (!isAligned(this)) {

                    if (index < primaryIndex) {
                        newTickPos = this.tickPositions[0] - this.tickInterval;
                        this.tickPositions.unshift(newTickPos);
                        this.min = newTickPos;
                    } else {
                        newTickPos = this.tickPositions[this.tickPositions.length - 1] + this.tickInterval;
                        this.tickPositions.push(newTickPos);
                        this.max = newTickPos;
                    }
                    proceed.call(this);
                }
            }

        } else {
            proceed.call(this);
        }
    });
}(Highcharts));

您需要做的就是在alignThresholds选项中设置chart。

Highcharts.chart('container', {
  chart: {
    alignThresholds: true
  },

直播示例：http://jsfiddle.net/f3urehs0/

主要和次要yAx在不同级别上为零

1 个答案: