Quote:
I have an Array of objects with 3 elements in each object and this Array is coming from database in JSON format, one of the Array elements is an amount. I have another Array of colors (as shown in the second image) and I want these colors to be assigned automatically based on the amount, I want to assign the darkest color to the highest amount value and then go on until the least value will have the lightest color.. Could you please help me to achieve this.
Quote:
Note: The Array coming from the Database will keep on changing, but the color array will remain the same. I want the darkest color
to the highest amount and lighestest color to the lowest amount.
What I have tried:
var amount = [];
var len = data.length;
var max=0;
var mnth=0;
var min=0;
for (var i = 0; i < len; i++) {
if (data[i].for_month == "APRIL") {
if(data[i].amount>max)
{
max=data[i].amount;
mnth=3;
}
amount.push(data[i].amount);
}
if (data[i].for_month == "AUGUST") {
if(data[i].amount>max)
{
max=data[i].amount;
mnth=7;
}
amount.push(data[i].amount);
}
if (data[i].for_month == "DECEMBER") {
if(data[i].amount>max)
{
max=data[i].amount;
mnth=11;
}
amount.push(data[i].amount);
}
if (data[i].for_month == "FEBURARY") {
if(data[i].amount>max)
{
max=data[i].amount;
mnth=1;
}
amount.push(data[i].amount);
}
if (data[i].for_month == "JANUARY") {
if(data[i].amount>max)
{
max=data[i].amount;
mnth=0;
}
amount.push(data[i].amount);
}
if (data[i].for_month == "JULY") {
if(data[i].amount>max)
{
max=data[i].amount;
mnth=6;
}
amount.push(data[i].amount);
}
if (data[i].for_month == "JUNE") {
if(data[i].amount>max)
{
max=data[i].amount;
mnth=5;
}
amount.push(data[i].amount);
}
if (data[i].for_month == "MARCH") {
if(data[i].amount>max)
{
max=data[i].amount;
mnth=2;
}
amount.push(data[i].amount);
}
if (data[i].for_month == "MAY") {
if(data[i].amount>max)
{
max=data[i].amount;
mnth=4;
}
amount.push(data[i].amount);
}
if (data[i].for_month == "NOVEMBER") {
if(data[i].amount>max)
{
max=data[i].amount;
mnth=10;
}
amount.push(data[i].amount);
}
if (data[i].for_month == "OCTOBER") {
if(data[i].amount>max)
{
max=data[i].amount;
mnth=9;
}
amount.push(data[i].amount);
}
else if (data[i].for_month == "SEPTEMBER") {
if(data[i].amount>max)
{
max=data[i].amount;
mnth=8;
}
amount.push(data[i].amount);
}
}
alert(max);
var bgclr = [clr11 = "#ffffc4",
clr10 = "#fafa92",
clr9 = "#e5e574",
clr8 = "#d1d160",
clr7 = "#c7c74a",
clr6 = "#b5b540",
clr5 = "#a2a236",
clr4 = "#b5b500",
clr3 = "#919117",
clr2 = "#606007",
clr1 = "#333304",
clr0 = "#1d1d02",];
var data5 = {
labels : ["JANUARY", "FEBURARY", "MARCH", "APRIL","MAY","JUNE","JULY","AUGUST","SEPTEMBER","OCTOBER","NOVEMBER","DECEMBER"],
datasets : [
{
label : "Categories",
backgroundColor : bgclr,
data : [amount[4], amount[3], amount[7],amount[0],amount[8], amount[6],amount[5],amount[1], amount[11],amount[10],amount[9],
amount[2]],
}
],
};
var chart5 = new Chart( ctx5, {
type : "pie",
data : data5,
options : options5
});
},
});
});