HTML5 Canvas.todataurl dosya boyutuna javascript'te nasıl erişilir?

Question

var data_url = canvas.toDataURL ("image/png");

var img = $ ("# img"). Attr ("src", data_url);

kb içinde img dosya boyutu nedir?

Answer 1

Eğer bayt veri url boyutunu bilmek istiyorsanız yapabileceğiniz:

var imgFileSize = data_url.length;

Ama bu png boyutu gerçek boyutu değil. Gerçek PNG boyutuna çok doğru bir bu tarafa yaklaşık olarak belirleyebilir:

var head = 'data:image/png;base64,'; 
var imgFileSize = Math.round((data_url.length - head.length)*3/4) ; 

Base64 kodlama bir 4/3 yüke sahiptir çünkü.

Düzeltme:, yorumun ardından boyut hesaplamasını düzeltildi.

doğru Pedro'nun çözümü, ne ben yaptım

canvas.toBlob(function(blob){ 
    alert(blob.size); 
}); 

canvas.toBlob şu anda bir çalışma taslağı olduğunu FILESIZE olsun sonra tuval dışında bir damla oluşturmak ve etmek olduğunu

Answer 2

ı bulamadık, ama i bir pollyfill

i canvas.mozGetAsFile da işe yarayabilir kullanılan, ama

Answer 3

her karakter 6 bit (2^== 64 temsil etmesidir düşünmek iyi yolu test değil bundan dolayı Taban). Yani, toplam bit sayısını elde etmek için 6'ya kadar sahip olduğunuz karakter miktarı. Daha sonra bayt miktarı elde etmek için toplam bit sayısını 8'e bölün, çünkü bayt 8 bittir. Math.round(base64String.length * 3/4); aynıdır

Math.round(base64String.length * 6/8);

.