2017-10-09 6 views
0

4軸のグラフが正常に機能していますが、個別にチェックするために凡例の値をクリックすると問題が発生します。あなたは温度と定数のラベル値が誤って配置されていることに気づくとき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], 
    }] 
}); 

答えて

1

は、ここに私のコードです。各シリーズが適切なyAxisインデックスを指していることを確認する必要があります。

温度シリーズがインデックス3(第4軸)を指しており、定数にyAxisが定義されていません。これはデフォルトを意味します。したがって、あなたが次のように変更した場合:series.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:http://api.highcharts.com/highcharts/series.line.yAxis

の作業:https://jsfiddle.net/ewolden/276rv95s/1/

+0

はあなたの助けのためにどうもありがとうございますが.. :) –

関連する問題