六边形网格坐标转换为像素坐标

53

我正在使用一个六边形网格。我选择使用这个坐标系统是因为它非常优雅。

grid

这个问题讨论了生成这些坐标本身的方法,非常有用。我的问题现在在于将这些坐标转换为实际像素坐标和从实际像素坐标转换为六边形坐标。我正在寻找一种简单的方法来找到具有坐标x,y,z的六边形的中心。假设像素坐标中(0,0)在六边形坐标中为(0,0,0),并且每个六边形的边长为s。对我而言,x,y和z似乎应该分别沿轴线移动我的坐标一定距离,但它们以我无法理解的方式相互关联。

如果您能够反向操作并将任何(x,y)点转换为所属的六边形,则可以获得奖励积分。


这个页面有一些公式,可能对你有用: http://www.cs.sunysb.edu/~skiena/392/lectures/week12/ - Roberto Bonvallet
没关系,我的数学计算错了。为了让它正常工作,轴必须旋转∠π/6。 - Ignacio Vazquez-Abrams
1个回答

49

为了更加清晰明了,我们将“六边形”坐标称作(r,g,b),其中rg、和b分别代表红色、绿色和蓝色的坐标。 坐标(r,g,b)(x,y)之间存在以下关系:

y = 3/2 * s * b
b = 2/3 * y / s
x = sqrt(3) * s * ( b/2 + r)
x = - sqrt(3) * s * ( b/2 + g )
r = (sqrt(3)/3 * x - y/3 ) / s
g = -(sqrt(3)/3 * x + y/3 ) / s

r + b + g = 0

推导:

  • 我首先注意到任何一个六边形的水平行(应该有一个恒定的y坐标)都具有恒定的b坐标,因此y仅取决于b。每个六边形都可以分成六个边长为s的等边三角形;一行中的六边形的中心比下一行的中心高/低一个半边长(或者更容易看到的是,相邻两行之间的中心高/低3个边长),因此对于b的每个变化1y变化3/2 * s,得出第一个公式。通过用y表示b并解出b,得到第二个公式。

  • 具有给定r坐标的六边形的所有中心都位于垂直于r轴的线上,在距离原点3/2 * s处与r轴相交(类似于上面以b为自变量推导y的方法)。r轴的斜率为-sqrt(3)/3,因此垂直于它的线的斜率为sqrt(3);在r轴和该线上的点的坐标为(3sqrt(3)/4 * s * r, -3/4 * s * r)。因此,包含具有r坐标的六边形中心的直线的x和y方程式为y + 3/4 * s * r = sqrt(3) * (x - 3sqrt(3)/4 * s * r)。使用第一个公式替换y并解出x得到第二个公式。(这不是我实际推导这个公式的方法,但是我的推导是基于图形的、需要大量试错的,而这种代数方法更加简洁。)

  • 具有给定r坐标的六边形集合是具有该g坐标的六边形集合的水平镜像,因此无论x坐标相对于rb的公式是什么,将r替换为g后该公式的x坐标将是相反的。这给出了第三个公式。

  • 第四和第五个公式来自使用第二个公式替换b并解出rgxy

  • 最后一个公式来自观察,通过先前的公式进行代数验证。


4
顺便提一下,任意两个 r、g 和 b 中的数值就足以确定一个唯一的六边形 / 点。 - Isaac
@CaptnCraig - 编辑添加了如何获取这些公式的说明。 - Isaac
2
@Jason S:不,y有一个公式(仅取决于b),但x有两个公式,一个使用b和r,另一个使用b和g。 - Isaac
@Abdel5 我不知道。什么是平顶坐标? - Isaac
我在这里创建了另一个类似的问题,涉及到平顶标题坐标:https://dev59.com/AI_ea4cB1Zd3GeqPP5CI - Abdel5
显示剩余5条评论

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接