1
설문 조사를위한 진행률 표시 줄을 만들려고합니다. 진행 상황에 따라 각 데이터 요소에 색상을 동적으로 지정하고 싶습니다. 나는 이것을 관리해 왔지만 기능이 오래 실행되는 것 같습니다. 적어도, 그것은 내가 이것의 많은 부분을 처음 접했을 때의 나의 해석이다.비효율적 인 함수 - 하이 차트의 데이터 점에 색상을 지정하는 방법
제 질문은 다음과 같습니다. 어떻게 데이터 포인트에 색상을보다 효과적으로 할당 할 수 있습니까? 하나의 함수에서 여러 색상을 만들고 저장하면 Highchart 내에서 다른 색상을 참조하는 방법을 모르겠습니다.
http://jsfiddle.net/oskjerv/v4Lx69Lv/
내 질문에 몇 가지/당신의 하나에 의미가 있습니다 바랍니다.
모두 최고입니다.
Highcharts.chart('container', {
chart: {
type: 'bar'
},
title: {
text: ''
},
xAxis: {
categories: [''],
visible:false,
},
yAxis: {
min: 0,
visible:false
},
legend: {
reversed: true,
enabled:false
},
plotOptions: {
series: {
stacking: 'normal',
animation:false
}
},
labels: {
\t enabled: false
},
tooltip: {
\t \t \t enabled: false
},
exporting:{
\t \t \t enabled:false
},
credits:{
\t \t \t enabled:false
},
series: [{
name: 'Del1',
data: [.20],
color: getColourFirst()
}, {
name: 'Del2',
data: [.20],
color: getColourSecond()
}, {
name: 'Del3',
data: [.20],
color: getColourThird()
},
{
name: 'Del4',
data: [.20],
color: getColourFourth()
},
{
name: 'Del4',
data: [.20],
color: getColourFifth()
}]
});
function getColourFirst(){
var colour1=['#D5D4D4'];
return colour1;
}
function getColourSecond(){
var colour2=['#D5D4D4'];
return colour2;
}
function getColourThird(){
var colour3=['#87bdd8'];
return colour3;
}
function getColourFourth(){
var colour4=['#87bdd8'];
return colour4;
}
function getColourFifth(){
var colour5=['#87bdd8'];
return colour5;
}<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; max-width: 200px; height: 100px; margin: 0 auto"></div>