我正在尝试找出一种将Google可视化图表保存为图像的方法。谷歌没有提供将这些图表导出为图像的方法，我需要能够保存图表图像以添加到报告中。我希望能够完成这个服务器端，并且不希望必须依赖客户端来做任何事情。我找到了几个指向使用HTML5 canvas和javascript的解决方案，但这不是一个选项，因为它依赖于客户端的兼容性。有没有办法渲染HTML代码并使用.Net将其保存为图像？我列出了我用来生成HTML格式的Google Visualzation图表的字符串。
Dim html As String = "<html xmlns=" & Chr(34) & "http://www.w3.org/1999/xhtml" & Chr(34) & "><head><title>Test HTML CAPTURE</title></head><body><script src=" & Chr(34) & "https://www.google.com/jsapi" & Chr(34) & " type=" & Chr(34) & "text/javascript" & Chr(34) & "></script><script type=" & Chr(34) & "text/javascript" & Chr(34) & "> /*CACHARTS*/ google.load(" & Chr(34) & "visualization" & Chr(34) & ", " & Chr(34) & "1" & Chr(34) & ", {packages:[" & Chr(34) & "corechart" & Chr(34) & "]}); google.setOnLoadCallback(drawChart); function drawChart() { var data; var chart; document.getElementById('chart1_div').scrollIntoView();chartTitle = ''; xColumn = 'Quarter'; yColumn = 'Avg Sold Price'; zColumn = 'Smoothed'; yTitle = 'Price in Thousands'; chart = new google.visualization.LineChart(document.getElementById('chart1_div')); legendType = 'none'; data = new google.visualization.DataTable(); data.addColumn('string', xColumn); data.addColumn('number', yColumn); data.addColumn('number', zColumn); data.addRows(35); data.setValue(0, 0, '2005-Q1'); data.setValue(0, 1, 288+0); data.setValue(1, 0, '2005-Q2'); data.setValue(1, 1, 285+0); data.setValue(2, 0, '2005-Q3'); data.setValue(2, 1, 315+0); data.setValue(3, 0, '2005-Q4'); data.setValue(3, 1, 318+0); data.setValue(4, 0, '2006-Q1'); data.setValue(4, 1, 310+0); data.setValue(5, 0, '2006-Q2'); data.setValue(5, 1, 286+0); data.setValue(6, 0, '2006-Q3'); data.setValue(6, 1, 299+0); data.setValue(7, 0, '2006-Q4'); data.setValue(7, 1, 278+0); data.setValue(8, 0, '2007-Q1'); data.setValue(8, 1, 283+0); data.setValue(9, 0, '2007-Q2'); data.setValue(9, 1, 278+0); data.setValue(10, 0, '2007-Q3'); data.setValue(10, 1, 287+0); data.setValue(11, 0, '2007-Q4'); data.setValue(11, 1, 260+0); data.setValue(12, 0, '2008-Q1'); data.setValue(12, 1, 299+0); data.setValue(13, 0, '2008-Q2'); data.setValue(13, 1, 273+0); data.setValue(14, 0, '2008-Q3'); data.setValue(14, 1, 259+0); data.setValue(15, 0, '2008-Q4'); data.setValue(15, 1, 231+0); data.setValue(16, 0, '2009-Q1'); data.setValue(16, 1, 233+0); data.setValue(17, 0, '2009-Q2'); data.setValue(17, 1, 244+0); data.setValue(18, 0, '2009-Q3'); data.setValue(18, 1, 234+0); data.setValue(19, 0, '2009-Q4'); data.setValue(19, 1, 219+0); data.setValue(20, 0, '2010-Q1'); data.setValue(20, 1, 235+0); data.setValue(21, 0, '2010-Q2'); data.setValue(21, 1, 236+0); data.setValue(22, 0, '2010-Q3'); data.setValue(22, 1, 207+0); data.setValue(23, 0, '2010-Q4'); data.setValue(23, 1, 210+0); data.setValue(24, 0, '2011-Q1'); data.setValue(24, 1, 184+0); data.setValue(25, 0, '2011-Q2'); data.setValue(25, 1, 188+0); data.setValue(26, 0, '2011-Q3'); data.setValue(26, 1, 202+0); data.setValue(27, 0, '2011-Q4'); data.setValue(27, 1, 186+0); data.setValue(28, 0, '2012-Q1'); data.setValue(28, 1, 204+0); data.setValue(29, 0, '2012-Q2'); data.setValue(29, 1, 237+0); data.setValue(30, 0, '2012-Q3'); data.setValue(30, 1, 185+0); data.setValue(31, 0, '2012-Q4'); data.setValue(31, 1, 195+0); data.setValue(32, 0, '2013-Q1'); data.setValue(32, 1, 196+0); data.setValue(33, 0, '2013-Q2'); data.setValue(33, 1, 225+0); data.setValue(34, 0, '2013-Q3'); data.setValue(34, 1, 218+0); data.setValue(0, 2, 302+0); data.setValue(1, 2, 301+0); data.setValue(2, 2, 301+0); data.setValue(3, 2, 300+0); data.setValue(4, 2, 298+0); data.setValue(5, 2, 296+0); data.setValue(6, 2, 293+0); data.setValue(7, 2, 290+0); data.setValue(8, 2, 286+0); data.setValue(9, 2, 282+0); data.setValue(10, 2, 278+0); data.setValue(11, 2, 274+0); data.setValue(12, 2, 269+0); data.setValue(13, 2, 263+0); data.setValue(14, 2, 257+0); data.setValue(15, 2, 251+0); data.setValue(16, 2, 245+0); data.setValue(17, 2, 239+0); data.setValue(18, 2, 233+0); data.setValue(19, 2, 227+0); data.setValue(20, 2, 222+0); data.setValue(21, 2, 217+0); data.setValue(22, 2, 212+0); data.setValue(23, 2, 208+0); data.setValue(24, 2, 205+0); data.setValue(25, 2, 202+0); data.setValue(26, 2, 201+0); data.setValue(27, 2, 200+0); data.setValue(28, 2, 201+0); data.setValue(29, 2, 201+0); data.setValue(30, 2, 203+0); data.setValue(31, 2, 204+0); data.setValue(32, 2, 206+0); data.setValue(33, 2, 209+0); data.setValue(34, 2, 211+0); chart.draw(data, {title: chartTitle ,vAxis:{title: yTitle} ,width: 700, height: 700 ,hAxis:{slantedText:true, slantedTextAngle:90, textStyle:{fontSize:10}} ,curveType:'function' ,lineWidth:1 ,pointSize:1 ,legend:'none' ,legend: legendType }); window.scroll(0,0);} </script><div><span class=" & Chr(34) & "float-left" & Chr(34) & " id=" & Chr(34) & "chart1_div" & Chr(34) & "></span><div style=" & Chr(34) & "clear:both" & Chr(34) & "></div></div></body></html>"
有没有人知道任何允许我渲染html然后将其保存为图像的工具。
convertHtmlToImage(html,jpg)
答案 0 :(得分：0)
PhantomJS提供此功能。
这里有一个很好的链接，解释了如何使用它：
https://github.com/ariya/phantomjs/wiki/Screen-Capture
它可以让你完全按照自己的要求去做。
本文介绍如何使用C＃和phantomjs截取屏幕截图：
http://www.codeproject.com/Tips/598045/Capture-screen-of-webpage-in-different-formats