前端tif文件在线预览

layui框架，实现支持tif格式文件在线预览

        首先要引用tif的js文件

         js下载地址  tif在线预览文件-tiff.min.js-Javascript文档类资源-CSDN文库https://download.csdn.net/download/sinat_37774909/36996306

        引用之后则可进行逻辑编写了，详情见代码

show.showTif = function(imageData){
	if (imageData == "") {
		common.fail("查看图片出错，请联系相关开发人员！");
		return ;
	}
    //后端返回base64格式的tif信息
	var data = imageData[0];
    //使用layui的open打开窗口
	layer.open({
		type: 1 //此处以iframe举例
		,title: "tif预览"
		,area: ['80%', '90%']
		,shade: 0
		,maxmin: true
		,moveType: 0
		,zIndex: layer.zIndex
		,content:'<div id="tifcontainer"><div id="pop"></div></div>'
		,success:function(){
			var buffer = fifth.decodeBase64(data);
			var tiff = new Tiff({
				buffer : buffer
			});
			//tiff文件中有多张图片
			$('#pop').empty();
			for (let i = 0, len = tiff.countDirectory(); i < len; ++i) {
				tiff.setDirectory(i);
				const canvas = tiff.toCanvas();
				if (canvas) {
					canvas.id = 'page-id' + i;
					$('#pop').append(canvas);
				}
			}
		}
	});
}

fifth.decodeBase64 = function(base64Str) {
	var bString = atob(base64Str);
	var len = bString.length;
	var arr = new Uint8Array(len);
	while (len--) {
		arr[len] = bString.charCodeAt(len);
	}
	return arr;
}