画像ディザリング

3つのアルゴリズムによる違い

ディザリングは、利用できるピクセルを空間的に配置することで、少ない色から階調を表現します。FloydとSteinbergは1976年の論文An Adaptive Algorithm for Spatial Greyscaleで前方への誤差拡散を発表しました。量子化した各ピクセルの誤差を、まだ処理していない隣接ピクセルへ配分します。全体に単一のしきい値を使うより、細かく不規則な質感となり、緩やかな変化を保ちやすい方法です。

Atkinsonも誤差拡散ですが、隣接パターンと保持する誤差量が異なります。AppleはFloyd-SteinbergとAtkinsonを別々のvImageディザリング方式として掲載しています。Atkinsonはくっきりした高コントラストの結果を得やすい一方、滑らかな階調変化の一部が失われる場合があります。

Bayer 4×4は組織的ディザリングです。ピクセル間で誤差を送る代わりに、固定された4×4のしきい値行列を画像全体に繰り返します。この方式はB. E. Bayerの1973年の論文An Optimum Method for Two-Level Rendition of Continuous-Tone Picturesに由来します。目に見える規則的なパターンは、レトロなグラフィックや予測しやすい質感に適しています。

パレットとalphaの境界

モノクロは表示されるRGBを2階調に減らします。グレースケールは複数の無彩色レベルを維持し、限定色はRGBを小さな色集合へ量子化します。被写体の認識、失われた細部の再構築、新しい色の推測は行いません。出力は処理後のピクセル寸法を持つラスターであり、SVGなどのベクター作品ではありません。

ディザリング計算はRGB値だけを変更します。部分的な透明度を含め、各ピクセルの元のalphaをコピーするため、完全に透明なピクセルは透明なままです。PNG仕様は、完全な透明から完全な不透明までのピクセルごとのalphaを定義しています。JPEGにはalphaがありませんが、PNGと一部のWebP入力には含まれる場合があります。

ブラウザー処理とPNG出力

ブラウザーが選択したファイルをデコードし、ピクセルデータを読み、アルゴリズムを適用してローカルにダウンロードを作ります。画像はアップロードされず、そのバイトがLivewireリクエストやフローURLに入ることもありません。フローモードでは、タブごとに分離された一時ブラウザーストレージでローカルプロジェクトをページ間に最長2時間引き継ぎます。Resetで削除され、放置されたデータは自動的に期限切れになります。HTML Canvas仕様はピクセル読み取りとtoBlob()出力を定義し、要求された形式に未対応の場合はPNGを必須としています。

15 MiB、元画像20メガピクセル、1辺8,192ピクセルの制限はブラウザーのメモリーを保護します。小さなファイルでも大きなバッファになり得ます。出力は必要に応じて自動縮小され、最大4メガピクセルで応答性を保ちます。入力制限を超える場合は先に縮小してください。PNGは処理済みピクセルとalphaを可逆で保ちますが、メタデータ、レイヤー、ベクター要素は維持しません。