在google浏览器中上传Tiff图片

由于在谷歌浏览器和火狐浏览器中无法识别Tiiff格式的图片，所以用谷歌浏览器打开SpreadJS后，发现无法上传Tiff图片。

本篇文章将介绍如何在SpreadJS中导入Tiff图片：
1、首先可以下载一个Lib包tiff.js，
2、其次在页面中设置一个导入按钮

1. <input id="selectedFile" type="file" name="files[]"
   
2.        accept='image/bmp,image/gif,image/jpeg,image/jpg,image/png,image/tiff'>
   
3. <button id="upload">上传图片</button>

复制代码

3、按钮点击后，对image类型进行判断，如果是Tiff类型，则需要用Tiff构造函数包装一下。如下代码

1. document.getElementById('upload').addEventListener('click', function () {
   
2.             var blob = document.querySelector('#selectedFile').files[0];
   
3.             if (!blob) {
   
4.                 return;
   
5.             }
   
6.             var fileReader = new FileReader();
   
7.             if (blob.type == 'image/tiff') {
   
8.                 fileReader.onload = function (e) {
   
9.                     let file = e.target.result
   
10.                     var tiff = new Tiff({buffer: file});
    
11.                     sheet.shapes.addPictureShape('pic2', tiff.toDataURL(), 80, 80, 150, 150);
    
12.                 };
    
13.                 fileReader.readAsArrayBuffer(blob)
    
14.             } else {
    
15.                 fileReader.onload = function (e) {
    
16.                     let file = e.target.result
    
17.                     sheet.shapes.addPictureShape('pic1', file, 80, 80, 150, 150);
    
18.                 };
    
19.                 fileReader.readAsDataURL(blob)
    
20.             }
    
21.         })

复制代码

这样子就可以实现啦，可以查看下面的动图及附件：