2016-12-28 66 views
0

我正在使用角度測量儀在Highcharts 兩個撥號,實施爲兩個系列。Highcharts角度測量儀:不同顏色的多個錶盤

如何爲每個撥號設置不同的顏色來區分它們?

Highcharts.chart('container', { 

    chart: { 
     type: 'gauge', 
     plotBorderWidth: 0, 
     plotShadow: false 
    }, 

    pane: { 
     startAngle: -150, 
     endAngle: 150, 
    }, 

    // the value axis 
    yAxis: { 
     min: 1, 
     max: 5, 
    }, 

    series: [{ 
     name: 'Me', 
     data: [1.1], 
     color: '#DDDF0D' // doesn't seem to work    
     }, { 
     name: 'Average', 
     data: [3.3], 
     }] 
}, 

}

CSS樣式模式將設置所有撥號到相同的顏色。

對此提出建議?

回答

0

你需要設置它這樣,

yAxis: { 
      min: 0, 
      max: 100, 
      stops: [ 
       [0.1, '#e74c3c'], // red 
       [0.5, '#f1c40f'], // yellow 
       [0.9, '#2ecc71'] // green 
       ], 
      minorTickInterval: null, 
      tickPixelInterval: 400, 
      tickWidth: 0, 
      gridLineWidth: 0, 
      gridLineColor: 'transparent', 
      labels: { 
       enabled: false 
      } 

DEMO

0

沒關係啊,意識到我需要添加yAxis到系列:

Highcharts.chart('container', { 

chart: { 
    type: 'gauge', 
    plotBorderWidth: 0, 
    plotShadow: false 
}, 

pane: { 
    startAngle: -150, 
    endAngle: 150, 
}, 

// the value axis 
yAxis: { 
    min: 1, 
    max: 5, 
}, 

series: [{ 
    name: 'Me', 
    data: [1.1], 
    yAxis: 0, 
      dial: { 
      backgroundColor: 'red' 
      } 
    }, { 
    name: 'Average', 
    data: [3.3], 
    yAxis: 0, 
      dial: { 
      backgroundColor: 'green' 
      } 
    }] 

},