vector - mapa - Forma personalizada de Photoshop para la cadena de ruta SVG

svg map generator

Question

¿Hay alguna forma de quitar la cadena de ruta SVG de una forma o ruta personalizada de Photoshop? ¿O hay otra forma de obtener / construir datos similares? Estoy buscando hacer algo similar a esto:

http://raphaeljs.com/icons/

Answer 1

1. Seleccione y copie la ruta en Photoshop
2. Lanzar Adobe Illustrator
3. Crea un nuevo documento
4. Pegar
5. Guardar como SVG

Sin embargo, si tiene Illustrator y no ha creado todas las rutas, probablemente sea más fácil crearlas directamente en Illustrator.

Si no tiene Illustrator, probablemente sea mejor que use el editor gratuito SVG de Inkscape para dibujar sus rutas.

Si ya tiene las rutas en Photoshop y no tiene Illustrator, lo mejor que puedo pensar es activar la paleta de información en Photoshop. Seleccione los puntos de la ruta uno a la vez y registre manualmente las posiciones del punto también. como sus manejadores, y de los que crean manualmente la ruta usando la curva absoluta para los comandos, ''C'' (para los puntos con controladores) y lineto absoluto para los comandos, ''L'' para los puntos que no tienen controladores.

Answer 2

Otra opción es guardar el archivo como EPS en photoshop asegurándose de tener vectores de exportación marcados, y luego cargar eso en illustrator y guardar como SVG

Answer 3

Para formas personalizadas, es posible que desee echar un vistazo a la secuencia de comandos de código abierto recientemente lanzada llamada Convertir archivo de formas personalizadas a SVG (para Photoshop CS3 o posterior), utilizada para convertir un archivo de formas personalizado (.csh) o una forma personalizada archivo de preferencias (CustomShapes.psp) en un conjunto de archivos SVG.

Answer 4

Todas las respuestas fueron buenas, pero para mí fueron demasiado, hay una herramienta en línea proporcionada por Adobe:

http://adobe.com/go/extract_tryitnow_en

Todo lo que tienes que hacer es cargar / arrastrar y soltar / tu archivo .psd, elegir la capa de ruta y descargarla como svg. Y puedes extraer la ruta svg, atributo d en particular.

Entonces lo que hice fue poner el path en un elemento g , luego escalar g y traduje el path

Answer 5

Actualización: en versiones recientes de Photoshop, hay una opción incorporada para exportar la imagen como SVG, que funciona bien en rutas y formas personalizadas. Solo haz:

Archivo -> Exportar -> Exportar como ... y seleccione SVG en la configuración del archivo.

Respuesta Original:

A partir de Photoshop CC 14.2, puede crear archivos SVG directamente desde Photoshop:

1. Cree un archivo llamado generator.json con el contenido siguiente en su carpeta de inicio del usuario.
2. Reinicie Photoshop y abra su archivo PSD.
3. Activar el generador: Archivo> Generar> Activos de imagen.
4. Cambie el nombre de su capa a <something>.svg .
5. El archivo svg se creará en el directorio de activos junto a su archivo PSD.

Contenido para generator.json:

{
    "generator-assets":  { 
        "svg-enabled": true
    }
}

Fuente: http://creativedroplets.com/generate-svg-with-photoshop-cc-beta/