标签：tiff javascript html5 base64 png
我正在使用一个返回PNG编码的base64字符串的插件,我无法更改它,我必须使用它,但是我真正需要的是tiff编码值(base-64).有办法吗？
我试图创建一个画布,加载png base64,然后使用toDataURL(‘image / tiff’),但经过一些研究,我发现不支持tiff作为toDataURL()的输出.
有什么建议么？
解决方法:
由于浏览器通常不将TIFF作为目标文件格式来支持,因此您必须通过使用类型化数组并按照file specifications(请参见此处的Photoshop notes)建立文件结构来手动编码TIFF文件. doable：
>从画布获取原始RGBA位图(请记住,CORS很重要)
>在DataView视图中使用类型化数组,以便能够在未对齐的位置写入各种数据
>建立文件头,定义最少的TAGS集,并以所需的方式对RGBA数据进行编码(未压缩很容易实现,也可以简单地进行RLE压缩).
>构造最终文件缓冲区.在这里,您有一个ArrayBuffer可以作为字节传输,可以选择：
>使用ArrayBuffer和tiff mime-type转换为Blob.
>使用ArrayBuffer作为基础转换为Data-URI
更新canvas-to-tiff可用于将画布另存为TIFF图像(免责声明：我是作者).
要使用canvas-to-tiff获得Data-URI,您只需执行以下操作：
CanvasToTIFF.toDataURL(canvasElement, function(url) {
// url now contains the data-uri.
window.location = url; // download, does not work in IE; just to demo
});
虽然,我建议使用toBlob(),或者如果您想给用户一个链接,则使用toObjectURL()(而不是toDataURL).
使用Data-URI的演示
var c = document.querySelector("canvas"),
ctx = c.getContext("2d");
// draw some graphics
ctx.strokeStyle = "rgb(0, 135, 222)";
ctx.lineWidth = 30;
ctx.arc(200, 200, 170, 0, 2*Math.PI);
ctx.stroke();
// Covert to TIFF using Data-URI (slower, larger size)
CanvasToTIFF.toDataURL(c, function(url) {
var a = document.querySelector("a");
a.href = url;
a.innerHTML = "Right-click this link, select Save As to save the TIFF";
})<script src="https://cdn.rawgit.com/epistemex/canvas-to-tiff/master/canvastotiff.min.js">
</script>
<a href=""></a><br>
<canvas width=400 height=400></canvas>使用对象URL的演示
var c = document.querySelector("canvas"),
ctx = c.getContext("2d");
// draw some graphics
ctx.strokeStyle = "rgb(0, 135, 222)";
ctx.lineWidth = 30;
ctx.arc(200, 200, 170, 0, 2*Math.PI);
ctx.stroke();
// Covert to TIFF using Object-URL (faster, smaller size)
CanvasToTIFF.toObjectURL(c, function(url) {
var a = document.querySelector("a");
a.href = url;
a.innerHTML = "Right-click this link, select Save As to save the TIFF";
})<script src="https://cdn.rawgit.com/epistemex/canvas-to-tiff/master/canvastotiff.min.js">
</script>
<a href=""></a><br>
<canvas width=400 height=400></canvas>标签：tiff,javascript,html5,base64,png 来源： https://codeday.me/bug/20191011/1892117.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。