0

d3 を使用して SVG チャートを作成する方法を理解し、すべての人が閲覧できるようにそれらを Web ページにきれいに表示しました。問題は、これらの SVG グラフをパワーポイントにエクスポートする必要があることです。PHPPowerpoint の使用を開始し、Web ディレクトリから Powerpoint スライドに画像をプルできます。

しかし、私が理解できないのは、生成されたHTMLページからパワーポイントにSVGチャートを取得する方法です?

それらを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% 同じように表示するのに問題があります...形状レンダリングが原因である可能性があります。cripEdges は canvg に入りません。

4

1 に答える 1