Como usar MetricCanvas

Paso 1 — Sube tu imagen

Haz clic en el area de subida de la barra lateral o arrastra y suelta una o mas imagenes directamente sobre el lienzo. MetricCanvas soporta multiples imagenes a la vez, cada una colocada en su propia capa sobre el lienzo infinito.

Una vez subidas, puedes desplazarte por el lienzo haciendo clic y arrastrando (o usando la herramienta Pan de la barra), y hacer zoom con la rueda del raton o los botones de zoom. Las imagenes se pueden reposicionar libremente — el lienzo no tiene bordes fijos.

Si trabajas con un escaneo de alta resolucion, haz zoom en el area donde dibujaras tu linea de calibracion antes de calibrar. Cuanto mas preciso sea tu clic de calibracion, mas exactas seran todas las mediciones derivadas.

Paso 2 — Calibra la escala

La calibracion es el paso clave. Selecciona la herramienta Calibrar de la barra, luego haz clic en dos puntos de la imagen que correspondan a una distancia real conocida. Un dialogo te pedira que introduzcas esa distancia y elijas la unidad (metros, centimetros, pies, pulgadas o cualquier unidad personalizada).

Tienes dos modos de calibracion:

• Linea — haz clic en los dos extremos de un segmento recto cuya longitud conozcas. Ideal para paredes, pasillos y elementos lineales.
• Diametro — haz clic en los dos extremos del diametro de un objeto circular. Util para tuberias, columnas o cualquier elemento circular de tamano conocido.

Tras guardar, la escala queda establecida. MetricCanvas usara esta referencia para convertir distancias en pixeles a valores reales para cada medicion posterior sobre esa imagen.

Consejo: Usa la referencia identificable mas larga que encuentres en la imagen. Una linea de referencia de 10 m sera mas precisa que una de 0,5 m, porque los pequenos errores de colocacion del clic tienen un efecto proporcionalmente menor.

Paso 3 — Mide distancias

Selecciona la herramienta Medir y haz clic en dos puntos de la imagen. MetricCanvas dibuja una linea entre ellos, calcula la distancia real basada en tu calibracion y muestra el resultado como una etiqueta directamente sobre el lienzo.

Puedes anadir tantas mediciones como necesites. Cada una se lista en el panel de Medidas de la barra lateral, donde puedes renombrarla con algo descriptivo (por ejemplo, "Ancho cocina" o "Pasillo a puerta dormitorio").

Las etiquetas se pueden reposicionar cambiando a la herramienta Seleccionar y arrastrando. Si necesitas volver a medir algo, simplemente borra la medicion antigua de la barra lateral y dibuja una nueva.

Paso 4 — Gestiona capas

Cada imagen que subes se convierte en una capa separada. El panel de Capas de la barra lateral muestra todas las capas de la sesion actual. Puedes alternar la visibilidad de cada capa y reordenarlas arrastrando.

Las capas son utiles cuando quieres superponer multiples imagenes — por ejemplo, un plano junto a una foto de referencia del mismo espacio — o al comparar diferentes versiones del mismo dibujo.

Paso 5 — Exporta tu trabajo

Cuando termines de medir, el panel de Exportar ofrece tres formatos de salida:

• PNG — exporta todo el lienzo como una imagen anotada a resolucion completa, incluyendo todas las lineas de medicion y etiquetas. Util para compartir con colegas o incluir en informes.
• CSV — exporta todas las mediciones como una tabla compatible con hojas de calculo, con columnas para etiqueta, distancia en pixeles, valor real y unidad. Ideal para importar a Excel, Google Sheets o cualquier flujo de datos.
• TXT — exporta las mediciones como texto plano, una por linea. Util para notas rapidas o pegar en un documento.

Todas las exportaciones se generan enteramente en tu navegador. Nada se sube a ningun servidor.

Deshacer, rehacer y persistencia de sesion

MetricCanvas mantiene un historial completo de deshacer/rehacer durante tu sesion. Usa los botones de Deshacer y Rehacer de la barra o los atajos de teclado estandar (Ctrl+Z / Ctrl+Y en Windows, Cmd+Z / Cmd+Shift+Z en Mac).

Tu sesion se guarda automaticamente en el almacenamiento local del navegador. Si cierras la pestana y vuelves mas tarde, tu lienzo — incluyendo todas las imagenes, calibraciones y mediciones — se restaurara exactamente como lo dejaste.

