2016-12-28 4 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' 
      } 
    }] 

},