如何在Highcharts中修复y轴上数组的值

时间:2022-10-18 20:50:27

I'm trying to display an array of 7 dynamic percentages on the y-axis using the property tickPositions, but Highcharts automatically excludes the last element of the array. How could I include this element?

我正在尝试使用属性tickPositions在y轴上显示7个动态百分比的数组,但Highcharts会自动排除数组的最后一个元素。我怎么能包含这个元素?

My current Graph:

我目前的图表:

如何在Highcharts中修复y轴上数组的值

The result I'm looking for with highlighted addition:

我正在寻找的结果突出显示:

如何在Highcharts中修复y轴上数组的值

Here is a sample of how I set up the y-axis,

以下是我如何设置y轴的示例,

yAxis: [{
            visible: false,
            labels: {
                format: " "
            },
            title: {
                text: " "
            }
        },
        {
            tickPositions: dataKickbacks.KickbackLevels.Percentage,
            endOnTick: true,
            title: {
                text: "Kickback",
                style: {
                    color: "#000000"
                }
            },
            labels: {
                format: '{value}%'
            },
            style: {
                color: "#000000"
            },
            opposite: true
        }],

series: [{
        name: "Revenue",
        color: "#D8D8D8",
        type: "column",
        data: monthlyAmount,
        tooltip: {
            valuePrefix: 'CHF '
        },


    }, {
        name: "Projected Kickback",
        color: "#000000",
        type: "line",
        yAxis: 1,
        dashStyle: "line",
        shadow: true,
        data: [
            [0, initialKickbackPercentage],
            [11, projectedKickbackPercentage]
        ],
        marker: {
            enabled: false
        },
        tooltip: {
            valueSuffix: '%'
        },

    }]

1 个解决方案

#1


2  

tickPositions may not be the best approach for your needs. tickInterval works better for your chart.

tickPositions可能不是满足您需求的最佳方法。 tickInterval更适合您的图表。

yAxis: {
            tickInterval: 2.5,
            max: 15,
            min: 0,
}

We decided tickInterval, max and min values for our yAxis. So our chart will shown just like you want.

我们确定了yAxis的tickInterval,max和min值。所以我们的图表会像你想要的那样显示出来。

I made a working example for you which you can see here: jsFiddle.

我为你做了一个工作实例,你可以在这里看到:jsFiddle。

#1


2  

tickPositions may not be the best approach for your needs. tickInterval works better for your chart.

tickPositions可能不是满足您需求的最佳方法。 tickInterval更适合您的图表。

yAxis: {
            tickInterval: 2.5,
            max: 15,
            min: 0,
}

We decided tickInterval, max and min values for our yAxis. So our chart will shown just like you want.

我们确定了yAxis的tickInterval,max和min值。所以我们的图表会像你想要的那样显示出来。

I made a working example for you which you can see here: jsFiddle.

我为你做了一个工作实例,你可以在这里看到:jsFiddle。