container change bootstrap path svg point zooming

path - change - svg zoom



Renderizado 2D y acercamiento con SVG (3)

Mi tarea es desarrollar un algoritmo que se ajuste a diferentes tipos de curvas en una secuencia de puntos dada en el espacio bidimensional.

Para poder probar mi algoritmo, he elegido SVG para mostrar el resultado. Tengo varios problemas con eso.

Como puede haber entradas y salidas muy diferentes de mi algoritmo, ¡es esencial que pueda ver los archivos SVG generados con la capacidad de acercar!

Pero una ruta en SVG se puede mostrar solo con un cierto ancho. Si hago un acercamiento, entonces el ancho de la ruta se hace más ancho. Me gustaría que el ancho sea, por ejemplo, 1 píxel en todos los niveles de zoom. ¿Existe alguna solucion para esto?

Además: ¿puede SVG mostrar puntos? Sí, puntos simples y crudos. He descubierto que no puede.

Gracias


Muchos otros formatos de vectores (como PostScript y PDF) le permitirán usar un trazo de 0 para un trazo "rayado". No es así con SVG. Sin embargo, creo que puedes lograr lo que deseas si usas un porcentaje de ancho de trazo. Consulte las especificaciones de w3c SVG para obtener detalles , pero, básicamente, debería poder hacer algo como esto:

stroke-width:"1%"

Esto debería acariciar su curva con un ancho de línea que es un 1% constante del rectángulo delimitador, independientemente del nivel de zoom.

En cuanto a los puntos, SVG no los admite. Cuando hice esto en el pasado (usando PostScript) siempre usé un arco con un pequeño redius para dibujar un círculo pequeño (que puedes rellenar para hacer un punto, si lo deseas).

@Zoli: Después de su comentario, estaba a punto de sugerirle que busque en PostScript para poder usar el ancho de trazo de la línea del cabello cuando me encontré con el efecto vector sin trazo de escala en la especificación SVG :

vector-effect="non-scaling-stroke"

Solo agréguele esto a su curva y debería ser invariante para escalar, de acuerdo con la especificación. Su ejemplo usa line , pero también debería funcionar en sus curvas.


Gracias Naaff la ayuda. Creo que me quedaré con Firefox, y especificaré para cada algoritmo-ejecución el ancho de línea en el archivo svg generado. Eso será adecuado para mí.


No hay ningún elemento <point> ni nada parecido en SVG actualmente, pero agregar eso se ha discutido en el SVG WG, por lo que puede incluirse en el futuro. Siéntase libre de expresar sus necesidades y requisitos para un elemento <point> a la lista de correo svg público: [email protected].

Una solución alternativa es usar, por ejemplo, elementos <line> y dejarlos sin longitud, si lo desea, puede tener linecaps redondos para que muestre un punto. Todo depende de para qué necesita esto. Un círculo con r = 0 podría ser un mejor ajuste.

La propiedad ''efecto vector'' con valor ''trazo sin escala'' es lo que debe usar para decir que el trazo no debe escalar. No es tan difícil implementar una solución de javascript que asegure que los trazos se escalen correctamente si el ''efecto vectorial'' no es compatible de forma nativa. Opera 9.5+ lo admite de forma nativa.