在 ObservableHQ.com 上使用 d3.js 在图表中保存包含图像的高分辨率 PNG

Question

使用 D3.js 创建图表时，我可以使用以下方法包含外部图像：

svg.append("svg:image").attr("x", 100).attr("y", 100).attr(
"xlink:href",
"https://my-url.com/image.svg"
);

但是当我尝试使用 this code 的修改版本（为了高分辨率）将图表另存为 PNG 格式时，图像没有显示在 PNG 格式中。

我做了一个test notebook here，你可以自己试试。

我一直在尝试以不同的方式获取图像并将其转换为 svg 节点，但无法成功正确解析结果。欢迎任何帮助，谢谢。

Answer 1

这有点 hacky，但它可能适合您：https://observablehq.com/@shan/save-high-resolution-png-with-imported-image