canvas - 有没有办法将画布元素作为图像添加到 svg

Question

我在这里有一个jsfiddle：

http://jsfiddle.net/Gt7wQ/

我想要做的是添加我刚刚绘制到我的 svg 板上的临时画布元素。那可能吗？

我现在想做的是：

svg.append("image")
    .attr("xlink:href", temp_canvas)
    .attr("x", 0)
    .attr("y", 0);

谢谢

Answer 1

使用toDataURL()画布元素上的data-uri.

还要为 d3 svg 指定宽度和高度属性：

svg.append("image")
    .attr("xlink:href", temp_canvas.toDataURL())
    .attr("x", 0)
    .attr("y", 0)
    .attr("width", 300)
    .attr("height", 300);

UPDATED FIDDLE

请注意，如果画布上的内容来自您的页面以外的其他来源（即绘制到画布上的图像来自不同的域），则这将不起作用。