estoy usando FabricJS y me surge algún problema con la pantalla de mi SVG en el lienzo:Problema con pantalla SVG/renderizado en Fabric.js
- el resultado se muestra fuera de la caja de selección de fabricJS (debido a una traducción?)
- los anclajes de la selección desaparecen después de una transformación y luego es imposible encontrarlos de nuevo.
Aquí está una captura de pantalla:
estoy usando un SVG salida del Potrace y yo creo que es el origen de mi problema.
Aquí está el código del SVG: SVG code in pastebin
Puede probarlo con FabricJS en esta página: FabricJS Kitchensing example.
Simplemente pegue el código del SVG en el área "Cargar SVG", luego cambie el tamaño y gire el cuadro de sección para mostrar el SVG.
¿Conoces la parte de mi código SVG o la parte del código fabricjS que causa el problema? Si es así, ¿puedo cambiarlo fácilmente por mi cuenta? Si no, ¿es posible que alguien corrija o localice el posible error?
Muchas gracias por su ayuda.
EDIT: aparentemente, FabricJS no le gusta esta línea de la SVG:
<g transform="translate(0,648) scale(0.098780,-0.098780)" fill="#000000" stroke="none">
y más especialmente los traducen y atributos escala ... ¿Cómo solucionarlo?
EDIT2: la solución sería que la traducción y la escala son respectivamente igual a (0,0) y (1,1) o, mejor, que se aplican a las coordenadas.
¿Alguien tiene una idea para hacer eso con la secuencia de comandos Potrace o JS?
Encontré la solución gracias al optimizador SVG de Peter Collingridge: http://petercollingridge.appspot.com/ ¡Aplica todas las transformadas g de un archivo SVG! – Zorkzyd
si encontraste una solución, puedes convertir esto en una pregunta auto-respondida. –
@Zorkzyd, los pls responden, también me enfrento al mismo problema al que se enfrenta ... ¿Puedo ayudarlo a salir de este problema? – kuldipem