es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Parse múltiples atributos hijos de un elemento utilizando cheerio en NodeJs.

12 Jul, 2023 Programación

Tengo un archivo svg que se ve así

<svg version="1.0" xmlns="http://www.w3.org/2000/svg" width="300.000000pt" height="226.000000pt" viewbox="0 0 300.000000 226.000000" preserveaspectratio="xMidYMid meet">

<g transform="translate(0.000000,226.000000) scale(0.100000,-0.100000)" fill="#000000" stroke="none">

<path d="M891 2162 c-95 -33 -418 -606 -616 -1092 -75 -185 -106 -330 -70 -67 -2 3 7 36 19 75 13 
27 67 2 -3 -7 -36 -19 75z"></path>

<path d="M1316 2019 c-33 -39 -8035 -57 -37 -58 -82 -59 -25 0 -55 -2 -66 -4 -11 -2 -58 -8 -104 
-15 -158 -22 -330 -77 -315 -101 10 -17 85 -5 311 51 -12 -15 -27z"></path>

<path d="M925 1349 c-4 -6 -5 -12 -2 -15 2 -3 7 2 10 11 7 17 1 20 -8 4z"></path>

</g>
</svg>

Quiero obtener el atributo d de cada elemento de ruta (path) y combinarlos en una sola cadena de ruta svg (que consta de las tres rutas).
He intentado esto, pero solo obtengo el primero cada vez.

fs.readFile(path_to_svg, 'utf8', (err, data)=>{
        if(err) console.log(err);
        $ = cheerio.load(data, { xmlMode: true });
        $('svg').children().each(function(i, path) {
            console.log($('path').attr('d'))
        });
    });
Tags:  ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para obtener el atributo d de cada elemento de trazado y combinarlos en una cadena de trazado SVG, puedes modificar tu código de la siguiente manera:

    fs.readFile(ruta_al_svg, 'utf8', (err, data) => {
  if (err) console.log(err);
  const $ = cheerio.load(data, { xmlMode: true });
  const paths = $('svg').find('path'); // seleccionar todos los elementos de trazado dentro de svg
  let pathString = ''; // inicializar una cadena vacía para combinar todos los atributos d
  paths.each(function (i, path) {
    pathString += $(this).attr('d'); // anexar el atributo d de cada elemento de trazado
  });
  console.log(pathString); // mostrar la cadena de trazado SVG combinada
});

    En el código modificado, primero seleccionamos todos los elementos path dentro del elemento svg usando el método find. Luego usamos el método each para recorrer todos los elementos de trazado y agregar su atributo d a la variable pathString. Por último, mostramos la cadena de trazado SVG combinada usando console.log.

Comments are closed.