[Vuejs]-Loading External SVG file into SVGJS (Duplicate SVG Tag)

by

2👍

You create an SVG and then add an SVG to it again (from your imported data)

You should just add your imported SVG directly to your Div:

  data() {
  return {
    svgFile:     require("../assets/cassete.svg")
  };
},
 importSVG() {
    fetch(this.svgFile)
      .then(res => res.text())
      .then(svg => {
        var tempEl = this.$refs.drawing;
        var draw = svg //this.$SVG()
          .addTo(tempEl)
          .size('100%', '100%');

      //draw.svg(svg);
      console.log(svg);


      var parser = new DOMParser();
      var xmlDoc = parser.parseFromString(svg, "application/xml");
      console.log(xmlDoc);
    });
}
👤Alex L

2👍

    importSVG() {
      fetch(this.svgFile)
        .then(res => res.text())
        .then(svg => {
          var tempEl = this.$refs.drawing;

          var draw = this.$SVG(tempEl);
          draw.svg(svg);
        });
    }

As @Alex L said “You should just add your imported SVG directly to your Div”

👤Fanna1119

Leave a comment