Comment puis-je changer les couleurs de mon highcharts piechart?

Je suis en utilisant highcharts pour faire un piechart mais je vais avoir des problèmes pour charger un jeu de couleurs personnalisé pour mon tableau.

Voici mon code:

     <script type="text/javascript">
     $(function () {
     Highcharts.setOptions({
     colors: ['#50B432', '#ED561B', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#FFF263',      '#6AF9C4']
    });
    return new Highcharts.Chart({


        chart: {
            renderTo: 'trailpiechart',
            plotBackgroundColor: null,
            plotBorderWidth: null,
            plotShadow: false,
            backgroundColor: "#f8f8f8",
            margin: [20, 20, 20, 20]
        },


        credits: {
            enabled: false
        },

        title: {
            text: caption
        },
        tooltip: {
            formatter: function () {
                return this.y + ' links';
            }
        },
        plotOptions: {
            pie: {
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    enabled: false
                },
                showInLegend: true
            }
        },
        legend: {
            layout: 'vertical',
            floating: false,
            borderRadius: 0,
            borderWidth: 0
        },
        series: [{
            type: 'pie',
            name: 'Browser share',
            data: data
        }]
    });
    });
</script>

Mon camembert fonctionne avec ce code, mais il n'utilise que les couleurs par défaut de la palette.

Comment spécifier une couleur personnalisée définie?

InformationsquelleAutor Sreenath Plakkat | 2012-04-04

78
```
Highcharts.setOptions({
 colors: ['#50B432', '#ED561B', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#FFF263', '#6AF9C4']
});
```
Regardez l'exemple suivant
http://jsfiddle.net/8QufV/
- J'ai essayé ceci mais, ma légende couleur se change, mais le camembert de la couleur n'est pas en train de changer.
InformationsquelleAutor Ricardo Alvaro Lohmann
7

Je pense que ce que vous devez faire est de définir les couleurs à l'aide de thème au lieu de setOptions comme suit:
```
Highcharts.theme = {colors: ['#50B432', '#ED561B', '#DDDF00', '#24CBE5', 
                             '#64E572', '#FF9655', '#FFF263', '#6AF9C4']});
```
- Si vous allez à camembert Démo, puis cliquez sur "Afficher le thème visuel", vous verrez comment manipuler l'ensemble du thème.
- salut Todd couleur ne change pas à l'aide de votre code ci-dessus .toujours montrant les couleurs par défaut du graphique à secteurs
InformationsquelleAutor Linger

Pour ceux d'entre vous qui préfèrent pour initialiser la couleur dans les configs, vous pouvez simplement mettre les couleurs dans le plotOptions partie de l'objet de config comme suit:

...,
plotOptions: {
  pie: {
   colors: [
     '#50B432', 
     '#ED561B', 
     '#DDDF00', 
     '#24CBE5', 
     '#64E572', 
     '#FF9655', 
     '#FFF263', 
     '#6AF9C4'
   ],
   allowPointSelect: true,
   cursor: 'pointer',
   dataLabels: {
     enabled: false
   },
   showInLegend: true
 }
},
...

InformationsquelleAutor Ali Yazdani

2

Pour répondre à @Loko Web Design est question https://stackoverflow.com/a/38794379/7475250
Est-il une page web qui dit à ce que chacun des "couleurs" correspond? Toutes les réponses ici montrer quelque chose comme:
```
colors: ['#333', '#CB2326', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#CB2326', '#6AF9C4']
```
Mais ce n' #333, #CB2326, etc. en fait le changement? Évidemment, je peux juste
de les changer et de voir quels changements, mais il serait agréable d'avoir ce
référence disponible quelque part.
La couleur docs sont disponibles ici. Bien qu'utiles, ils ne décrivent pas ce que la modification d'une couleur spécifique dans la réalité. Ci-dessous est ma meilleure description.

Les couleurs prop donne Highcharts les couleurs que vous souhaitez le graphique à boucle à travers. Par exemple, si vous avez eu de couleurs suivantes prop.
```
colors: ['blue', 'green']
```
Vos morceaux de tarte serait d'alterner entre le bleu et le vert. Évolution du bleu vers le rouge de vos couleurs puis alternez entre le rouge et le vert. Test avec les éléments suivants violon

L'expansion de la liste des couleurs augmente le nombre de couleurs avant de répéter.
```
colors: ['blue', 'green', 'yellow']
```
Voudrais répéter les couleurs si plus de 4 tranches sont dans votre ensemble de données.
- C'est parfait. Merci!
InformationsquelleAutor BJax

Highcharts.setOptions({
 colors: ['#333', '#CB2326', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#CB2326',      '#6AF9C4']
});

InformationsquelleAutor min2bro

1

Est-il une page web qui dit à ce que chacun des "couleurs" correspond? Toutes les réponses ici montrer quelque chose comme:
```
colors: ['#333', '#CB2326', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#CB2326', '#6AF9C4']
```
Mais ce n' #333, #CB2326, etc. en fait le changement? Évidemment, je peux juste de les changer et de voir quels changements, mais il serait agréable d'avoir cette référence disponible quelque part.

InformationsquelleAutor Loko Web Design
0

J'ai eu le même problème. Dans highcharts.css il y a une section intitulée "les couleurs par Défaut". Après j'ai supprimé cet article, j'ai pu utiliser des couleurs personnalisées. De toute façon, je suppose que vous n'avez pas besoin highcharts.css si vous utilisez la version v5.0.4 ou plus.

InformationsquelleAutor bugovicsb
0

Highcharts.Couleur(Highcharts.getOptions().couleurs[0]).setOpacity(0.5).get('rgb')]

En haut de graphiques intégré couleurs que nous avons. Si vous avez besoin de changer le chemin de la couleur[0] ou [1]........[6]

InformationsquelleAutor Kondal

Vous devez vous connecter pour publier un commentaire.