EyeDropper API

創造的なアプリケーションには、アプリケーション内で絵や図形から色を採取して再利用する機能があることが多いです。ウェブアプリケーションは、EyeDropper API を使うことで、ブラウザーによって提供される同様のスポイトツールを提供できます。

この API を使うと、ウェブアプリケーションはスポイトモードを開始できます。開始すると、カーソルが変わることで、ユーザーにこのモードが有効になっていることを知らせます。そして、ユーザーは画面上のどこからでも色を選択することができるし、Escape を押してスポイトモードをキャンセルすることもできます。

悪意のあるウェブサイトがユーザーに気付かれずに画面からピクセルデータを取得するのを防ぐため、EyeDropper API は以下の対策を実装しています。

• この API は、ユーザーの意図なしでスポイトモードを開始させません。EyeDropper.prototype.open() メソッドは、ユーザーの操作 (ボタンのクリックなど) への反応としてのみ呼び出すことができます。
• ピクセルデータの取得には、またユーザーの意図が必要です。EyeDropper.prototype.open() が返すプロミスは、ユーザーの操作 (ピクセルのクリック) の結果としてのみ色の値で解決します。そのため、ユーザーに気付かれずにバックグラウンドでスポイトを使うことはできません。
• ユーザーがスポイトモードにさらに気付きやすくするため、ブラウザーはこのモードを目立つようにします。短い間をおいて通常のマウスカーソルが非表示になり、かわりに虫眼鏡が出現します。スポイトモードの開始後、ユーザーがピクセルを選択できるようになるまでにも間があり、ユーザーが確実に虫眼鏡を見られるようにします。
• ユーザーはまた、(Escape キーを押すことで) スポイトモードをいつでもキャンセルできます。

• EyeDropper Experimental

• Picking colors of any pixel on the screen with the EyeDropper API
• The EyeDropper API W3C/SMPTE Joint Workshop