如何在Node.Js中从SVG文件中读取SVG路径字符串

Question

我有一个应用程序，需要从存储在文件系统中的 Node.js svg 文件中解析 svg 路径字符串。 我尝试使用 cheerio 模块获取 svg 路径字符串，但是我只能得到第一个路径字符串。

    const path_to_svg = __dirname + '/documents/' + 'potpis.svg';

    let $;

    fs.readFile(path_to_svg,'utf8',(err,data)=>{
        if(err) console.log(err);
        $ = cheerio.load(data,{ xmlMode : true });
    });

    const svgPath =  $('path').attr('d');

但是我的svg文件有三条路径

为了完成获取整个svg字符串路径的任务，我需要获取整个svg字符串路径。如果有人能够为我提供在Node.Js中解析svg字符串路径的解决方案，我将不胜感激。

- mne_web_dev

---

获取所有元素 https://dev59.com/Gqrka4cB1Zd3GeqPlvM4 并进行迭代。 - Robert Longson

const svgPath = $('path').attr('d'); 首先需要在异步回调内部。 - ggorlen

Answer 1

在获取 $('path') 的值后，可以使用 .each 来获取全部三个。

代码：

const fs = require("fs");
const cheerio = require("cheerio");

const path_to_svg = __dirname + "/documents/" + "potpis.svg";

let $;
const pathStringsArray = [];

fs.readFile(path_to_svg, "utf8", (err, data) => {
  if (err) console.log(err);
  $ = cheerio.load(data, { xmlMode: true });

  const pathSet = $("path");
  pathSet.each(function () {//<------Get all paths here like a 'for each' loop
    const d = $(this).attr("d");//"d" attribute for current path in the loop
    pathStringsArray.push(d);
  });

  //you can now use your array of path strings
  console.log(pathStringsArray);
});

- Tim Affram

---

小问题：我认为xml: true取代了已弃用的xmlMode: true，尽管我目前在文档中找不到它。这个答案的一个重要部分是，所有依赖于文件的代码都在回调函数内部，这是提问者的两个问题之一。 - ggorlen