【freemaker實現導出word③】詳解將echarts的圖片到出到word

endless_road 發布于2019-08-15 12:21 / 3126人閱讀

摘要：前面介紹了導出到的代碼實現，詳見這里，里面有一部分涉及導出圖片到，在這里我再另外做一個詳細的介紹。在前臺用將生成的圖片轉成編碼，提交給后臺。

前面介紹了導出到word的代碼實現，詳見這里，里面有一部分涉及導出圖片到word，在這里我再另外做一個詳細的介紹。
是這樣的，我項目有個功能，里面就涉及到要將echarts形成的柱狀圖或者地圖之類的圖表導出到word，在網上找了很久，都是說將圖片轉成base64編碼后傳給后臺解碼，但沒有一篇有詳細具體的介紹，經過不斷的摸索，終于實現了，在這里給大家做個分享。

處理步驟：
（1）圖片我們可以在前臺將要的圖片轉成base64編碼，然后提交給后臺接收
（2）后臺接收base64編碼后使用工具類將base64解碼成圖片然后保存到本地中
（3）在要導出word的時候讀取下本地存儲圖片的路徑然后把圖片導出來就行了。

1、在前臺用js將echarts生成的圖片轉成base64編碼，提交給后臺。

2、下面就是使用工具類在后臺對圖片進行處理，工具類如下：

package com.*.util;
import java.awt.image.BufferedImage;
import java.io.ByteArrayOutputStream;
import java.io.File;
import java.io.FileInputStream;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStream;
import java.io.OutputStream;
import java.util.UUID;
import javax.imageio.ImageIO;
import Decoder.BASE64Decoder;
import Decoder.BASE64Encoder;


/**
 * 類名稱：ImageUtil
 * 類描述：圖片處理工具類
 */
public class ImageUtil {
    
     /**
      * 從path這個地址獲取一張圖片然后轉為base64碼
      * @param imgName  圖片的名字 如：123.png（是帶后綴的）
      * @param path     123.png圖片存放的路徑
      * @return
      * @throws Exception
      */
     public static String getImageFromServer(String imgName,String path)throws Exception{
      BASE64Encoder encoder = new BASE64Encoder();
      File f = new File(path+imgName);
            if(!f.exists()){
        f.createNewFile();
            }
            BufferedImage bi = ImageIO.read(f);    
            ByteArrayOutputStream baos = new ByteArrayOutputStream();    
            ImageIO.write(bi, "png", baos);    
            byte[] bytes = baos.toByteArray();    
            return encoder.encodeBuffer(bytes).trim();      
     }
     
     /**
      * 將一個base64轉換成圖片保存在  path文件夾下  ,命名隨機
      * @param base64String
      * @param path  是一個文件夾路徑
      * @param imgName 圖片名字(沒有后綴)
      * @throws Exception
      */
     public static String savePictoServer(String base64String,String path)throws Exception{
        
         BASE64Decoder decoder = new BASE64Decoder();
         //要把+在上傳時變成的空格再改為+
         base64String = base64String.replaceAll(" ", "+");
         //去掉“data:image/png;base64,”后面才是base64編碼，去掉之后才能解析
         base64String = base64String.replace("data:image/png;base64,","");
         //在本地指定位置建立文件夾，path由控制臺那邊進行定義
         String realPath = path+"/"+"echarts";
         File dir=new File(realPath);
         if(!dir.exists()){
          dir.mkdirs();
         }
         String fileName=path+""+"echarts"+""+UUID.randomUUID().toString()+".png";
         try {  
             byte[] buffer = decoder.decodeBuffer(base64String);  
             OutputStream os = new FileOutputStream(fileName);
             for(int i =0;i
3、最后一步就是控制臺方法如何處理圖片導出到word了，參照上一篇文章的第三步
到這里我的freemaker導出word系列就分享完畢咯。
感謝各位看官的閱讀，本仙女是帥帥的玉米，有什么問題請留言哦，覺得有用的請賞賜個贊！！

GPU云服務器云服務器用freemaker導出的Word word導出到出到 freemarker導出word

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/67884.html

【freemaker實現導出word③】詳解將echarts的圖片到出到word

摘要：前面介紹了導出到的代碼實現，詳見這里，里面有一部分涉及導出圖片到，在這里我再另外做一個詳細的介紹。在前臺用將生成的圖片轉成編碼，提交給后臺。前面介紹了導出到word的代碼實現，詳見這里，里面有一部分涉及導出圖片到word，在這里我再另外做一個詳細的介紹。是這樣的，我項目有個功能，里面就涉及到要將echarts形成的柱狀圖或者地圖之類的圖表導出到word，在網上找了很久，都是說將圖片轉...

flyer_dev 2019-08-21 17:15 評論0 收藏0
【freemaker實現導出word②】代碼實現導出word（包括導出list數據和導出圖片到wor

摘要：前面文章已經分享了如何創建導出需要用到的模板了，接下來這里要給大家分享的是如何用后臺制作導出的代碼工具和實現。可以重，數據庫裝載。前面文章已經分享了如何創建導出word需要用到的xml/ftl模板了，接下來這里要給大家分享的是如何用后臺制作導出word的代碼工具和controller實現。 1、首先是工具類，沒有工具，談何實現呢？下面貼我這邊導出word的utils，大家可以直接復制...

bitkylin 2019-08-15 12:21 評論0 收藏0
【freemaker實現導出word①】創建xml/ftl模板

摘要：在項目中，往往很多時候需要我們實現將數據導出到文檔中，但是導出首要做法就是創建模板，沒有模板，請求出來的數據就沒有可以存放和顯示的地方。代碼實現導出請看后續文章。在javaweb項目中，往往很多時候需要我們實現將數據導出到word文檔中，但是導出word首要做法就是創建模板，沒有模板，請求出來的數據就沒有可以存放和顯示的地方。導出的模板需要xml或者ftl格式的文件。新建word文...

Kross 2019-08-15 12:21 評論0 收藏0
[原]文檔定義應用：數據科學的文檔革命

摘要：對于數據科學的研究可以說已經是本文我將介紹如何以文檔定義應用的方式成為數據科學中的標準交付。參考前文解密的數據科學部門如果構建知識倉庫，作為一個謝大大的死忠，我很自然選擇了作為我文檔輸出的首選工具。 showImg(https://segmentfault.com/img/remote/1460000006760433?w=423&h=426); 概述隨著近年來，Rstudio 通過...

wh469012917 2019-07-25 10:22 評論0 收藏0
python綜合程序設計——做一個可視化大屏

摘要：完成可視化熱搜榜和國內疫情新增圖，提高學生的編程能力和分析問題解決問題的能力。下圖為百度微博知乎三大平臺的熱搜詞頻統計圖。后續我會補上薄弱項，為爭取做一名全棧技術人員而奮斗。 ...

_Dreams 2021-11-11 16:55 評論0 收藏0