Cree SVG con texto editable (no delineado) y utilícelo en Canvas HTML5

Creé el mismo archivo SVG en 2 versiones:

1- Texto editable

2- Texto delineado/curvo (NO editable):

Cuando lo importo a mi sitio web HTML5 Canvas...

1- Texto editable - NO carga correctamente (es invisible) https://gyazo.com/35598af5cf1e4ae51157a3d4a11d51de

2- Delineado/curvado (NO editable) carga bien https://gyazo.com/b25c83751af4fb4879ebc18d9e8018df

¿Tal vez necesito cambiar algo en la configuración mientras guardo el SVG de .AI?

Aquí hay enlaces para el archivo SVG: 1- Texto editable 2shared.com/file/Fy2xctLV/fr ... etest.html 2- Texto delineado/curvo (NO editable): 2shared.com/file/6Ez-Z7-7/ fr ... tline.html Y la configuración que usé: gyazo.com/ee212392d1ceb6bc43f914a9f78ec200
Este es un comportamiento normal. Mantenga el archivo editable guardado como uno de trabajo y use su archivo delineado como su archivo final/de visualización. Es una buena práctica delinear siempre las fuentes en un diseño final de AI
Sí, lo sé. Pero necesito que el texto sea editable en la web.
¿Cómo estás dibujando el SVG en el lienzo? ¿No puedes simplemente dibujar el texto en el lienzo en lugar de confiar en SVG?
Es posible, pero tengo miles de diseños .ai y tendría que recrearlos todos dentro de Canvas. ¿Crees que es posible hacerlo desde Illustrator?
¿Cómo estás dibujando el SVG en el lienzo?
Estamos utilizando un marco JS personalizado, puede verificarlo en vivo aquí: tshirtproject.wpengine.com/design

Respuestas (1)

De todos modos, no debería necesitar que el texto sea editable para usarlo en el navegador, la única razón que puedo imaginar para mantener el texto editable es para editarlo. Guarde dos copias, una con texto editable que puede volver a cambiar más tarde si es necesario y otra con el texto descrito para usar en el sitio web.

Necesito que el usuario pueda editar el texto en el navegador
¿Por qué usar un svg para eso?
Porque necesito archivos vectoriales en la web