使用4軸時數值和標籤文字中的Highchart問題

Question

我有一個4軸的圖形，它工作正常，但當單擊圖例值單獨檢查時，我遇到了問題。

在這裏，我創造了我的問題的樣本：

https://jsfiddle.net/276rv95s/

如果您發現溫度和恆定的標籤值是錯誤放置。我不知道我的代碼有什麼問題。

這裏是我的代碼：

Highcharts.chart('container', { 
    chart: { 
     zoomType: 'xy' 
    }, 
    title: { 
     text: 'Sample' 
    }, 
    xAxis: [{ 
     categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 
      'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], 
     crosshair: true 
    }], 
    yAxis: [{ // Primary yAxis 
     labels: { 
      style: { 
       color: Highcharts.getOptions().colors[2] 
      } 
     }, 
     title: { 
      text: 'Temperature', 
      style: { 
       color: Highcharts.getOptions().colors[2] 
      } 
     }, 

    }, { // Secondary yAxis 
     gridLineWidth: 0, 
     title: { 
      text: 'Rainfall', 
      style: { 
       color: Highcharts.getOptions().colors[0] 
      } 
     }, 
     labels: { 
      style: { 
       color: Highcharts.getOptions().colors[0] 
      } 
     } 
    }, { // Tertiary yAxis 
     title: { 
     text: 'Sea', 
      style: { 
       color: Highcharts.getOptions().colors[1] 
      } 
     }, 
     opposite: true 
    },{ // 4th yAxis 
     gridLineWidth: 0, 
     title: { 
      text: 'Constant', 
      style: { 
       color: Highcharts.getOptions().colors[3] 
      } 
     }, 
     labels: { 
      style: { 
       color: Highcharts.getOptions().colors[3] 
      } 
     }, 
     opposite: true 

    }], 
    series: [{ 
     name: 'Rainfall', 
     type: 'column', 
     yAxis: 1, 
     data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4], 
    }, { 
     name: 'Sea-Level Pressure', 
     type: 'spline', 
     yAxis: 2, 
     data: [1016, 1016, 1015.9, 1015.5, 1012.3, 1009.5, 1009.6, 1010.2, 1013.1, 1016.9, 1018.2, 1016.7], 
     marker: { 
      enabled: false 
     }, 
     dashStyle: 'shortdot', 
     tooltip: { 
      valueSuffix: ' mb' 
     } 
    }, { 
     name: 'Temperature', 
     type: 'spline', 
     yAxis: 3, 
     data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6], 
    }, { 
     name: 'Constant', 
     type: 'spline', 
     data: [2, 6, 5, 1.5, 11, 21.5, 25.2, 26.5, 23.3, 8.3, 1.9, 2.6], 
    }] 
}); 

Answer 1

你在你的代碼的兩個問題，在溫度系列恆系列。您需要確保每個系列都指向相應的yAxis索引。

溫度系列指向索引3（第四軸），常數沒有定義yAxis，這意味着它是默認值。因此，如果您更改爲以下：

{ 
    name: 'Temperature', 
    type: 'spline', 
    yAxis: 0, //changed this from 3 to 0 
    data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6], 
}, { 
    name: 'Constant', 
    type: 'spline', 
    yAxis: 3, //added this 
    data: [2, 6, 5, 1.5, 11, 21.5, 25.2, 26.5, 23.3, 8.3, 1.9, 2.6], 
} 

API上series.yAxis：http://api.highcharts.com/highcharts/series.line.yAxis

工作示例：https://jsfiddle.net/ewolden/276rv95s/1/