将echarts图从页面下载到服务器中保存成png格式

最新推荐文章于 2025-04-17 10:25:20 发布
IT_小草
最新推荐文章于 2025-04-17 10:25:20 发布
阅读量4.1k
点赞数
CC 4.0 BY-SA版权
分类专栏： Java 文章标签： java
本文链接：https://blog.youkuaiyun.com/IT_xiaocao/article/details/73494311
Java 专栏收录该内容
22 篇文章
订阅专栏
该博客探讨了如何将使用Echarts生成的图表从网页导出，并在后台以PNG格式保存到服务器上，主要涉及Java技术。
摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >
	function create(){
				AddRunningDiv();
				$.ajax({
					type : "post",
					url:encodeURI(encodeURI('./export-creatFolder')),
					dataType:"json",
					 success:function(m){
						//console.log("data2:"+m);
						var pm25_avg =downloadPNG(m);
						
					},
					error : function(result) {
						debugger;
						alert("Error");
					} 
				});
				
			}


 

function downloadPNG(tpath){
			 var isOk = true;
			
			 var imgURL = myChartFamily_Off_outFamily_Off_out.getDataURL('png');//获取base64编码
			 var b64 = imgURL.substring(22);
			 
			 var imgStr1 = b64.substring(0, b64.length/10);
			 var imgStr2 = b64.substring(b64.length/10, (b64.length*2)/10);
			 var imgStr3 = b64.substring((b64.length*2)/10, (b64.length*3)/10);
			 var imgStr4 = b64.substring((b64.length*3)/10, (b64.length*4)/10);
			 var imgStr5 = b64.substring((b64.length*4)/10, (b64.length*5)/10);
			 var imgStr6 = b64.substring((b64.length*5)/10, (b64.length*6)/10);
			 var imgStr7 = b64.substring((b64.length*6)/10, (b64.length*7)/10);
			 var imgStr8 = b64.substring((b64.length*7)/10, (b64.length*8)/10);
			 var imgStr9 = b64.substring((b64.length*8)/10, (b64.length*9)/10);
			 var imgStr10 = b64.substring((b64.length*9)/10, (b64.length*10)/10);
			 
			 $("#imgStr1").val(imgStr1);
			 $("#imgStr2").val(imgStr2);
			 $("#imgStr3").val(imgStr3);
			 $("#imgStr4").val(imgStr4);
			 $("#imgStr5").val(imgStr5);
			 $("#imgStr6").val(imgStr6);
			 $("#imgStr7").val(imgStr7);
			 $("#imgStr8").val(imgStr8);
			 $("#imgStr9").val(imgStr9);
			 $("#imgStr10").val(imgStr10);
			 $("#pathp").val(tpath+"/famiOffOutmap.png");
			  
			  
    		 var imgURLf = myChart.getDataURL('png');//获取base64编码
			 var b64f = imgURLf.substring(22);
			
			 var imgStrf1 = b64f.substring(0, b64.length/10);
			 var imgStrf2 = b64f.substring(b64.length/10, (b64.length*2)/10);
			 var imgStrf3 = b64f.substring((b64.length*2)/10, (b64.length*3)/10);
			 var imgStrf4 = b64f.substring((b64.length*3)/10, (b64.length*4)/10);
			 var imgStrf5 = b64f.substring((b64.length*4)/10, (b64.length*5)/10);
			 var imgStrf6 = b64f.substring((b64.length*5)/10, (b64.length*6)/10);
			 var imgStrf7 = b64f.substring((b64.length*6)/10, (b64.length*7)/10);
			 var imgStrf8 = b64f.substring((b64.length*7)/10, (b64.length*8)/10);
			 var imgStrf9 = b64f.substring((b64.length*8)/10, (b64.length*9)/10);
			 var imgStrf10 = b64f.substring((b64.length*9)/10, (b64.length*10)/10);
			 
			 $("#imgStrf1").val(imgStrf1);
			 $("#imgStrf2").val(imgStrf2);
			 $("#imgStrf3").val(imgStrf3);
			 $("#imgStrf4").val(imgStrf4);
			 $("#imgStrf5").val(imgStrf5);
			 $("#imgStrf6").val(imgStrf6);
			 $("#imgStrf7").val(imgStrf7);
			 $("#imgStrf8").val(imgStrf8);
			 $("#imgStrf9").val(imgStrf9);
			 $("#imgStrf10").val(imgStrf10);
			// $("#pathf").val(tpath+"/famiOffOutmap.png");
			$("#pathf").val(tpath+"/pm25avgmap.png");
			debugger;
			 $("#form_hoddenP").submit();
			 debugger;
			 return isOk;
		}
  <form id="form_hoddenP" name="form_hoddenP" action="./export-downLoadEchartsP" method="post" target="form_hoddenP">
		<input type="hidden" id="imgStr1" name="imgStr1" value="">
		<input type="hidden" id="imgStr2" name="imgStr2" value="">
		<input type="hidden" id="imgStr3" name="imgStr3" value="">
		<input type="hidden" id="imgStr4" name="imgStr4" value="">
		<input type="hidden" id="imgStr5" name="imgStr5" value="">
		<input type="hidden" id="imgStr6" name="imgStr6" value="">
		<input type="hidden" id="imgStr7" name="imgStr7" value="">
		<input type="hidden" id="imgStr8" name="imgStr8" value="">
		<input type="hidden" id="imgStr9" name="imgStr9" value="">
		<input type="hidden" id="imgStr10" name="imgStr10" value="">
		<input type="hidden" id="pathp" name="pathp" value="">
		
		
		<input type="hidden" id="imgStrf1" name="imgStrf1" value="">
		<input type="hidden" id="imgStrf2" name="imgStrf2" value="">
		<input type="hidden" id="imgStrf3" name="imgStrf3" value="">
		<input type="hidden" id="imgStrf4" name="imgStrf4" value="">
		<input type="hidden" id="imgStrf5" name="imgStrf5" value="">
		<input type="hidden" id="imgStrf6" name="imgStrf6" value="">
		<input type="hidden" id="imgStrf7" name="imgStrf7" value="">
		<input type="hidden" id="imgStrf8" name="imgStrf8" value="">
		<input type="hidden" id="imgStrf9" name="imgStrf9" value="">
		<input type="hidden" id="imgStrf10" name="imgStrf10" value="">
		<input type="hidden" id="pathf" name="pathf" value="">
	</form>
