Foros del Web » Creando para Internet » Diseño web »

[SOLUCIONADO] Insertando un SVG en PHP

 Estas en el tema de Insertando un SVG en PHP en el foro de Diseño web en Foros del Web. Saludos cordiales, chicos tengo el siguiente caso espero que puedan ayudarme: Poseo un archivo PHP donde tengo incluido una etiqueta SVG Parte de la etiqueta ...
  #1 (permalink)  
Antiguo 02/02/2017, 22:30
(Desactivado)
  
Fecha de Ingreso: septiembre-2008
Ubicación: Maracay edo Aragua Venezuela
Mensajes: 48
Antigüedad: 16 años, 3 meses
Puntos: 3
Pregunta Insertando un SVG en PHP
Saludos cordiales,
chicos tengo el siguiente caso espero que puedan ayudarme:

Poseo un archivo PHP donde tengo incluido una etiqueta SVG

Parte de la etiqueta SVG es:

Código PHP:
    <g
       id="g4125">
      <rect
         ry="10.606602"
         rx="10.859617"
         y="243.71503"
         x="51.147934"
         height="61.284992"
         width="693.70422"
         id="rect4610"
         style="fill:#ffffff;fill-opacity:1;stroke:none;opacity:1" />
      <text
         sodipodi:linespacing="125%"
         id="NOMBRE PARTICIPANTE"
         y="282.4874"
         x="149.45268"
         style="font-size:27.87268639px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
         xml:space="preserve"><tspan
           style="font-size:30px;font-weight:bold;-inkscape-font-specification:Sans Bold"
           y="282.4874"
           x="149.45268"
           id="tspan4614"
           sodipodi:role="line">PEDRO JOSE PEREZ MIRANDA</tspan></text>
    </g> 
Y he hecho esto:

Código PHP:
    <g
       id="g4125">
      <rect
         ry="10.606602"
         rx="10.859617"
         y="243.71503"
         x="51.147934"
         height="61.284992"
         width="693.70422"
         id="rect4610"
         style="fill:#ffffff;fill-opacity:1;stroke:none;opacity:1" />
      <text
         sodipodi:linespacing="125%"
         id="NOMBRE PARTICIPANTE"
         y="282.4874"
         x="149.45268"
         style="font-size:27.87268639px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans"
         xml:space="preserve"><tspan
           style="font-size:30px;font-weight:bold;-inkscape-font-specification:Sans Bold"
           y="282.4874"
           x="149.45268"
           id="tspan4614"
           sodipodi:role="line"><?PHP echo $nombre; ?></tspan></text>
    </g>
Pero cuando la variable cambia tambien lo hace la alineacion horizontal del texto.

Mi consulta es, saber si existe la posibilidad de que el nombre que adquiera la variable $nombre la posicion horizontal del SVG se mantenga centrado, no se como tratar el texto como un parrafo, o si alguien tiene una mejor idea estare atento.

Muchas Gracias de Antemano.
  #2 (permalink)  
Antiguo 03/02/2017, 00:49
Avatar de caricatos
Moderador
  
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años, 8 meses
Puntos: 1284
Respuesta: Insertando un SVG en PHP
Hola:

No entiendo el anidamiento de un tspan dentro de un text... seguramente ha sido idea del editor (supongo que inkscape)...

El atributo text-anchor con el valor middle suele usarse para centrar el texto.

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
Última edición por caricatos; 15/03/2017 a las 00:24 Razón: ortografía
  #3 (permalink)  
Antiguo 03/02/2017, 17:48
(Desactivado)
  
Fecha de Ingreso: septiembre-2008
Ubicación: Maracay edo Aragua Venezuela
Mensajes: 48
Antigüedad: 16 años, 3 meses
Puntos: 3
Pregunta Respuesta: Insertando un SVG en PHP
Saludos, logre como tratar a los textos en Inkscape como párrafos ahora no importa el largo del texto este siempre estará centrado, pero, el GRAN PERO.. ahora no muestra el texto en la salida del PHP

Hice una imagen que consiste en un rectángulo color amarillo con un texto color negro que esta sobre el rectangulo con la palabra NOMBRE DE PRUEBA de color negro, esto lo hice para simplificar el codigo buscando la solucion a mi conflicto.


