关于如何为生成的地形图制作彩色地图的建议
Suggestions on how to make a color map for a generated terrain map?
我对昨天有人发布的关于菱形方算法的问题很感兴趣,Node.js/coffeescript在数学密集型算法上的性能。
我遵循了他的代码,并想采取下一步为生成的数据网格生成一些颜色映射。
我最初的想法是把海洋中最深的点到珠穆朗玛峰的高度作为我的高度范围。这使得海平面约为2076米,最大高度约为10924米(珠穆朗玛峰为8848米)。总之,我生成的数据网格的值非常接近我想要的。
我正在考虑制作一个十六进制颜色值数组,从深蓝色到浅色的水开始,然后是深绿色到白色的海平面到山脉。我可以设置高度值的范围,以对应于颜色区域。
做这种事情的常见技术是什么?更具体地说,如何在给定高度的2个十六进制值之间生成特定的十六进制颜色?
是的,你的建议听起来不错。对于中间值,通常使用线性插值。下面的代码片段展示了如何在#00和#ff之间插入5%的方式(还显示了您需要的转换):
> ("00" + Math.floor(parseInt('00',16) + 5 / 100 * parseInt('ff',16)).toString(16)).slice(-2)
"0c"
显然,你会把它包装在一个函数中-我只是从我检查过的chrome命令行中剪切+粘贴。
[edit:]明白了吗?在上面的例子中,我正在计算5m的值,如果你想要#00和0m, #ff在100m,其中的值只是一个通道(r, g或b)。你需要在不同的步骤中重复,并将r g和b连接在一起。
这是另一个例子,你从#a0到#20的范围是50米,从#a0到10米。注意,我们有一个额外的减法,因为初始值不是零。
> ("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已经为你写了这样的函数,如果它有任何帮助(没有使用它,但它是那种库…)
相关文章:
- 谷歌地图固定位置覆盖
- 不显示带有本地json文件数据的谷歌地图脚本
- 谷歌地图不是以HTML显示,而是在JS Fiddle上工作
- 谷歌地图标记不会显示
- 无法在JS中显示谷歌地图
- 科尔多瓦页面类应用程序中的多个谷歌地图
- 需要帮助谷歌地图方向面板在FancyBox中显示
- 是否可以控制获取哪些Google地图脚本(JavaScript API)
- 在谷歌地图上获取事件的x,y坐标
- 谷歌地图API v3不适用于移动浏览器或PhoneGap
- 模拟谷歌地图中的点击
- 如何知道哪个标记被谷歌地图点击了
- 谷歌地图JS API+JSON-多个标记没有显示
- 缓存谷歌地图数据
- 谷歌地图劫持了iphone's滚动(触摸事件)-如何恢复
- 在谷歌地图v3中制作彩色地图
- 彩色地图在100%的情况下不工作
- 关于如何为生成的地形图制作彩色地图的建议
- 如何样式谷歌地图作为一个双色调彩色地图
- 谷歌地图分为彩色区域和子区域