我可以根据它是高于(红色)还是低于(绿色)或介于(黄色)之间来更改标记颜色,但不能更改标记之间线条的颜色。这可能吗?现在,它只显示为一条蓝线。
function makeRun(divId, last, current, goal, title, yAxisTitle) {
var width = 1000; var SizeOfFont = '14px';
var min = checkMinMaxArray(current, last, goal, 'min') * 995 / 1000; //sets min closely below the real min. **consider changing to 4/5 digits**
var max = checkMinMaxArray(current, last, goal, 'max') * 1005 / 1000; //sets max closely above the real max
//if there are projections, color code the columns here
preprocessData = function (data, last, goal) {
var nData = [];
var colorGood = 'green'; var colorBad = '#E42217'; var colorUse;
for (var i = 0; i < data.length; i++) {
if (data[i] <= goal[i]) { colorUse = colorGood; }
else if (data[i] > last[i]) { colorUse = colorBad; }
else { colorUse = '#FFE303'; }
nData.push({
y: data[i],
x: i,
fillColor: colorUse,
color: colorUse
});
}
return nData;
};
var chart = new Highcharts.Chart({
chart: {
renderTo: divId,
height: 275, //little bigger than alotted height to make more readable
width: width //dependent on #gauges
},
title: {
text: title, //should all be the same, can make a parameter if need to be different
style: { //size of text above
fontSize: SizeOfFont
}
},
xAxis: {
//categories: xAxisTitles,
labels: { //size of the Text above^^
style: {
fontSize: SizeOfFont
}
}
},
yAxis: {
min: min,
max: max,
title: {
text: yAxisTitle, //parameter since some are days, percents, etc
style: {//size of y axis title
fontSize: SizeOfFont
}
},
labels: {
style: {//size of the y axis tick labels
fontSize: SizeOfFont
}
}
},
credits: {//gets rid of the highcharts logo in bottom right
enabled: false
},
legend: {//the legend at the bottom
style: {
fontSize: '12px'
}
},
series: [{
type: 'spline',
name: '2012',
data: last,
color: 'orange',
marker: {
symbol: 'diamond'
}
}, {
type: 'spline',
name: '2013',
data: preprocessData(current, last, goal),
marker: {
symbol: 'diamond'
}
}, {
type: 'spline',
name: 'Goal',
data: goal,
color: 'blue',
marker: {
symbol: 'diamond'
}
}]
});
}