HTML5 Canvas към PNG нулира всички канали, когато е алфа прозрачен

Имам Uint32Array, който се опитвам да конвертирам в текстура за WebGL. За да направя това, записвам масива като RGBA стойности върху Canvas и получавам base64 кодиран PNG от платното, за да го изпратя като текстура.

Всеки път, когато задам стойност на пиксел да има алфа 0, съответните RGB канали също се нулират при преобразуване в PNG. Това детайл от изпълнението ли е? Ако трябваше да създам PNG в друга програма, различна от HTML5, бих ли могъл да имам (RGBA) четворка от (255,255,255,0)? Опитах се да използвам алфа стойност 1 и всички други канали остават непокътнати, така че това не е проблем с предварително умножена алфа.

Ето малко javascript код за възпроизвеждане на този ефект:

    var img = new Image();
    var canvasObj = $('<canvas width="1" height="1"></canvas>');
    var context = canvasObj[0].getContext('2d');
    var imgd = context.getImageData(0,0,1,1);
    var pix = imgd.data;
    pix[0]=255; pix[1]=255; pix[2]=255; pix[3]=0;
    context.putImageData(imgd,0,0);
    img.src = canvasObj[0].toDataURL("image/png");

    context.drawImage(img,0,0);
    var imgd2 = context.getImageData(0,0,1,1);
    var pix2 = imgd2.data;

pix2 ще бъде само 0s.

Благодаря!


javascript png html5-canvas
person fuzic    schedule 22.07.2012    source източник

Отговори (1)


arrow_upward
3
arrow_downward

Изглежда, че е част от PNG спецификацията (http://www.libpng.org/pub/png/spec/1.2/png-1.2-pdg.html).

...на всички напълно прозрачни пиксели трябва да се присвои една и съща цветова стойност за най-добро компресиране.

Не можах да намеря директен източник, но изглежда, че тази конкретна реализация настройва всички канали на нула.

person Bill    schedule 22.07.2012
comment
Имаше и друг проблем. Очевидно, когато генерирате PNG от Canvas с алфа без предварително умножение, той първо умножава алфата, след това разделя алфата (защо не знам). - person fuzic; 25.07.2012
comment
@Bill И те твърдят, че компресията без загуби! Очевидно е компресия със загуби, когато смесвате канали по този начин, когато записвате данни. - person user877329; 01.07.2014