使用 base64 将画布图像从一个画布显示到另一个画布

Display canvas image from one canvas to another canvas using base64(使用 base64 将画布图像从一个画布显示到另一个画布)
本文介绍了使用 base64 将画布图像从一个画布显示到另一个画布的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

例如var new = canvas.toDataURL("image/png");

我希望这个新变量中存在的 base64 显示到存在的第二个画布元素中.但它不使用 drawimage 方法显示 base64 图像.如果我使用说 image.png

I want the base64 that is present in this new variable to be displayed into 2nd canvas element that is present. But it does not display the base64 image using drawimage method. It works if I use say image.png

推荐答案

你不应该使用 base64 来复制画布.您可以将源画布传递给目标画布的上下文方法 drawImage.

You shouldn't use base64 to copy the canvas. You can pass the source canvas into the destination canvas' context method, drawImage.

否则您的性能将受到严重影响.在 http://jsperf.com/copying-a-canvas-element.

Otherwise you will suffer a serious performance hit. See my jsperf test at http://jsperf.com/copying-a-canvas-element.

drawImage() 将接受 Canvas 以及 Image 对象.

drawImage() will accept a Canvas as well as an Image object.

试试这个:

//grab the context from your destination canvas
var destCtx = destinationCanvas.getContext('2d');

//call its drawImage() function passing it the source canvas directly
destCtx.drawImage(sourceCanvas, 0, 0);

这篇关于使用 base64 将画布图像从一个画布显示到另一个画布的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!

本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除!

相关文档推荐

how to remove this error quot;Response must contain an array at quot; . quot;.quot; while making dropdown(如何删除此错误quot;响应必须在quot;处包含数组。创建下拉菜单时(Q;))
Why is it necessary to use `document.createElementNS` when adding `svg` tags to an HTML document via JS?(为什么在通过JS为一个HTML文档添加`svg`标签时,需要使用`Document.createElementNS`?)
How to play a base64 response from Google Text to Speech as an mp3 audio in browser using Javascript(如何使用Java脚本在浏览器中将从Google文本到语音的Base64响应作为mp3音频播放)
Its possible to merge two audio #39;base64data#39; strings to create an unique audio file?(是否可以合并两个音频字符串以创建唯一的音频文件?)
wkhtmltopdf print-media-type uses @media print ONLY and ignores the rest(Wkhtmltopdf print-media-type仅使用@media print,而忽略其余内容)
price depend on selection of radio input(价格取决于无线电输入的选择)