Question

我似乎无法修复我的图表上的Y轴刻度。我的JSFiddle代码是here.

当您将鼠标悬停在线条上时，弹出的值与Y轴上的刻度不匹配（例如，当您将光标指向图形的中心时，黑线的值为60％但是当你看Y轴刻度，它表示200％）。

如何修复Y轴以显示适当的值？我试图使其信号强度显示0％-100％，主电源0-24V，温度显示30F-120F。代码：

function createChart() {

Highcharts.stockChart('container', {
            alignTicks: false,
    rangeSelector: {
        selected: 4
    },
    chart: {
      renderTo: 'container',
      height: 500,
        alignTicks: false
    },

    yAxis: [{ // Primary yAxis 
    tickAmount: 8,
    tickInterval: 1,
    labels: {
        format: '{value}°F',
        style: {
            color: Highcharts.getOptions().colors[2]
        }
    },
    title: {
        text: 'Temperature',
        style: {
            color: Highcharts.getOptions().colors[2]
        }
    },
    opposite: false

}, { // Secondary yAxis
            tickAmount: 8,
    tickInterval: 10,
    title: {
        text: 'Main Power',
        style: {
            color: Highcharts.getOptions().colors[0]
        }
    },
    labels: {
        format: '{value} volts',
        style: {
            color: Highcharts.getOptions().colors[0]
        }
    }

}, { // Tertiary yAxis
        tickAmount: 8,
    gridLineWidth: 0,
    title: {
        text: 'Signal Strength',
        style: {
            color: Highcharts.getOptions().colors[1]
        }
    },
    labels: {
        format: '{value} %',
        style: {
            color: Highcharts.getOptions().colors[1]
        }
    },
    opposite: true
}],




    plotOptions: {
        series: {
            compare: 'percent',
            showInNavigator: true
        }
    },

    tooltip: {
        pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.change}%)<br/>',
        valueDecimals: 2,
        split: true
    },

    series: [{
    name: 'Main Power',
    type: 'spline',
    yAxis: 1,
    data: [24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24],
    tooltip: {
        valueSuffix: ' V'
    }

}, {
    name: 'Signal Strength',
    type: 'spline',
    yAxis: 2,
    data: [20, 30, 40, 50, 60, 60, 60, 60, 70, 76, 78, 80],
    marker: {
        enabled: false
    },
    dashStyle: 'shortdot',
    tooltip: {
        valueSuffix: ' %'
    }

}, {
    name: 'Temperature',
    type: 'spline',
    yAxis: 0,
    data: [70, 70, 76, 75, 78, 72, 80, 73, 75, 78, 72, 73],
    tooltip: {
        valueSuffix: ' °F'
    }
}]
});

Answer 1

删除＆＃34;％＆＃34;在：

plotOptions: {
        series: {
            compare: 'percent',
            showInNavigator: true
        }
    },

HighCharts Y轴刻度不正确

1 个答案: