Question

我对Highcharts有一个问题，我的两个y轴之一的天花板没有得到尊重。

Y轴“1”表示百分比值，因此楼层为0，天花板为100.

Y轴“2”表示货币值，因此Floor为0且 null 的上限。

由于某种原因，y轴“1”的标签最多为150。

如果我更改相应的系列数据以使值0更改为20，则问题似乎消失，标签将停止在100处。

var dataX = [0, 67,  43, 100, 100, 80];
var dataY = [950, 900, 807, 650, 600, 450];

$(function () {
    $('#container').highcharts({

        series: [{
            name: 'Series 1',
            data: dataX,
            yAxis: 0},
        {
            name: 'Series 2',
            data: dataY,
            yAxis: 1}],
        yAxis: [{
                floor: 0,
                ceiling: 100,
                title: {
                    text: '1'
                },
            },
            {
                floor: 0,
                ceiling: null,
                title: {
                    text: '2'
                },

                opposite: true}]});});

http://jsfiddle.net/2bzew/2/

任何人都可以解释为什么会这样吗？

Answer 1

我遇到了类似的问题，但我发现使用以下方法解决了这个问题：

        maxPadding: 0,
        minPadding: 0,

这些值的默认值均为0.05，因此将添加到您的数据中并导致高压使y轴大于预期值。将它们归零似乎可以解决我的问题。

我还建议设置以下内容，使最大值仍然有标签：

        showLastLabel: true,

http://jsfiddle.net/M4bVz/

Answer 2

来自Highcharts API：

使用多个轴时，两个或多个相对轴的刻度将通过向轴或最小刻度轴添加刻度来自动对齐。将alignTicks设置为false可以防止这种情况。如果网格线看起来很杂乱，最好通过将gridLineWidth设置为0来隐藏它们作为辅助轴。默认为true。

我已经更新了你的小提琴。

chart: {
        alignTicks: false
    },
...
yAxis: [{
            ...
            gridLineWidth: 0,
            ...

http://jsfiddle.net/2bzew/3/

Answer 3

您可以随时创建自己的tickPositioner，也可以直接设置tickPositions：http://jsfiddle.net/2bzew/4/

参见文档和更多示例：

Highcharts y轴天花板未得到尊重

3 个答案: