0

私はGoogle視覚化APIを使用してチャート(ゲージ)を動的に生成しています。ブラウザのdomから生成されたsvgを収集し、それをサーバーに送信して、そこからpng画像を生成する必要があります( apache batikを使用)。javascriptの「innerHTML」を使用して、Firefox、Chrome、Safari、およびIE 9のブラウザのDOMからSVGコードを取得できます。しかし、IE 7 と IE 8 で同じことを試みると、innerHTML テキストに空の iframe が表示されます。これがjavascriptコードです。htmlからsvg部分を取得するために使用しています。

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
//Load the Visualization API and the piechart package.
google.load('visualization', '1.0', {'packages':['gauge']});

// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawVisualization);
function drawVisualization() 
{
      var data = google.visualization.arrayToDataTable([
        ['Label', 'Value'],
        ['Memory', 80],
        ['CPU', 55],
        ['Network', 68]
      ]);

      // Create and draw the visualization.
      new google.visualization.Gauge(document.getElementById('visualization')).
          draw(data);
      alert(document.getElementById('visualization').innerHTML);
}
</script>
4

1 に答える 1

1

質問がクライアント側でレンダリングされるpngに変換されることに関する質問の場合、これはjsdomとnode.jsを使用してサーバー側で実現できます。JSDOMはサーバー上のブラウザーのDOM実装であり、クライアント側のjavascriptを実行できます。サーバー自体に。

jsdom、node.js、imagemagickを使用してsvgをpngに変換する方法の例を次に示します。

ここをクリック

それがあなたの問題を解決することを願っています!

于 2012-12-19T07:26:02.047 に答える