Así que estoy tratando de dibujar un polígono usando la función de arco. Sé que hay mejores formas de dibujar un polígono, pero voy a usar esta función para trazar puntos más adelante.
Tengo la forma dibujada sin problemas, sin embargo, la ruta del arco es visible, así que me preguntaba si hay una forma simple de eliminarla de la ruta. He intentado un par de cosas y no he encontrado nada en línea.
De lo contrario, ¿habría alguna forma de almacenar la posición actual antes de dibujar el arco y usar esta posición para crear la línea desde el punto final?
start = 0; inc = 360 / sides; con.strokeStyle = 'rgb(73, 150, 210)'; con.lineWidth = 8; for(i = 1; i <= sides; i++){ end = inc * i; con.beginPath(); con.arc(500, 500, 500, toRadians(start), toRadians(end)); con.closePath(); con.stroke(); start = end; }Editar: alguien recomendó otra publicación sobre transparencia, no veo nada en esa publicación sobre la separación de closePath de la ruta real. Tal vez me perdí algo ya que esa publicación es bastante larga.
¿Qué pasa con este enfoque modificado?
const con = canvas.getContext("2d"); const sides = 10; con.strokeStyle = 'rgb(73, 150, 210)'; con.lineWidth = 1; con.beginPath(); // for loop from i=0 to i = sides+1 // j is the angle we are currently at // use sin & cos aggregate methods to get the positions on 2d grid for (let i = 0, j=2 * Math.PI / sides; i <= sides+1; i++, j = i * 2 * Math.PI / sides) con.lineTo(50 + 50 * Math.cos(j), 50 + 50 * Math.sin(j)); con.stroke(); <canvas id="canvas" width="100px" height="100px"></canvas>