关于如何为生成的地形图制作彩色图的建议？
我对昨天有人发布的有关钻石方形算法的问题感兴趣，Node.js/coffeescript 在数学密集型算法上的性能。
我继续调整他的代码，并希望下一步为生成的数据网格生成一些颜色图。
我最初的想法是以海洋最深点到珠穆朗玛峰的高度作为我的身高范围。这使得海平面约为 2076m，最大高度约为 10924m（珠穆朗玛峰为 8848m）。无论如何，所以我正在生成数据网格，其值非常接近我想要的值。
我正在考虑制作一系列十六进制颜色值，从深蓝色到浅色的水开始，然后从深绿色到白色的海平面到山脉。我可以设置高度值的范围以对应于颜色区域。
做这种事情的常用技巧是什么？我想更具体地说，如何在给定高度值的 2 个十六进制值之间生成特定的十六进制颜色？
I got interested in this question someone posted yesterday about diamond-square algorithms, Node.js / coffeescript performance on a math-intensive algorithm.
I followed through with adapting his code and want to take the next step in generating some color maps for the resulting data grid.
My initial thoughts were to take the deepest point in the ocean to the height of Everest as my height ranges. That puts sea level at about 2076m and max height at around 10924m (Everest is 8848m). Anyway, so I'm generating my grid of data with values that are pretty close to what I want.
I was thinking of making an array of hex color values starting with say a dark shade of blue to light shade for water, then a dark green to white for sea level to mountains. I can setup ranges of height values to correspond to regions of color.
What are the common techniques for doing this kind of thing? I think more specifically, how do you generate a specific hex color between 2 hex values for a given height value?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
是的，你的建议听起来不错。对于中间值，通常使用线性插值。下面的代码片段显示了如何在 #00 和 #ff 之间插入 5%（并且还显示了您需要的转换）：
显然，您可以将其包装在一个函数中 - 我只是从 chrome 命令剪切+粘贴我检查过的行。
[编辑：] 清楚了吗？在上面的情况下，如果您想要 #00 和 0m 以及 100m 处的 #ff，我将计算 5m 处的值，其中该值仅适用于一个通道（r、g 或 b）。您需要对各个步骤重复此操作，并将 rg 和 b 连接在一起。
这是另一个示例，您要在距离 #a0 50m、10m 的范围内从 #a0 下降到 #20。请注意，我们有一个额外的减法，因为初始值不为零。
所以，忽略转换，插值是：
转换是
ps 我想processing.js已经为你编写了这样的函数，如果它有任何帮助的话（没有使用它，但它是那种库......）
yes, what you suggest sounds good. for in-between values, typically you use linear interpolation. the following snippet shows how to interpolate 5% of the way between #00 and #ff (and also shows the conversions you need):
obviously, you'd wrap that in a function - i'm just cut+pasting from a chrome command line where i checked it.
[edit:] is that clear? in the case above, i'm calculating the value at 5m if you want #00 and 0m and #ff at 100m, where the value is just for one channel (r, g or b). you'd need to repeat that for various steps, and join r g and b together.
here's another example where you're going from #a0 down to #20 over a range of 50m, 10m from #a0. note that we have an extra subtraction because the initial value isn't zero.
so, ignoring the conversion, the interpolation is:
and the conversions are
ps i would imagine that processing.js has functions like this already written for you, if it's any help (not used it, but it's that kind of library...)