1. ホーム
  2. macos

[解決済み] クロームでのSVGバンディング

2022-02-18 08:52:36

質問

svgファイルを使って滑らかなグラデーションを作成しているのですが、Google Chrome(20)で深刻なバンディングの問題が発生することに気づきました。さらに不思議なことに、クロームを私のシネマディスプレイ上に移動させると、バンディングが著しく減少し、これがさらに奇妙なことになっています。以下は、ウェブサイトが私のMBPのネイティブスクリーン(左)とシネマディスプレイ(右)にまたがっているときに撮影した単一のスクリーングラブ(全くフォトショップなし)です。 ご覧の通り、左の方がバンディングが激しいです。さらに不思議なことに、サファリやFF、IE9ではバンディングがほぼゼロです。以下は、FFで同じ状況を表示したものです。

これはドライバーの問題などではないかという気がしています。でも、本当に知りたいんです。一体何が起こっているのか?なぜ、画面によってこんなに表示が違うのだろう?また、このようなバリエーションは、両方のモニターで1つの画面を取り込むと、どのように発生するのでしょうか?

また、FFウィンドウの位置によってレンダリングが変わることにも今気づきました。ウィンドウの半分以上がネイティブ ディスプレイにある場合、シネマ側にはバンディングが発生しますが、ネイティブ側には発生しません。ウィンドウの半分以上がシネマディスプレイ上にあるようにウィンドウを移動すると、バンディングショーはシネマ側で消え、ネイティブ側で表示されます。これはサファリでも同様ですが、クロームではこの動作はなく、バンディングは常にネイティブ側でより顕著になり、シネマ側ではあまり目立ちません。

これは本当に気味が悪いです。一体どうなっているのでしょうか?

解決方法は?

モニターを切り替えたときの現象がよくわかりません。

Firefoxでバンディングが軽減されるのは ディーターリング ピクセルが次の色にこぼれて、ランダムになります。帯状のグラデーションの上にぼかしを追加するようなものです。

このように拡大すると、もっとわかりやすいかもしれませんね。

左がFirefox、右がWebkitです。Firefoxはディザリンググラデーションをサポートしていますが、Webkitはサポートしていないようです。残念ですが、どうしようもありません。