問題タブ [hsl]

C++ で非常に基本的なグラフィックス API の一部として Color クラスを作成しています。そこで、Microsoft の .NET フレームワークを調べてみることにしました。Microsoft の Color クラスに HSB 用の関数があることに気付きました。

次に、クラスで HSB、HSL、HSV、またはそれらすべてを提供する必要があるかどうかを判断するための調査を開始しました。

HSB、HSL、HSV について 3 つの質問があります。

1. HSBはHSLと同じですか？

2. そうでない場合、HSBL や HSBLV がないのはなぜですか?

3. これらの値を計算するさまざまな方法を見つけましたが、最速のものを教えてもらえますか?

Adobe Illustrator でデザインするときは、色を選んでその明るさや彩度を調整し、「同じ系統」の似たような色にするのが好きです。

CSS では、次のような種類の値で色を定義できます: RGB、RGBA、HSL... 3 つのパラメーターすべてを同時に定義できるため、私は長い間疑問に思っていました:それらの？

たとえば、非常に「きれいな」色 #FF0000、#00FF00、および #0000FF を持つ 3 つのリンクを定義するとします。「色に関係なく、すべてのリンクをホバーすると、明るさ/明るさを 10% 下げる」という単一の CSS ルールを作成することは可能でしょうか?

RGBAカラーのアルファパラメータでも同じことをしたいと思っています。すべての色に無差別に影響を与えるために私が知っている唯一の一般的な方法は opacity プロパティですが、背景に影響を与えたいだけの場合は問題になります。

そのようなこと (H、S、または L のみに影響を与える) は、かなり簡単に実行できるように思えます。色全体を再定義できる場合、同じ色をもう一度取得して、その値の 1 つを変更することはできませんか? しかし問題は、誰かが実際にそれを行う方法を考えたことがありますか?

要素が 100% の彩度、不透明度などであると仮定すると、ホバーしたときに背景を少し明るくするにはどうすればよいですか?

ユースケースは、ユーザーがページ上の任意の要素にカーソルを合わせることができるようにすることです。各色が 80% の不透明度に相当するかどうかを判断したくありません。

1つの方法はを変更することopacity: 0.4ですが、背景だけを変更したいです。

d3 で構築された標準の 50 州マップがあり、さまざまなデータセットに従って州を動的に色付けしています。データセットが何であれ、値は 0 から 1 のスケールで正規化されます。1 は最高値を持つ州に対応します。正規化されたデータ ポイントの値を使用して状態の陰影を計算する方法を探しています。

過去に、好きな基本色 (たとえば #900) を選択しfill、各状態の をその色に設定opacityし、 を正規化された値に設定しました。これは、2 つの問題を除けば問題なく機能します。

• キャンバスに背景色がある場合、すべての陰影状態の下に空白の白い状態を描画する必要があります。と
• この方法で色をフェードアウトすると、ペースト状に見えることがあります

しかし、データのビンやグラデーションの RGB 値のプリセット配列を処理するよりも、色を動的に設定できることが本当に気に入っています。そこで、何か良い方法がないか検討中です。別のカラー システムがうまく機能する場合は、変換を処理できます。

d3にはHSLコンバーターが組み込まれているので、これを試しました：

これは問題なく動作します -- これは、メイン州とオレゴン州で最も普及している釣りの仕事の地図です -- しかし、もっと良い方法があると思います. アイデア？

HSL 値はおそらく虹の中を循環し、色相のことわざの配列 (ROYGBIV) には 7 つの基本色があるため、0 から 360 までの各色間の距離は 51 または 52 である必要があります。期待するものに対応しますか？

HTML

CSS

http://jsfiddle.net/NvTvr/を参照

おそらく、正規の色が互いに等距離にあるという仮定は誤りでした。もしそうなら（そしてそうであるように見える）、真の青（および他のギャングの残り）の受け入れられた色相値は何ですか？

肉眼では、オレンジは 30 程度、黄色は 60 程度です。残りはそのままで大丈夫です。

アップデート

これらの値 (0、25、50、100、200、250、300) は、これらの色の名前を聞いたときに私が考えるものに似ています。

http://jsfiddle.net/NvTvr/2/

更新 2

今回はジョンの値を使用して、もう一度いじりました：http://jsfiddle.net/NvTvr/7/

ここのコードで hsl カラー値を使用するのに苦労しています...私の目標は、座標のインデックスがデータセットで発生する頻度に基づいて、画像内のピクセルの不透明度を変更することです。csv ファイルからデータを取得していますが、無効な hsl 構文を使用しているという唯一のエラーが表示されます。ここに私のコードのセクションがあります:

PIL の Web サイトから、明度と彩度はどちらもパーセンテージでなければならないと仮定しました。row[1] の最大値は 999 なので、不透明度が 1 を超えることはありません。よろしくお願いします。

たとえば、カラーピッカーで使用される彩度+明るさのマスクを生成できるかどうかを知りたい( http://johndyer.name/lab/colorpicker/refresh_web/colorpicker/images/map-hue.pngのようなもの) ) しかし、css3 で線形グラデーションのみを使用していますか? 次のようないくつかのことを試しました：

でも、写真のようなものは作れないし、組み合わせも見つからないし、よくわからないので、それが可能かどうかもわかりません。

ありがとう

HueRotate、Saturation、Brightness などの CSS Filter メソッドを使用して、完全に白く描画された PNG の色を変更することは可能ですか? Photoshop のカラー オーバーレイ効果に似ていますが、CSS です。

これは、色だけを変更する画像を大量に作成しないようにするための良い解決策です。たとえば、UI の暗いバージョンと明るいバージョンを持つアイコンのセット。