2017-11-01 3 views
0

Ich benutze Highcharts boxplot => dafür möchte ich unterschiedliche Farbe für jede Gruppe (jede Box) haben. Ich kann Farbe auf Serienniveau liefern, aber das wird die Farbe aller Boxen ändern. Was ich erreichen möchte, ist für jede Box verschiedene Farben zu haben. Auf der Suche nach dem besten Weg, das zu erreichen.Wie ändere ich die Farbe jeder Gruppe in Boxplot (Highcharts)

haben Sie einen Blick auf

Highcharts.chart('container', { 

chart: { 
    type: 'boxplot' 
}, 

title: { 
    text: 'Highcharts Box Plot Example' 
}, 

legend: { 
    enabled: false 
}, 

xAxis: { 
    categories: ['1', '2', '3', '4', '5'], 
    title: { 
     text: 'Experiment No.' 
    } 
}, 

yAxis: { 
    title: { 
     text: 'Observations' 
    }, 
    plotLines: [{ 
     value: 932, 
     color: 'red', 
     width: 1, 
     label: { 
      text: 'Theoretical mean: 932', 
      align: 'center', 
      style: { 
       color: 'gray' 
      } 
     } 
    }] 
}, 

series: [{ 
    name: 'Observations', 
    data: [ 
     [760, 801, 848, 895, 965], 
     [733, 853, 939, 980, 1080], 
     [714, 762, 817, 870, 918], 
     [724, 802, 806, 871, 950], 
     [834, 836, 864, 882, 910] 
    ], 
    tooltip: { 
     headerFormat: '<em>Experiment No {point.key}</em><br/>' 
    } 
}, { 
    name: 'Outlier', 
    color: Highcharts.getOptions().colors[0], 
    type: 'scatter', 
    data: [ // x, y positions where 0 is the first category 
     [0, 644], 
     [4, 718], 
     [4, 951], 
     [4, 969] 
    ], 
    marker: { 
     fillColor: 'white', 
     lineWidth: 1, 
     lineColor: Highcharts.getOptions().colors[0] 
    }, 
    tooltip: { 
     pointFormat: 'Observation: {point.y}' 
    } 
}] 

});

http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/demo/box-plot/

dank

+0

ich in der Lage bin, dies zu tun gefunden, indem sie eine neue Serie Feind jedes Feld zu schaffen und dann jede Reihe wird eine andere Farbe zugewiesen, aber um X-Achsen-Kategorien zu verwalten, muss ich einige leere Felder hinzufügen .. was ich nicht mag. http://jsfiddle.net/ccvhrhpr/ –

Antwort

0

Nach einigen Recherchen ich die Antwort,

plotOptions: { 
    series: { 
     colorByPoint: true 
    } 
} 

dank

Verwandte Themen