Canvas 画布将SVG转换为PNG不'；我买不到全尺寸的

我有大约200个大SVG图像（公司组织结构图>50个部门）。示例信息如下：

SVGRect {height: 270, width: 1600, y: 0, x: -150}

我想导出的图像大小取决于SVG的大小。这是我导出时的代码

export_svg: function () {
            var html = d3.select("svg")
                .attr("version", '1.1')
                .attr("xmlns", "http://www.w3.org/2000/svg")
                .node().parentNode.innerHTML
            var imgsrc = 'data:image/svg+xml;base64,' + btoa(html)

            var canvas = document.querySelector("canvas"),
                context = canvas.getContext("2d")
            // clear cache previous
            canvas.width = $('svg')[0].getBBox().width
            canvas.height = $('svg')[0].getBBox().height
            context.clearRect(0, 0, canvas.width, canvas.height);
            var image = new Image
            image.src = imgsrc
            context.drawImage(image, 0, 0)
            var canvasdata = canvas.toDataURL("image/png", 1)

            d3.select("#export_svg").attr('href', canvasdata)
            d3.select("#export_svg").attr('download', 'Org Chart.png')


        },

SVG的协调器与此相关吗

当我导出到PNG时，它无法获得组织结构图的完整大小

---

您可能需要更改上下文；到context.drawImage（image，0，0，canvas.width，canvas.height）；）

您正在使用调用

元素上的

getBBox（）

返回的宽度和高度。这不一定与渲染SVG的宽度和高度相同。这两个坐标系不一定具有相同的比例。即使是这样，您也需要考虑BBox的

x

和

y

组件。忽略坐标，只获取svg并转换为画布怎么样？有可能吗？没有。你需要把它渲染到画布上。尝试将SVG宽度和高度设置为与画布相同的大小。