0

所以我想出了如何使用 d3 创建 SVG 图表，并将它们整齐地显示在网页上供所有人查看。问题是我需要将这些 SVG 图导出到 powerpoint。我已经开始使用 PHPPowerpoint 并且可以将图像从 web 目录拉到 powerpoint 幻灯片，

但我不知道现在如何将 SVG 图表从它们生成的 html 页面带到 powerpoint？

我以为我可以将它们保存到 web 目录然后使用 PHPPowerPoint....但我无法弄清楚将生成的 SVG 图表保存到 PNG 或 JPG 到 web 目录的第一步？

如果我可以转换为 PNG 或 JPG，然后使用 POST 提交这些图像，我可以将它们保存到服务器吗？

抱歉，对于大多数人来说，这可能是一个简单的问题。这是我尝试过的一些代码，但是当我完成时，圆圈仍然是 SVG ......不是 img ......

    <!DOCTYPE html>
<html>
<body>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="http://canvg.googlecode.com/svn/trunk/rgbcolor.js"></script> 
<script type="text/javascript" src="http://canvg.googlecode.com/svn/trunk/StackBlur.js"></script>
<script type="text/javascript" src="http://canvg.googlecode.com/svn/trunk/canvg.js"></script> 


<canvas id="test" width="600" height="400"></canvas>

<svg width="600" height="400"><style type="text/css"><![CDATA[text{font-family:sans-serif;font-size:11px;} path{fill: none;stroke: #000;shape-rendering: crispEdges;} line{fill: none;stroke: #000;shape-rendering: crispEdges;}]]></style>.....</svg>

<script type="text/javascript"> 
    var ctx = document.getElementById('test').getContext('2d');
    ctx.drawSvg('<svg width="600" height="400"><style type="text/css"><![CDATA[text{font-family:sans-serif;font-size:11px;} path{fill: none;stroke: #000;shape-rendering: crispEdges;} line{fill: none;stroke: #000;shape-rendering: crispEdges;}]]></style>......</svg>',
    0 , 0 , 600, 400);
</script>


</body>
</html>

所以我发现因为我无法在我使用canvg的主机服务器上安装一些东西。我无法让图表看起来 100% 相同......我认为这可能是形状渲染：crispEdges 没有进入 canvg。

4

1 回答 1

0

这是将 SVG 文件转换为 JPG/PNG 的代码（PHP）。

$svgFile = "sample.svg";
$im = new Imagick();
$im->readImageBlob($svgFile);
$im->setImageFormat("jpg");
$im->writeImage('jpg1.jpg');

$im->clear();
$im->destroy();

为此，您需要在您的服务器 ( http://www.imagemagick.org ) 上安装 ImageMagic。

您也可以使用命令将 SVG 转换为 JPG/PNG。

convert sample.svg jpg1.jpg
于 2014-05-21T03:59:14.793 回答