Boa noite, Antonio! Como vai?
É por aí mesmo! Veja o código a seguir:
pincel.beginPath();
pincel.moveTo(300, 200);
pincel.lineTo(200, 400);
pincel.lineTo(400, 400);
pincel.fill();
Repare que na primeira linha a gente começa um trajeto. E, nas três linhas seguidas são definidos 3 pontos com a movimentação do pincel. Sendo que na última a gente pede para o JavaScript preencher a forma definida por nós. Como foram 3 pontos que definimos, isso forma uma triângulo. Se tivéssemos definido 4 pontos então seria um quadrilátero e assim por diante. Portanto, é a quantidade de pontos que vai definir o que vai aparecer!
Experimenta, por exemplo, fazer a seguinte mudança para ver na prática acontecer o que eu falei:
pincel.beginPath();
pincel.moveTo(300, 200);
pincel.lineTo(200, 300);
pincel.lineTo(200, 400);
pincel.lineTo(400, 400);
pincel.fill();
Pegou a ideia? Qualquer coisa é só falar!
Grande abraço e bons estudos!