php - svg 按需图像

Question

我有 javascript 代码，当有人登陆其中一个页面时，它会动态生成 svg 图像标签。我使用d3 库来帮助制作图像。唯一的问题是 d3 不完全兼容 IE，我想根据 svg 文件生成 .png、jpg、gif 或任何其他图像文件。有没有已知的方法可以做到这一点？服务器端代码是基于 PHP 的，我们使用 node.js 和 render.js 来处理很多动态内容。

Answer 1

我正在使用 ImageMagick 将 SVG 图像转换为 PNG 图像。这工作得很好。

如何执行此操作的快速示例：

exec('/usr/bin/convert /path/to/image.svg /path/to/output_image.png');

我使用它非常成功地处理了用libqrencode制作的不同尺寸和颜色的二维码。

Answer 2

首先，您需要在服务器端使用 DOM 实现，因为您想获得在客户端呈现的 svg。为此，我们将 jsdom 与 node.js 一起使用。使用它，您可以在服务器端渲染 D3 并在服务器上获取 svg，然后将其转换为您喜欢的任何格式。

这是有关如何操作的链接。

一旦你获得了 SVG 和 PNG，然后使用modernizer.js

1) 使用 Modernizr 检查浏览器的兼容性。

2）然后根据兼容性加载SVG或PNG。

示例（JS解决方案）：

if (!Modernizr.svg) {
$("#logo").css("background-image", "url(fallback.png)");
}

示例（CSS 解决方案）：

.no-svg #logo { background-image: url(fallback.png); }