Para empezar de cero, usa el boton de Reiniciar lienzo. Esto borra todas las capas y mediciones de la sesion actual.

Trabajar con multiples imagenes

Puedes subir varias imagenes en una sesion y mantenerlas organizadas en el mismo lienzo. Cada imagen tiene su propia capa y puede tener su propia calibracion. Esto es util cuando trabajas con imagenes a diferentes escalas — por ejemplo, un plano de emplazamiento y un plano detallado de una unidad.

Las mediciones siempre se dibujan sobre la capa activa. Asegurate de seleccionar la capa correcta antes de medir si tienes multiples imagenes abiertas.

Como funciona la matematica

MetricCanvas usa una proporcion sencilla: una vez que estableces una escala a partir de una referencia conocida, cualquier distancia en pixeles de la imagen puede convertirse a un valor real. La formula principal es:

Donde distancia_pixeles es la distancia euclidiana entre tus dos clics de calibracion:

Cada medicion posterior sigue el mismo patron:

Esto significa que la escala se propaga linealmente: si una pared calibra la imagen, cualquier otra distancia — puertas, ventanas, diagonales — se deriva de la misma proporcion. La herramienta no requiere recalibrar para cada medicion. Una buena referencia desbloquea toda la imagen.

Ejemplo practico: Tienes un plano y sabes que la pared del salon izquierdo mide 4,5 m. Haces clic en ambos extremos de esa pared al calibrar y mides 310 pixeles entre ellos. La escala es 4,5 ÷ 310 ≈ 0,0145 m/px. Si luego mides un pasillo y obtienes 220 pixeles, la longitud real es 220 × 0,0145 ≈ 3,19 m — sin saber nada mas del plano.

El mismo principio se aplica a fotografias. Si conoces un objeto en una foto de habitacion (por ejemplo, una puerta estandar mide 2,1 m de alto), puedes calibrar contra el y luego medir el ancho de una ventana, la longitud de un sofa o la distancia entre dos paredes — todo a partir de una sola foto tomada desde cualquier angulo, siempre que los objetos medidos esten aproximadamente en el mismo plano.

Para la calibracion circular (modo diametro), la formula es identica — MetricCanvas simplemente calcula la distancia entre los dos puntos diametralmente opuestos donde hiciste clic, y luego aplica la misma proporcion. Esto es util para columnas, tuberias, mesas redondas o cualquier referencia circular de diametro conocido.

Ejemplo real: saberlo todo a partir de una pared

Supongamos que has recibido un plano en formato JPEG pero no tiene escala impresa, y solo sabes una cosa: el dormitorio principal mide 3,6 m de ancho. Asi es como derivar cualquier otra medida de la vivienda:

A partir de aqui, MetricCanvas puede decirte: el ancho total del apartamento, la longitud de la cocina, el ancho del pasillo, la distancia de una ventana a una pared, la diagonal de cualquier habitacion. Cada medicion se deriva de la unica referencia de 3,6 m. Puedes exportar la imagen anotada completa o la tabla de datos para compartir con un arquitecto, contratista o cualquiera que necesite las cifras.

Esto funciona porque los planos son proyecciones ortograficas — todas las distancias se dibujan a escala en una vista 2D plana. El mismo principio se aplica a cualquier dibujo proyectado correctamente: planos de emplazamiento, alzados, esquemas electricos, etc.

Consejos para resultados precisos

• Usa la version de mayor resolucion de tu imagen. Mas pixeles entre dos puntos significa menos error de redondeo en la medicion.
• Haz todo el zoom posible al colocar los puntos de calibracion y medicion — un clic desplazado 2 pixeles importa mucho mas a bajo zoom que a alto zoom.
• Elige una referencia de calibracion que sea paralela a la direccion en la que vas a medir mayoritariamente. Una referencia horizontal es ideal para mediciones horizontales.
• Para planos con barra de escala impresa, calibra contra esa barra en lugar de una pared, ya que las barras de escala impresas tienen en cuenta la distorsion del dibujo y la inclinacion del escaneo.
• Si tu imagen es una fotografia tomada en angulo (en lugar de una vista ortografica verdadera), las mediciones solo seran exactas dentro del plano de la superficie fotografiada. La distorsion por perspectiva no puede corregirse sin puntos de referencia adicionales.