Javascript 将嵌入式svg转换为图像或画布（目标是关于所选div容器的捕获屏幕）

对不起我的英语

我想用jsPlumb绘制一个图表并导出捕获的图像

Jsplumb在svg中呈现如下：

<svg style="position:absolute;left:457.05px;top:227.65px;z-index:-5;" width="476.9" height="233.7" pointer-events="none" position="absolute" version="1.1" xmlns="http://www.w3.org/1999/xhtml" class="_jsPlumb_connector ent0 ent1 Line"><path d="M 112.95 178.35 L 363.95 55.35" pointer-events="all" version="1.1" xmlns="http://www.w3.org/1999/xhtml" style="" fill="none" stroke="black" stroke-width="5"/><path d="M 112.95 178.35 L 363.95 55.35" pointer-events="all" version="1.1" xmlns="http://www.w3.org/1999/xhtml" style="" fill="none" stroke="blue" stroke-width="3"/></svg>

我想将其转换为画布（我可以使用html2canvas将其转换为图像-我尝试以下方式：）或直接转换为图像。jsPlumb以html而不是文件的形式生成SVG，因此我不能使用svgeezy。我尝试使用canvg，但我不能（糟糕的文档）

我需要一个客户端解决方案或更简单的服务器端解决方案

jsPlumb的示例代码：您只需将div1连接到div2或div3容器以及svg中呈现的连接器元素

---

注意，Zserrbo

如果使用画布模式，连接可以轻松复制到另一个画布

• 制作一个大画布将所有画布连接复制到 正确的地方
• 对于每个div，测量其顶部、左侧、宽度、高度和宽度 获取内部文本
• 在大画布上绘制矩形
• 在矩形内绘制文本
• 将大画布导出到图像

---

我无法对连接使用画布模式（这是：jsPlumb.setRenderMode（jsPlumb.canvas）；），因为画布渲染器将在（下一个）jsPlumb版本1.4.0中删除；在版本1.3.16中，上下文菜单事件（右键单击）不适用于画布渲染器。如果我使用jsPlumb.setRenderMode（jsPlumb.Canvas）方法，那么我可以使用easly html2canvas并导出到图像。我在我的问题中插入了一个谷歌文档链接，我意识到了这一点。