后台
	/**
	 * 创建以时间+4位随机数命名的文件夹
	 * @return
	 */
	@Action(value="/export-creatFolder",results={
			/*@Result(name="getAllRule",location="/rule_list.jsp")*/
	})
	public String creatFolder() throws UnsupportedEncodingException{
		java.util.Date current=new java.util.Date();
        java.text.SimpleDateFormat sdf=new java.text.SimpleDateFormat("yyyyMMddHHmmss"); 
        String c=sdf.format(current);
        Random ran = new Random();
        int s = ran.nextInt(9999);
        c += s;
        
        String rootPath=getClass().getResource("/").getFile().toString();//获取项目根目录
        //System.out.println(rootPath+"=====================================");
        rootPath = rootPath.replaceAll("%20", " ");
       // System.out.println(rootPath+c+"=====");
		File file =new File(rootPath+c);//==================     在这里修改临时保存图片的磁盘路径        =======================
		//如果文件夹不存在则创建    
		if  (!file .exists()  && !file .isDirectory()){       
		    System.out.println("//不存在");  
		    file .mkdir();    
		} else {  
		    System.out.println("//目录存在");  
		} 
		writeJson1(file.getPath());
		return NONE;
	}





	/**
	 * 将BASE64字符串保存成图片
	 * @return
	 */
	@Action(value="/export-downLoadEchartsP",results={
			/*@Result(name="getAllRule",location="/rule_list.jsp")*/
	})
	public String downLoadEcharts(){
		//System.out.println("第一张导出");
		String imgStr1 = request.getParameter("imgStr1");
		String imgStr2 = request.getParameter("imgStr2");
		String imgStr3 = request.getParameter("imgStr3");
		String imgStr4 = request.getParameter("imgStr4");
		String imgStr5 = request.getParameter("imgStr5");
		String imgStr6 = request.getParameter("imgStr6");
		String imgStr7 = request.getParameter("imgStr7");
		String imgStr8 = request.getParameter("imgStr8");
		String imgStr9 = request.getParameter("imgStr9");
		String imgStr10 = request.getParameter("imgStr10");
		String path = request.getParameter("pathp");
		String imgStr = imgStr1+imgStr2+imgStr3+imgStr4+imgStr5+imgStr6+imgStr7+imgStr8+imgStr9+imgStr10;
		//System.out.println("=================================="+imgStr);
		GenerateImage(imgStr,path);
		
		
		String imgStrf1 = request.getParameter("imgStrf1");
		String imgStrf2 = request.getParameter("imgStrf2");
		String imgStrf3 = request.getParameter("imgStrf3");
		String imgStrf4 = request.getParameter("imgStrf4");
		String imgStrf5 = request.getParameter("imgStrf5");
		String imgStrf6 = request.getParameter("imgStrf6");
		String imgStrf7 = request.getParameter("imgStrf7");
		String imgStrf8 = request.getParameter("imgStrf8");
		String imgStrf9 = request.getParameter("imgStrf9");
		String imgStrf10 = request.getParameter("imgStrf10");
		String pathf = request.getParameter("pathf");
		String imgStrf = imgStrf1+imgStrf2+imgStrf3+imgStrf4+imgStrf5+imgStrf6+imgStrf7+imgStrf8+imgStrf9+imgStrf10;
		//System.out.println("=================================="+imgStr);
		GenerateImage(imgStrf,pathf);
		return NONE;
	}


/**
	 * base64字符串转化成图片  
	 * @param imgStr
	 * @param path
	 * @return
	 */
    public static boolean GenerateImage(String imgStr,String path)  
    {   //对字节数组字符串进行Base64解码并生成图片  
        if (imgStr == null) //图像数据为空  
            return false;  
        BASE64Decoder decoder = new BASE64Decoder();  
        try   
        {  
            //Base64解码  
            byte[] b = decoder.decodeBuffer(imgStr);  
            for(int i=0;i<b.length;++i)  
            {  
                if(b[i]<0)  
                {//调整异常数据  
                    b[i]+=256;  
                }  
            }  
            //生成jpeg图片  
            String imgFilePath = path;//新生成的图片  
            OutputStream out = new FileOutputStream(imgFilePath);      
            out.write(b);  
            out.flush();  
            out.close();  
            return true;  
        }   
        catch (Exception e)   
        {  
            return false;  
        }  
    }