Bir tuval TÜM içeriğini kopyalamak ve bunları tüm istemci tarafı aktarmak istiyorum. canvas.toDataURL() context.drawImage() Bu yöntemi uygulamak için kullandığım gibi düşünürdüm ama bir kaç sorun haline çalıştırıyorum.

Benim Çözüm Canvas.toDataURL() almak olacaktır ve Javascript Görüntü nesne market ve sonra context.drawImage() yöntemi geri koyun.

Ancak, toDataURL yöntemi "data:image/png;base64," 64 bit kodlanmış bir etiket olan " e döndürür inanıyorum. Bu geçerli bir etiket, (her zaman bu kaldırmak için bazı Düzenli kullanabilirim) görünmüyor, ama 64 bit "data:image/png;base64," geçerli bir görüntü dizeden SONRA bir dize kodlanmış? image.src=iVBORw...ASASDAS, der ve bu geri tuval üzerine çizebilir miyim?

Bazı ilgili konulara baktım: Display canvas image from one canvas to another canvas using base64

Ama çözüm doğru gibi görünmüyor.

Teşekkürler!

Aslında bir imaj yaratmak zorunda değilsiniz.

drawImage() Canvas olarak Image bir nesne kabul eder.

Bunu deneyin:

//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);

hepsi bu!

Yolu ImageData bir nesne ya da Image eleman kullanarak daha hızlı.

İşte bu bir tuval klonlamak için tek doğru yol olduğunu neden göstermek için bir jsPerf: http://jsperf.com/copying-a-canvas-element