d :
{"children":[{"name":"China","children":[{"name":"China","value":400,"percentage":"33.33"}],"index":0},{"name":"England","children":[{"name":"England","value":300,"percentage":"33.33"}],"index":1},{"name":"Malaysia","children":[{"name":"Malaysia","value":500,"percentage":"25.00"}],"index":2},{"name":"South Korea","children":[{"name":"South Korea","value":600,"percentage":"50.00"}],"index":3}]}
Array of object
cfg.thresholdSetting.thresholds = [{"dType":"threshold","from":0,"to":30,"color":"rgb(217, 20 ,39)"},{"dType":"threshold","from":30,"to":70,"color":"rgb(242, 145, 10)"},{"dType":"threshold","from":70,"to":120,"color":"rgb(33, 145, 49)"}]
Following that, there is a property :
rect.style("fill", function (d, i) {
for (var k = 0; k < fromValues.length; k++) {
console.log("percentage : " + d.percentage)
console.log("from value : " + fromValues[k])
console.log("to value : " + toValues[k])
if (d.percentage >= fromValues[k] && d.percentage <= toValues[k]) {
return cfg.thresholdSetting.thresholds[k].color;
}
else {
return "#808080";
}
}
})
However, the output for the 'from' and 'to' values remains unchanged. How can I efficiently compare these values given that the outer loop iteration is dependent on the data present?
Current Output
https://i.sstatic.net/T7gYi.png
Expected Output
d.percentage = 33.33
from value = 0
to value = 30
d.percentage = 33.33
from value = 30
to value = 70
d.percentage = 33.33
from value = 70
to value = 120
d.percentage = 50.00
from value = 0
to value = 30
d.percentage = 50.00
from value = 30
to value = 70
d.percentage = 50.00
from value = 70
to value = 120