Používám highcharts k vytvoření piechartu, ale mám potíže s načítáním vlastní sady barev pro můj graf.
Tady je můj kód:
<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>
Můj výsečový graf funguje s tímto kódem, ale používá pouze výchozí barevnou paletu.
Jak určíte vlastní sadu barev?
Všechny odpovědi
Podívejte se na následující příkladhttp://jsfiddle.net/8QufV/
Pro ty z vás, kteří dávají přednost inicializaci barev v konfiguracích, můžete jednoduše dát barvy do části plotOptions v konfiguračním objektu takto:
Myslím, že musíte nastavit barvy pomocí motivu namísto setOptions takto:
Chcete-li odpovědět na otázku @Loko Web Designhttps://stackoverflow.com/a/38794379/7475250
Barevné dokumenty jsou k dispozicitady. Ačkoli jsou užitečné, nepopisují, co změna konkrétní barvy ve skutečnosti dělá. Níže je můj nejlepší popis.
Podpěra barev dává Highcharts barvy, které chcete, aby graf procházel. Například pokud jste měli následující barevnou podpěru.
Vaše výseče koláče by se střídaly mezi modrou a zelenou. Pokud změníte modrou barvu na červenou, barvy se budou střídat mezi červenou a zelenou. Vyzkoušejte to následujícím způsobemhousle
Rozšiřování seznamu barev zvyšuje počet barev před opakováním.
Opakoval by barvy, pokud jsou ve vaší datové sadě více než 4 řezy.
Existuje webová stránka, která říká, čemu odpovídá každá z „barev“? Všechny odpovědi zde ukazují něco jako:
Ale co se vlastně mění # 333, # CB2326 atd.? Je zřejmé, že je mohu jen změnit a zjistit, jaké změny, ale bylo by hezké mít někde k dispozici tuto referenci.
Měl jsem stejný problém. V highcharts.css je sekce s názvem "Výchozí barvy". Poté, co jsem odstranil tuto sekci, jsem mohl použít vlastní barvy. Každopádně myslím, že nepotřebujete highcharts.css, pokud používáte verzi v5.0.4 nebo vyšší.
Highcharts.Color (Highcharts.getOptions (). Colors [0]). SetOpacity (0.5) .get ('rgba')]
Ve vysokých grafech máme vestavěné barvy. Musíte tedy změnit cestu barvy [0] nebo [1] ........ [6]
Leave a Reply