生成された地形図のカラーマップを作成するにはどうすればよいですか？

Question

私は昨日ダイアモンド・スクエアアルゴリズムについて投稿したこの質問に興味がありました。Node.js/coffeescript performance on a math-intensive algorithm。

私は彼のコードを順応させ、結果のデータグリッドのためのいくつかのカラーマップを生成する次のステップを踏みたいと思います。

私の最初の考えは、エベレストの高さまで海の最も深いところを私の高さの範囲にすることでした。海面は約2億7600メートル、最高高度は約10924メートル（エベレストは8848メートル）です。とにかく、私は私が望むものにかなり近い値でデータのグリッドを生成しています。

私は、水色は濃い青色から暗い色調、次に海面は山になるには濃い緑色から白色の暗い色調の配列を作ることを考えていました。私は色の領域に対応する高さの値の範囲を設定することができます。

このようなことを行う一般的な方法は何ですか？私はより具体的には、どのように特定の高さの値の2つの16進数の間に特定の16進数の色を生成すると思いますか？

Answer 1

はい、あなたの提案は良いと思います。中間値の場合、通常は線形補間を使用します。次のコードは、（必要な変換を示しても）＃00と＃FFの間の道の5％を補間する方法を示しています。

明らか

> ("00" + Math.floor(parseInt('00',16) + 5/100 * parseInt('ff',16)).toString(16)).slice(-2) 
"0c" 

、あなたは関数内でそれをラップしたい - 私はよだけ私はそれをチェックしたクロムのコマンドラインから切り取り+貼り付けをしました。

[編集：]それは明確ですか？上記の場合、＃00と0mが必要な場合は5m、100mの場合は#ffを計算しています。値は1つのチャンネル（r、gまたはb）だけです。さまざまなステップでそれを繰り返す必要があり、rgとbを一緒に参加させる必要があります。

ここでは、＃a0から＃50までの50m、10mの範囲で＃a0から＃20に行く別の例を示します。初期値はゼロではないので、余分な減算があることに注意してください。

start_value + (distance_from_start/total_distance) * (end_value - start_value) 

と私はprocessing.jsはすでにのために書かれた、このような機能を持っていることを想像変換が

decimal_int = parseInt(hex_string, 16) 
hex_string = decimal_int.toString(16) 

PSです：

> ("00" + Math.floor(parseInt('a0',16) + 10/50 * (parseInt('20',16) - parseInt('a0', 16))).toString(16)).slice(-2) 
"86" 

ので、変換を無視して、補間がありますもしあなたが助けがあれば（それは使われていませんが、それはその種類のライブラリです...）