Question

使用双x轴时，我看到使用highcharts的奇怪行为。基本上，highcharts在第二轴的末尾添加额外的刻度。

背景 - 为什么我这样做。

尝试创建具有固定类别（x轴）和计数（y轴）的柱形图，然后尝试绘制表示百分比（即介于0和100之间）的二级绘图线。为了做到这一点，我使用了辅助x轴，为了避免与柱形图冲突，我还使用了基于样条曲线的辅助y轴（但系列中没有数据）。

不幸的是，由于某些原因，辅助x轴（用于绘图线）有额外的刻度添加到结尾。在下面的小提琴中，即使此x轴上的最小值和最大值设置为0到100，它也会从0变为160.

知道如何强制辅助轴保持在0到100之间吗？

小提琴：

Highchart配置：

{
        "chart": {},
        "title": {
            "text": "This survey run"
        },
        "xAxis": [
            {
                "title": {
                    "text": null
                },
                "categories": [
                    "Very low",
                    "Low",
                    "Neutral",
                    "High",
                    "Very high"
                ]
            },
            {
                "title": {
                    "text": null
                },
                "opposite": true,
                "plotLines": [
                    {
                        "color": "red",
                        "dashStyle": "longdashdot",
                        "value": 50,
                        "width": 2
                    }
                ],
                "labels": {
                    "enabled": true,
                    "step": 1
                },
                "min": 0,
                "max": 100
            }
        ],
        "yAxis": [
            {
                "min": 0,
                "title": {
                    "text": "Number of responses",
                    "align": "high"
                },
                "labels": {
                    "overflow": "justify"
                },
                "allowDecimals": false
            },
            {
                "min": 0,
                "title": {
                    "text": null
                },
                "opposite": true
            }
        ],
        "legend": {
            "enabled": false
        },
        "plotOptions": {
            "column": {
                "dataLabels": {
                    "enabled": true,
                    "color": "black",
                    "style": {
                        "fontWeight": "bold",
                        "text": "0 0 3px black"
                    }
                }
            }
        },
        "credits": {
            "enabled": false
        },
    "series": [
        {
            "name": "Responses",
            "type": "column",
            "pointRange": 0,
            "xAxis": 0,
            "yaxis": 0,
            "data": [
                0,
                1,
                1,
                8,
                1
            ]
        },
        {
            "name": "Net Position",
            "type": "spline",
            "pointRange": 0,
            "xAxis": 1,
            "yaxis": 1
        }
    ]
}

Answer 1

您需要在xAxis中设置一些选项，例如：

        startOnTick:true,
        endOnTick:true,
        tickPositions: [0, 20, 40, 60, 80, 100]

示例：http://jsfiddle.net/5ypnffww/3/

Highcharts双x轴列+线正在向辅助x轴添加刻度

1 个答案: