echarts生成圖片另存到伺服器上
整體思路：
1、前端：把echart的base64傳遞到後端
2、後端：在後臺進行base64解碼，生成指定路徑下的圖片
前端，虛擬碼：
....
myCharts1.setOption(option1);
setTimeout(exportImage, 2000);//切記：一定設定這個延遲，否則生成的圖片是黑色的。
function exportImage(){
var picBase64Info = myCharts1.getDataURL();//獲取圖片的base64傳遞後臺，生成圖片，供匯出報表使用
var data = "a="+encodeURIComponent(myCharts1.getDataURL("png"));
var xmlhttp;
if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else { // code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("POST","<%=path%>/web/model/login/savetp.do",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
//alert("儲存成功");
}
}
xmlhttp.send(data);
}
後端，虛擬碼：
/**
* 儲存圖片
* @param request
* @return
*/
@RequestMapping(value = "/savetp", method = RequestMethod.POST)
public void saveImage(HttpServletRequest request) throws Exception{
String a = request.getParameter("a");
String[] url = a.split(",");
String u = url[1];
byte[] b = new BASE64Decoder().decodeBuffer(u);
for (int i = 0; i < b.length; ++i) {
if (b[i] < 0) {// 調整異常資料
b[i] += 256;
}
}
// 生成png圖片
String imgpath=request.getRealPath("/")+"/export/fw.png";
OutputStream out = new FileOutputStream(imgpath);
out.write(b);
out.flush();
out.close();
}