js查看tif格式文件

近期有个需求是查看oss上的tif格式文件，在此分享一下js处理方式。

tif.js是必须要用的，有个毛病就是加载起来比较慢，我处理时加了loading框，如果大佬有加载快的方式，请指明，感谢。

直接上代码。（本人使用古老的angularJS，请各位将就看。）

//canvas转base64
var canvasBase64 = function(canvas) {
	var img = new Image();
	img.src = canvas.toDataURL('image/png', 0.8);
	img.onload = () => {
	    var myctx = canvas.getContext('2d');
	    myctx.fillStyle = '#fff';
	    myctx.fillRect(0, 0, 100, 100);
	    myctx.drawImage(img, 0, 0, 100, 100);
	    var base64 = canvas.toDataURL('image/png', 0.8);
	    index++;
	    strList.push(base64);
	    if(index>canvasList.length-1){
	        $scope.vo.strList = strList;
	        $scope.$apply();//刷一下页面变量
	        return;
	    }
	    canvasBase64(canvasList[index])
	}
};

var index = 0;
var canvasList = [];
var xhr = new XMLHttpRequest();
xhr.open('GET', list.riskpath); //filename为tif文件地址，我这里是oss地址
xhr.responseType = 'arraybuffer';
xhr.onload = function (e) {
    var buffer = xhr.response;
    var tiff = new Tiff({buffer: buffer});
    //tiff文件中有多张图片
    for (let i = 0, len = tiff.countDirectory(); i < len; ++i) {
        tiff.setDirectory(i);
        //tif画到canvas里
        var canvas = tiff.toCanvas();
        if (canvas) {
            canvasList.push(canvas);
        }
    }
    if(canvasList.length){
        canvasBase64(canvasList[index])
    }
};
xhr.send();