xxxxxxxxxx
let dataBencana;
let dataRow =[];
colors = ['#1AF24472',
'#1A034C8C',
'#1A048ABF',
'#1A04B2D9',
'#1AF27457',
'#1ABF7381',
'#1AE7E4F2',
'#1ABBBDF2',
'#1A034C8C'];
let x = 200;
let y = 100;
let step = 50;
function preload(){
dataBencana = loadTable('data-bencana-fixed.csv', 'csv', 'header');
}
function setup() {
createCanvas(windowWidth, windowHeight);
textAlign(CENTER);
ellipseMode(CENTER);
background(150);
translate(500, height-100);
let rows = dataBencana.getRows(); /* get all types of data from all rows */
textSize(15);
for (let r = 0; r < rows.length; r++) {
fill(0);
text(rows[r].get(0), x * r, 0); /* get all data on index 0 */
}
/* draw all numbers using a loop */
textSize(10);
for(let j = 1; j < 8; j++){
beginShape();
for(let i = 0; i < rows.length-1; i++){ /* count from index 1 (because zero is Not a Number) */
stroke(colors[j]);
noFill();
vertex(x * i, -rows[i].get(j) - y);
fill(colors[j]);
circle(x * i, -rows[i].get(j) - y, 10);
text(rows[i].get(j), (x * i) - 20, -rows[i].get(j) - y);
noFill();
}
endShape();
}
}