所以我想出了如何用d3创建SVG图表,并将它们整齐地显示在网页上供所有人查看。问题是我需要将这些SVG图形导出到powerpoint。我已经开始使用PHPPowerpoint,可以将网页目录中的图片拉到powerpoint幻灯片中。
但我不明白的是,现在如何将SVG图表从生成的html页面转到powerpoint上?
我想我可以将它们保存到web目录,然后使用PHPPowerPoint....but。我不知道将生成的SVG图表保存到PNG或JPG到web目录的第一步是什么?
如果我可以转换为PNG或JPG,然后提交这些图像与帖子,我可以保存他们到服务器也许?
对不起,对于大多数人来说,这可能是一个简单的问题。下面是我尝试过的一些代码,但是当我complete....not一个img时,这个圆仍然是一个SVG…
<!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。
发布于 2014-05-21 11:59:15
下面是将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.jpghttps://stackoverflow.com/questions/23745553
复制相似问题