2016-11-25 1 views
1

Hallo Ich möchte alternative Spaltenfarbe für jede Spalte festlegen.
fiddle Vielen Dank im VorausWie wird die individuelle Spaltenfarbe im Amcharts-Bestandsspalte-Diagramm eingestellt?

+0

Fiddle Link http://jsfiddle.net/rbz7312m/ – Sourav

+0

https://www.amcharts.com/kbase/automatically-apply-theme-colors-to -each-individual-column/ – Mahi

+0

@Mahi - Sie haben die richtige Idee, aber es beschönigt die Details ein wenig, da es ein Plugin implementiert, um Themenfarben auf jede Spalte anzuwenden, was es etwas übertrieben macht, was er zu tun versucht. Sie müssen auch einen zusätzlichen Schritt ausführen, wenn Sie die Aktienkurse verwenden, wie in meiner Antwort unten beschrieben. – xorspark

Antwort

1

@Mahi die richtige Idee, aber der Link verweist auf eine Plugin-basierte Lösung, die Farben aus dem aktuellen Chart-Thema gilt, damit er über die Einzelheiten Glossen.

Um dies genauer auszuführen, müssen Sie beim Festlegen einzelner Spalten- (oder Linien-/Aufzählungs-) Farben in Ihrem Diagrammobjekt lineColorField und fillColorsField definieren und dann die Farbe in Ihren Daten festlegen. Zum Beispiel in Ihren Daten:

[ 
    { 
    "date": "2016-11-25", 
    "value": 3, 
    "color": "#ff0000" 
    }, 
    { 
    "date": "2016-11-26", 
    "value": 3, 
    "color": "#00ff00" 
    }, 
    // ... 
] 

Und dann in Ihrem Diagrammobjekt:

"graphs": [{ 
    "lineColorField": "color", 
    "fillColorsField": "color", // if your chart has a fill like a column or area line graph 
    // ... 
}] 

Oder stockGraph Lager Chart:

"stockGraphs": [{ 
    "lineColorField": "color", 
    "fillColorsField": "color", // if your chart has a fill like a column or area line graph 
    // ... 
}] 

für Charts wie Ihre Geige, müssen Sie auch Legen Sie für die Eigenschaft maxSeries von categoryAxesSettings 0 fest, da die benutzerdefinierten Farben nicht angewendet werden können, während die Datengruppierungsfunktion aktiviert ist.

"categoryAxesSettings": { 
    "maxSeries": 0, 
    // ... 
} 

Hier ist eine aktualisierte Geige: http://jsfiddle.net/rbz7312m/3/

+1

Danke ... Du hast mich gerettet. Ich werde Ihnen sehr dankbar sein .... – Sourav

Verwandte Themen