0

我正在使用谷歌可视化 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

如果问题是关于将 svg 转换为在客户端呈现的 png。那么这可以使用 jsdom 在服务器端实现，而 node.js.JSDOM 是服务器上浏览器的 DOM 实现，以便您可以执行客户端 javascript在服务器本身。

这是如何使用 jsdom、node.js 和 imagemagick 将 svg 转换为 png 的示例

点击这里

希望它能解决你的问题！

于 2012-12-19T07:26:02.047 回答