JavaScript
var colorSet = ["#369EAD",
"#C24642",
"#7F6084",
"#86B402",
"#A2D1CF",
"#C8B631",
"#6DBCEB",
"#52514E",
"#4F81BC",
"#A064A1",
"#F79647"];
CanvasJS.addColorSet("custom",colorSet);
var newColors = ["#F79647", "#A064A1"];
var chart = new CanvasJS.Chart("chartContainer", {
colorSet: "custom",
title:{
text: "Determining DataPoint's Color"
},
data: [
{
type: "line",
color: newColors[0],
dataPoints: [
{ x: 10, y: 71 },
{ x: 20, y: 55 },
{ x: 30, y: 50 },
{ x: 40, y: 65 },
{ x: 50, y: 95 },
{ x: 60, y: 68 },
{ x: 70, y: 28 },
{ x: 80, y: 34 },
{ x: 90, y: 14 },
{ x: 100, y : 23},
{ x: 110, y : 90},
{ x: 120, y : 39},
{ x: 130, y : 56},
{ x: 140, y : 43}
],
click: function(e){
test(e);
//alert(colorSet[e.dataSeriesIndex]);
},
},
{
type: "line",
dataPoints: [
{ x: 11, y: 71 },
{ x: 21, y: 55 },
{ x: 31, y: 50 },
{ x: 42, y: 65 },
{ x: 53, y: 95 },
{ x: 65, y: 68 },
{ x: 71, y: 28 },
{ x: 82, y: 34 },
{ x: 93, y: 14 },
{ x: 110, y : 23},
{ x: 150, y : 90},
{ x: 110, y : 39},
{ x: 100, y : 56},
{ x: 110, y : 43}
],
click: function(e){
test(e);
//alert(colorSet[e.dataIndex % colorSet.length]);
},
}
]
}
);
chart.render();
function test(e){
debugger;
var x = e.options;
var seriesIndex= e.dataSeriesIndex;
alert(seriesIndex);
// return "purple";
}
function colorTest(){
return "purple";
}