2017-07-16 76 views
0

我想繪製4個Y軸的圖形。我知道如何製作雙Y軸圖形,但我無法制作帶4軸的圖形。我已經包含了雙Y軸圖形的一個示例。有人請幫助我在這個雙Y軸圖形中製作4個Y軸圖形。如何用4個Y軸繪製圖形

Highcharts.chart('container', { 
 
    chart: { 
 
     marginRight: 80 // like left 
 
    }, 
 
    xAxis: { 
 
     categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] 
 
    }, 
 
    yAxis: [{ 
 
     lineWidth: 1, 
 
     title: { 
 
      text: 'Primary Axis' 
 
     } 
 
    }, { 
 
     lineWidth: 1, 
 
     opposite: true, 
 
     title: { 
 
      text: 'Secondary Axis' 
 
     } 
 
    }], 
 

 
    series: [{ 
 
     data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4] 
 
    }, { 
 
     data: [144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2], 
 
     yAxis: 1 
 
    }] 
 
});
<div id="container" style="height: 400px"></div> 
 
<script src="https://code.highcharts.com/highcharts.js"></script>

回答

1

你一樣做了兩個軸。

在yAxis部分中定義4軸,並在系列部分中指定哪些數據進入哪個軸。

yAxis: [{ 
     lineWidth: 1, 
     title: { 
      text: 'Primary Axis' 
     } 
    }, { 
     lineWidth: 1, 
     opposite: true, 
     title: { 
      text: 'Secondary Axis' 
     } 
    }, { 
     lineWidth: 1, 
     opposite: false, 
     title: { 
      text: 'third Axis' 
     } 
    }, { 
     lineWidth: 1, 
     opposite: false, 
     title: { 
      text: 'fourth Axis' 
     } 
    }], 

    series: [{ 
     data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4] 
    }, { 
     data: [144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2], 
     yAxis: 1 
    }, { 
     data: [44.0, 76.0, 35.6, 48.5, 116.4, 180.1, 195.6, 154.4, 129.9, 72.5, 108.4, 159.2], 
     yAxis: 2 
    }, { 
     data: [ 95.6, 54.4, 29.9, 71.5, 106.4, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1,129.2], 
     yAxis: 3 
    }] 

here是你

樣本小提琴