Configurar servidor Linux para crear imágenes en base a un path con SVG e ImageMagick para crear áreas llenas de texturas

En ocasiones es necesario generar un SVG con áreas rellenas por texturas desde el lado del servidor. Lo difícil es configurar el servidor para que así sea con ImageMagick más que el propio desarrollo de modificar el SVG y tener las imágenes.

A continuación se incluye los comandos necesarios para un servidor RedHat / CentOS. La versión de ImageMagick es importante, se debe usar una 6.8.x en adelante, aunque también funciona en versiones inferiores como 6.6.x pero es más fácil la instalación en estas versiones. En un servidor Ubuntu debe ser muy similar a excepción de substituir yum install por apt-get install

yum install gcc make ghostscript libpng-devel bzip2-devel djvulibre-devel freetype-devel libjpeg-devel ghostscript-devel libtiff-devel libX11-devel pango-devel libxml2-devel lcms-devel OpenEXR-devel
wget http://www.imagemagick.org/download/ImageMagick-6.8.7-1.tar.gz
tar xvzf ImageMagick-6.8.7-1.tar.gz
cd ImageMagick-6.8.7-1
./configure --enable-delegate-build --enable-shared
make
make install

Debemos estar muy atentos a no usar la librería RSVG. Esta librería aporta entre otras cosas el soporte para este tipo de conversión pero no hemos conseguido hacerla funcionar a través de ella. Si vemos los delegados de ImageMagick que tendremos algo parecido a:

convert -list configure | grep DELEGATES
DELEGATES bzlib djvu mpeg fontconfig freetype jng jpeg lcms openexr pango png ps tiff x xml zlib

También deberemos estar atentos a la versión que estaremos usando de ImageMagick, ya que si ya teníamos instalado ImageMagick, es posible que tengamos la versión antigua y la versión nueva preparada con el soporte para la creación de imágenes en base a un SVG con paths.

convert --version

Por último ponemos un ejemplo del resultado con un SVG. El código fuente es el siguiente:

<?xml version="1.0" encoding="UTF-8"?>
<svg version="1.1"
     baseProfile="full"
     xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink"
     xmlns:ev="http://www.w3.org/2001/xml-events">
    <title>SVG de ejemplo</title>
    <defs>
        <pattern id="img1" patternUnits="userSpaceOnUse" width="600" height="450">
            <image xlink:href="textura.jpg" x="0" y="0" width="600" height="450" />
        </pattern>
    </defs>
    <path d="M150 0 L75 200 L225 200 Z"
          fill="url(#img1)" />
        
</svg>

que tiene forma de triángulo. Un aspecto importante es definir la imagen del patrón de fondo antes que el elemento path, si no podemos tener problemas con ImageMagick.

Una imagen de ejemplo a modo de textura:

Ejecutamos el comando

convert -size 400x400 test.svg test.png

Y la salida en formato PNG es la siguiente:

Usando RSVG e ImageMagick para generar PNGs en base a un SVG

Otra opción parecida a la anterior es utilizar las librerías de RSVG. Tanto utilizándolas junto a ImageMagick como independientes a ellas, se puede conseguir el propósito anterior. La diferencia es la dificultad para ponerlo en marcha y la versión de ImageMagick a usar. En este caso recomendamos la versión 6.6.8.x, ya que en caso contrario no lo hemos conseguido hacer funcionar.

yum install librsvg2-dev
yum install libxml2-dev
wget http://download.savannah.gnu.org/releases/freetype/freetype-2.5.3.tar.gz
tar -xzf freetype-2.5.3.tar.gz
cd freetype-2.5.3
./configure
make
make install
cd ..
wget http://www.ijg.org/files/jpegsrc.v9a.tar.gz
tar -xzf jpegsrc.v9a.tar.gz
cd jpegsrc.v9a
./configure
make
make install
cd ..
wget ftp://ftp.sunet.se/pub/multimedia/graphics/ImageMagick/ImageMagick-6.6.8-10.tar.gz
tar -xzf ImageMagick-6.6.8-10.tar.gz
cd ImageMagick-6.6.8-10
./configure --with-rsvg=yes
make
make install

Una vez instalado y si todo ha funcionado bien, el proceso de conversión de imágenes es el mismo que en el anterior.

Fuentes

Comentarios

Sin comentarios
Ha habido un error en el envío
Comentario enviado. Será revisado por la moderación antes de ser publicado.

Deja tu comentario

Tu nombre:
Tu email:
Tu comentario:
Nuestra página web utiliza cookies propias y de terceros, para realizar el análisis de la navegación de los usuarios y así poder mejorar nuestros servicios. Si continúas navegando, consideramos que aceptas su uso. Puedes cambiar la configuración u obtener más información aquí