jimp-dev/jimp

Blitting uses wrong alpha compositing (generates borders)

开放

#1,072 创建于 2022年2月17日

 (1 条评论) (0 个反应) (0 位负责人)JavaScript (785 个派生)batch import
bughelp wantedsolution in issue

仓库指标

星标
 (13,218 个星标)
PR 合并指标
 (PR 指标待抓取)

描述

Expected Behavior

Currently using jimp in free-tex-packer-core. I started updating the version on npm (https://github.com/astrocreep/free-tex-packer-core) and wanted to update jimp to the current version. after some basic fixes, everything seemed fine, but i discovered some artifacts around my sprites. After digging into this, it looks like alpha compositing in the blit method is calculating wrong values. The atlas is the destination image (new Jimp with background 0x0). And then sprites are blitted onto it. I would expect that every sprite blitted on an 100% transparent image results in a composition of the the source sprites.

Current Behavior

Currently blitting pixels with alpha results in strange mixed colors on the edges

Steps to Reproduce

  1. create a new Jimp image with background 0x0
  2. take a png with a simple white filles circle with alpha borders
  3. blit this onto the jimp image
  4. save it
  5. new image will have grey pixels around the white circle

Context

There is an wikipedia article about alpha compositing: https://en.wikipedia.org/wiki/Alpha_compositing

Using the formulas there fixes the issue:

baseImage.bitmap.data[dstIdx] = ((src.r * src.a / 255) + (dst.r * dst.a * (255 - src.a) / 65025)) / src.a * 255;
baseImage.bitmap.data[dstIdx + 1] = ((src.g * src.a / 255) + (dst.g * dst.a * (255 - src.a) / 65025)) / src.a * 255;
baseImage.bitmap.data[dstIdx + 2] = ((src.b * src.a / 255) + (dst.b * dst.a * (255 - src.a) / 65025)) / src.a * 255;
baseImage.bitmap.data[dstIdx + 3] = src.a + (dst.a * (255 - src.a) / 255);

贡献者指南