Tengo un archivo SVG con viewBox = "- 155.7 -99 510 510". Creo que esto compensó los caminos en la vista previa de Mac OS X en -155.7 -99. Cuando abro el SVG en Illustrator, las rutas no están compensadas en absoluto. ¿Cómo exporto este svg de modo que:
- viewBox = "0 0 510 510"
- y todas las rutas han agregado un conjunto de -155.7 -99
He intentado cambiar la posición de la mesa de trabajo, pero el origen de viewbox nunca es 0,0.
adobe-illustrator
svg
usuario1109371
fuente
fuente
Me he encontrado con este problema varias veces, y lo único que me ha funcionado para restablecer de manera confiable el cuadro de vista SVG a exactamente 0, 0 al exportar desde Illustrator es crear un nuevo documento en blanco y copiar y pegar la ilustración en él .
La esquina superior izquierda de esta mesa de trabajo predeterminada intacta se exportará como punto 0, 0 del cuadro de vista. Utilice las guías inteligentes (
cmd-u) o elalignconjunto de ventanas enAlign to Artboardsi necesita que su ilustración comience exactamente en 0, 0.Puede cambiar el tamaño de la mesa de trabajo de forma segura desde la esquina inferior derecha, pero las cosas comienzan a salir mal si mueve la esquina superior izquierda. Mover la esquina superior izquierda de las mesas de trabajo o importar archivos SVG a AI parece causar algún tipo de desconexión interna extraña entre las reglas, las mesas de trabajo y algún tipo de punto de origen de vista secreto invisible conocido solo por Illustrator.
AFAICT, como con la mayoría de las cosas que tienen que ver con la tecnología web o emergente, el enfoque de Adobe para SVG ha sido juntar algo groseramente para que puedan jactarse de ello en un comunicado de prensa, luego dejarlo con errores, sin terminar y sin amor, pretendiendo que no existir y continuar como si fuera 1998.
fuente
viewboxmodificación en la exportación a SVG. Tiene toda la razón al crear un nuevo documento y copiar todas las ilustraciones. Su respuesta debe marcarse como correcta +1.Preserve Illustrator Editing Capabilitiesla primera vez que guardo por si necesito hacer más ajustes y luego, después de pensar que todo está bastante bien, lo guardo sin él (el aumento en el tamaño del archivo es bastante significativo, por lo que querrá hacer esto)Sé que esto es muy tarde para el tema, pero tuve el mismo problema e hice lo siguiente.
Espero que esto ayude a alguien más.
fuente
width="<W>" height="<H>"su editor de texto favorito a la etiqueta SVG también ayuda (dónde<W>y<H>serían los números decimales).Tuve un problema muy similar porque mi SVG creado por AI no estaba centrado y expandido a la ventana completa del navegador, porque AI cambia constantemente el tamaño de la mesa de trabajo y olvida el centrado.
La única forma de solucionarlo es tener un paso final de procesamiento manual en Inkscape.
Finalmente, debe guardar el SVG nuevamente, pero use el formato "SVG optimizado" en el cuadro de diálogo Guardar como. Habrá un cuadro de diálogo para las opciones de SVG y deberá habilitar "Habilitar viewboxing".
Como todos mis SVG son iconos del mismo tamaño, este paso de procesamiento solo lleva 1 minuto, ya que siempre tengo el mismo lienzo y el mismo tamaño de objeto. Pero sí, es una lástima que este paso sea necesario y se debe solucionar en la IA.
fuente
He resuelto esto. ¡Finalmente! Hay una manera simple de hacer esto. Al igual que:
El problema era cuando exportaba una imagen desde Illustrator (como muchos lo hacen) la mesa de trabajo no se incluye en el SVG exportado. Los caminos no tienen nada en lo que basar sus cálculos.
En mi caso, la altura máxima para mis imágenes era
100pxy necesitaba basar los estilos CSS para estas imágenes en función de su ancho y altura. En CSS usovwunidades, o simplemente viejas100%si el SVG es para llenar el espacio de bloque. Esto escala muy bien. De esa manera, no tendrá que preocuparse por configurar el ancho y la altura en CSS para asegurarse de que se muestre correctamente.Revisé cada logotipo y establecí la altura en
100pxy dejé que el ancho se calculara automáticamente según la relación de aspecto. Luego ajusto la mesa de trabajo al logotipo para eliminar cualquier espacio no utilizado.Seleccioné un rectángulo y activé el relleno y el trazo y me aseguré de que fuera exactamente del mismo tamaño que la mesa de trabajo. Coloque este objeto en blanco en la parte posterior. Ahora, cuando exporte la ruta, tendrá una base para trabajar los cálculos.
Para hacer esto en el código, parece que puede ajustar las rutas en ay
rectestablecer su ancho y alto, y luego puede establecerviewBoxlo mismo (mantener las relaciones de aspecto iguales). Como se muestra en el ejemplo anterior. En realidad no he probado esto, pero lo probaré y actualizaré.fuente
Pude solucionarlo usando Inkscape . Parece que Illustrator tiene poca compatibilidad con archivos SVG.
fuente