Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

É estranho mas meu canvas fica apenas com 600 , 150

Faço shit+crtl+C e percebo lá que o canvas fica 600 150 ??? Why?? O triângulo nem aparece. Onde estou a errar?

<body>
    <canvas width="600" heidth="400"></canvas>
    <script>
        var tela = document.querySelector("canvas");
        var pincel = tela.getContext("2d");

        pincel.fillStyle = "lightgrey";
        pincel.fillRect(0, 0, 600, 400);

        pincel.fillStyle = "green";
        pincel.fillRect(0, 0, 200, 400);

        pincel.fillStyle = "red";
        pincel.fillRect(400, 0, 200, 400);

        pincel.fillStyle = "yellow";
        pincel.beginPath();
        pincel.moveTo(300, 200);
        pincel.lineTo(200, 400);
        pincel.lineTo(200, 400);
        pincel.fill();
    </script>
</body>
3 respostas

Oi Eliezer,

O problema é que você escreveu a altura do canvas errado.

Altere para:

Oi Eliezer,

<body>
    <canvas width="600" height="400"></canvas>

    <script>
        var tela = document.querySelector("canvas");
        var pincel = tela.getContext("2d");

        pincel.fillStyle = "lightgrey";
        pincel.fillRect(0, 0, 600, 400);

        pincel.fillStyle = "green";
        pincel.fillRect(0, 0, 200, 400);

        pincel.fillStyle = "red";
        pincel.fillRect(400, 0, 200, 400);

        pincel.fillStyle = "yellow";
        pincel.beginPath();
        pincel.moveTo(300, 200);
        pincel.lineTo(200, 400);
        pincel.lineTo(200, 400);
        pincel.fill();
    </script>
</body

Altere para:

solução!

Parece que ao fim tinha de retirar a tag