angularjs saveSvgAsPng - getBBox不是一个函数

f87krz0w  于 2022-10-31  发布在  Angular
关注(0)|答案(2)|浏览(220)

我正在使用exupero的saveSvgAsPng库将SVG保存为PNG文件,但在将其与Angular-Nvd 3组合时遇到了一个问题。
我收到一个错误消息:
未捕获的类型错误:el.getBBox不是函数
在我看来,这个函数不能从我的nvd 3元素中“抓取”SVG元素。
我的程式码如下所示:
于飞:

<button onclick = "saveAsPng();" type="button" name="button"></button>

            <div id = "chart1-canvas">
              <nvd3 id = "chart1-svg" options="options1" data="data1"></nvd3>
            </div>

Javascript语言:

function saveAsPng(){
    saveSvgAsPng(document.getElementById("chart1-svg"), "diagram.png");
  }

如有任何关于如何使这项工作正常进行的建议,将不胜感激。

0yg35tkg

0yg35tkg1#

我还没有使用saveSvgAsPng库,但我想它希望您向它传递一个指向SVG元素的指针,而不是它周围的AngularJS元素。
请尝试以下操作:

function saveAsPng() {
   var svg = document.getElementById("chart1-svg").getElementsByTagName("svg")[0];
   saveSvgAsPng(svg, "diagram.png");
}
6ss1mwsb

6ss1mwsb2#

这对我很有效

import saveSvgAsPng from "save-svg-as-png"

let svgDownloadButton = document.getElementsByTagName('button')
svgDownloadButton.addEventListener('click', function () {
    console.log("clicked")
    var svg = document.getElementById("chart1-svg").getElementsByTagName("svg")[0];
    saveSvgAsPng.saveSvgAsPng(svg, "diagram.png");
})

相关问题