如何实现绑定字段并生成图片？

产品：SpreadJS , GcExcel
版本：16.1.4 ， 6.1.4
需求编号：【DOCXLS-9273】  
我希望用GcExcel 模板绑定字段，字段的内容其实是图片url，我希望渲染模板后给前端展示成图片，模板见附件，代码如下，结果函数模板+字段没有生效，请问有其他办法吗？

1. public class DemoJsonDatasource3 {
   
2.     public static void main(String[] args) throws IOException {
   
3.         String index = "29";
   
4.         Workbook workbook = new Workbook();
   
5.         String rootPath = "";
   
6.         String templateFile = rootPath + index + ".template.xlsx";
   
7.         workbook.open(templateFile);
   
8.         String dataFile0 = rootPath + index + ".ds0.json.txt";
   
9.         JsonDataSource datasource0 = new JsonDataSource(new String(Files.readAllBytes(Paths.get(dataFile0)), StandardCharsets.UTF_8));
   
10.         workbook.addDataSource("ds0", datasource0);
    
11.         boolean page = false;
    
12.         if (page) {
    
13.             workbook.getNames().add("TemplateOptions.PaginationMode", "true");
    
14.         }
    
15.         workbook.processTemplate();
    
16.         workbook.save(rootPath + index + ".result.xlsx");
    
17.     }
    
18. }

复制代码

结果是这样样子

您好，请参考这篇文章
https://demo.grapecity.com.cn/do ... ondataimagetemplate
您可以点击右侧的下载按钮查看全部代码。
在这篇文章中，运行相关代码后，可以生成图片，如下图所示：



其模板为


您可以将您的图片数据转换为base64格式的数据，看修改后是否可以生效

这个是针对图片数据已经在字段内容里面的场景。那如果字段内容里面仅仅是图片的url地址，可以有办法实现吗？

您好，模板暂时不支持url类型的图片，但是您可以通过下面的代码，将url地址转换为base64

1. import java.io.ByteArrayOutputStream;
   
2. import java.io.IOException;
   
3. import java.io.InputStream;
   
4. import java.io.UnsupportedEncodingException;
   
5. import java.net.MalformedURLException;
   
6. import java.net.URL;
   
7. import java.net.URLEncoder;
   
8. import com.grapecity.documents.excel.Workbook;
   
9. import com.grapecity.documents.excel.drawing.IShape;
   
10. 
    
11. public class Test {
    
12. 
    
13.     public static void main(String[] args) throws MalformedURLException, UnsupportedEncodingException {
    
14.         Workbook workbook = new Workbook();
    
15.         workbook.open("Bug_4098.json");
    
16.         IShape pic = workbook.getActiveSheet().getShapes().get(0);
    
17.         String url = pic.getPictureFormat().getUrl();
    
18.         byte[] picByte = GetPicFromUrl(url);
    
19.         pic.getPictureFormat().setFill(picByte);
    
20.         workbook.save("Bug_4098.pdf");
    
21.         workbook.save("Bug_4098.xlsx");
    
22.     }
    
23. 
    
24.     private static byte[] GetPicFromUrl(String urlString) throws MalformedURLException, UnsupportedEncodingException {
    
25. 
    
26.         URL url = new URL(encode(urlString));
    
27.         ByteArrayOutputStream baos = new ByteArrayOutputStream();
    
28.         try (InputStream inputStream = url.openStream()) {
    
29.             int n = 0;
    
30.             byte[] buffer = new byte[1024];
    
31.             while (-1 != (n = inputStream.read(buffer))) {
    
32.                 baos.write(buffer, 0, n);
    
33.             }
    
34.         } catch (IOException e) {
    
35.             e.printStackTrace();
    
36.         }
    
37. 
    
38.         return baos.toByteArray();
    
39.     }
    
40. 
    
41.     private static String encode(String url) throws UnsupportedEncodingException {
    
42.         char[] charArray = url.toCharArray();
    
43.         StringBuilder sb = new StringBuilder();
    
44.         for (char c : charArray) {
    
45.             if (c >= 0 && c < 255) {
    
46.                 sb.append(c);
    
47.             } else {
    
48.                 sb.append(URLEncoder.encode(String.valueOf(c), "UTF-8"));
    
49.             }
    
50.         }
    
51.         return sb.toString();
    
52.     }
    
53. 
    
54. }

复制代码

您好，通过楼上回复是否可以解决您的问题呢？

Ellia.Duan 发表于 2023-10-30 16:55
您好，通过楼上回复是否可以解决您的问题呢？

谢谢您的回复。我们暂时绕过了，但是这个需求最好能实现，你们可以在新版本中加这个feature吗？

您好，您提到的暂时绕过了，是不放图片了，还是用了楼上给出的转base64的方案呢？如果已经用Base64实现了模板中加载图片，那么当前方案是哪里不满足您的需求呢？我们需要根据这个评估下您的需求。

Ellia.Duan 发表于 2023-11-9 11:33
您好，您提到的暂时绕过了，是不放图片了，还是用了楼上给出的转base64的方案呢？如果已经用Base64实现了模 ...

我们没有用你们提供的方案，我们不会提前把url对应的图片都下载下来的，代价比较高。我们目前是先绑定url字段到一个单元格，然后在另外的单元格调用js的=image()函数，函数的参数是url字段绑定的单元格，并设置上下文为url绑定的单元格，这样页面可以展示图片。一个字段有多个值也会自动跟着扩展

好的，明白您的需求背景了，也感谢您分享经验，稍后将为您奖励金币。同时我将您的需求先记录下来，此贴将移至“产品需求”板块，待有进展会及时联系您。