Puntos de Fuga Web (English version below)

Permite crear un grid de perspectiva con hasta tres puntos de fuga para utilizarlo como referencia en dibujo.

Pruébalo aquí -> https://enaraartetxe.github.io/web-vanishing-points/

Características

• Compatible con ordenador y tablets.
• Compatible sin optimizar para teléfonos móviles o tablets en posición vetical (retrato).
• Permite utilizar una imagen de fondo como guía.
• Edición de los PF creados (mover, añadir/quitar líneas).
• Opción de alinear el horizonte.
• Descarga del grid resultante con tamaño de 2048px.
• Opciones rápidas de teclado y gestos para ordenador/tablet.
• Opción para diestros/zurdos.
• Disponible en inglés y castellano, dependiendo del idioma del navegador.

Web Vanishing Points

It allows you to create a perspective grid with up to three vanishing points to use as a reference on your drawings.

Try it here -> https://enaraartetxe.github.io/web-vanishing-points/

Features

• Compatible with computers and tablets.
• Compatible without optimization with mobile phones and tablets in portrait mode.
• It allows you to use a background image as a guide.
• Edition of the created VP (move, add/remove lines).
• Option to align the horizon.
• Download of the grid with 2048px size.
• Quick options for both computer (keyboard shortcuts) and tabelt (gestures).
• Option for right & left-handed.
• Available in Spanish and English, depending on the browser language.

---

A special shoutout to Nineberry & Blindman67 for their answer on how to use the inverse matrix to apply translation and scale on the canvas here -> https://stackoverflow.com/questions/34597160/html-canvas-mouse-position-after-scale-and-translate/34598847#34598847

and to Chengarda for the base code to zoom and pan -> https://codepen.io/chengarda/pen/wRxoyB?editors=1111