Código HTML: 
Ver original
  1. <html lang="es">
  2. <head>
  3.     <title>CERTIFICADO</title>
  4.     <meta http-equiv="content-type" content="text/html; charset=UTF-8" >
  5.     <link rel="stylesheet" type="text/css" href="../../../../admin/config/css/estilos_certificado.css">
  6. </head>
  7. <body>
  8. <?xml version="1.0" encoding="UTF-8" standalone="no"?>
  9. <!-- Created with Inkscape (http://www.inkscape.org/) -->
  10.  
  11. <svg
  12.    xmlns:dc="http://purl.org/dc/elements/1.1/"
  13.    xmlns:cc="http://creativecommons.org/ns#"
  14.    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
  15.    xmlns:svg="http://www.w3.org/2000/svg"
  16.    xmlns="http://www.w3.org/2000/svg"
  17.    xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
  18.    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
  19.    width="210mm"
  20.    height="297mm"
  21.    id="svg3370"
  22.    version="1.1"
  23.    inkscape:version="0.48.5 r10040"
  24.    sodipodi:docname="dibujo.svg">
  25.   <defs
  26.      id="defs3372" />
  27.   <sodipodi:namedview
  28.      id="base"
  29.      pagecolor="#ffffff"
  30.      bordercolor="#666666"
  31.      borderopacity="1.0"
  32.      inkscape:pageopacity="0.0"
  33.      inkscape:pageshadow="2"
  34.      inkscape:zoom="0.7"
  35.      inkscape:cx="227.34766"
  36.      inkscape:cy="724.82534"
  37.      inkscape:document-units="px"
  38.      inkscape:current-layer="layer1"
  39.      showgrid="false"
  40.      inkscape:window-width="1024"
  41.      inkscape:window-height="715"
  42.      inkscape:window-x="0"
  43.      inkscape:window-y="31"
  44.      inkscape:window-maximized="1" />
  45.   <metadata
  46.      id="metadata3375">
  47.     <rdf:RDF>
  48.       <cc:Work
  49.          rdf:about="">
  50.         <dc:format>image/svg+xml</dc:format>
  51.         <dc:type
  52.            rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
  53.         <dc:title></dc:title>
  54.       </cc:Work>
  55.     </rdf:RDF>
  56.   </metadata>
  57.   <g
  58.      inkscape:label="Capa 1"
  59.      inkscape:groupmode="layer"
  60.      id="layer1">
  61.     <rect
  62.        style="opacity:1;fill:#ffff00;fill-opacity:1;stroke:none"
  63.        id="rect3378"
  64.        width="474.28571"
  65.        height="194.28572"
  66.        x="128.57144"
  67.        y="89.505035"
  68.        rx="10.859617"
  69.        ry="10.606602" />
  70.   </g>
  71.   <flowRoot
  72.      xml:space="preserve"
  73.      id="flowRoot3380"
  74.      style="font-size:40px;font-style:normal;font-weight:normal;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;font-family:Sans;text-anchor:middle;text-align:center"
  75.      transform="translate(-20,0)"><flowRegion
  76.        id="flowRegion3382"><rect
  77.          id="rect3384"
  78.          width="441.43668"
  79.          height="67.680222"
  80.          x="162.63457"
  81.          y="161.40764"
  82.          style="text-anchor:middle;text-align:center" /></flowRegion><flowPara
  83.        id="flowPara3386">NOMBRE DE PRUEBA</flowPara></flowRoot></svg>
  84. </body>
  85. </html>

Utilizando el ejemplo no se imprime la palabra NOMBRE DE PRUEBA pero en la imagen SVG desde Inkscape si se ve la palabra

He utilizado una sola capa sin transparencias ni efectos de ningun tipo y el texto esta arriba en el diseño esta sobre el rectángulo que es color amarillo.
  #4 (permalink)  
Antiguo 04/02/2017, 01:32
Avatar de caricatos
Moderador
  
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años, 8 meses
Puntos: 1284
Respuesta: Insertando un SVG en PHP
Hola:

Tal vez te interese no usar el editor porque añade mucho código innecesario...

Si solo quieres el texto centrado en un A4... el código podría ser:

Código: 
<svg xmlns='http://www.w3.org/2000/svg' width='210mm' height='297mm' x='0' y='0'>
	<rect x="0" y="0" width="210mm" height="297mm" stroke="pink" fill="transparent"/>
	<text x='105mm' y='148.5mm' style='font: bold 36px arial; dominant-baseline: middle; fill: red; text-anchor: middle;' >
		pepemolina.com
	</text>
</svg>
En mi página puedes encontrar muchos ejemplos.

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
Última edición por caricatos; 03/04/2017 a las 15:34 Razón: ortografía
  #5 (permalink)  
Antiguo 05/02/2017, 00:04
(Desactivado)
  
Fecha de Ingreso: septiembre-2008
Ubicación: Maracay edo Aragua Venezuela
Mensajes: 48
Antigüedad: 16 años, 3 meses
Puntos: 3
Respuesta: Insertando un SVG en PHP
He limpiado el código y ahora funciona perfectamente..! ahora trabajo en insertar un codigo QR sobre el SVG estoy buscando información sobre ello. marcare como solucionado y si no logro encontrar información abriré otro post. Gracias por sus amables respuestas.

Etiquetas: inkscape, php, svg
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 23:01.