關於如何爲生成的地形圖製作彩色地圖的建議？

Question

我對昨天有人發佈的關於鑽石平方算法Node.js/coffeescript performance on a math-intensive algorithm的問題感興趣。

我通過調整他的代碼並希望進行下一步爲生成的數據網格生成一些顏色映射。

我最初的想法是將海洋中最深處的高度作爲我身高的範圍。海平面在2076米左右，最大高度在10924米左右（珠穆朗瑪峯爲8848米）。無論如何，所以我使用非常接近我想要的值生成我的數據網格。

我正在考慮創建一個十六進制顏色值的數組，開頭是一個黑暗的藍色到淺色的水，然後是深綠色到白色的海平面到山。我可以設置高度值的範圍以對應於顏色區域。

做這種事情的常用技巧是什麼？我認爲更具體地說，對於給定的高度值，如何在2個十六進制值之間生成特定的十六進制顏色？

Answer 1

是的，你的建議聽起來不錯。對於中間值，通常使用線性插值。下面的代碼片段展示瞭如何進行插補之間＃00＃FF方式5％（也說明您需要的轉換）：

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

很明顯，你會包裹在一個功能 - 我只是從鉻命令行剪切+粘貼，我檢查它。

[edit：]是否清楚？在上面的情況下，如果你想＃100和0m和#ff在100米，那麼這個值就是一個通道（r，g或b），我計算5米處的值。您需要在各個步驟中重複該操作，並將r g和b連接在一起。

這是另一個例子，您將從＃a0開始，從＃a0降到＃20，範圍爲50m，距離10m。請注意，我們有一個額外的減法，因爲初始值不是零。

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

所以，忽略了轉換，插值是：

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

和轉換是

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

PS我會想象processing.js具有的功能，如本已書面你，如果它有任何幫助（沒有使用它，但它是那種類型的圖書館......）