<metta charset="utf-8">
<canvas width = "600" height = "400"></canvas>
<script>
var screen = document.querySelector("canvas");
var paint = screen.getContext('2d');
paint.fillstroke = 'black'
function draw(x, y, z, k, color) {
paint.fillStyle = color;
paint.fillRect(x, y, z, k);
}
function border(x, y, z, k) {
paint.fillStroke = 'black';
paint.strokeRect(x, y, z, k);
}
var porc = [0, 0, 0, 0];
for(var i = 0; i < 4; i++){
porc[i] = prompt("qual a porcentagem de usuarios no navegador " + (i + 1));
}
var x = 0;
var z = 50;
var y = 0;
for (var j = 0; j < 4; j++) {
var k = porc[j];
if (j == 0) {
var color = 'blue';
}
if (j == 1) {
var color = 'green';
}
if (j == 2) {
var color = 'yellow';
}
if (j == 3) {
var color = 'red';
}
draw(x, y, z, k, color);
border(x, y, z, k);
y = y + porc[j];
}
border(0, 0, 50, 100);
</script>
Não consigo identificar o problema deste código, ele roda e desenha os dois primeiros valores no gráfico, mas não os outros.