Javascript 将三维点转换为二维点？

鉴于：

我试图在一个3D矩形中表示这些点，我有3D矩形的宽度、高度和深度。这里，投影类型是正交的，是笛卡尔坐标系

通过将p1和p2转换为2D，我想画一条线

你知道怎么做吗

这是图片

---

我使用了以下几点，因为它们更容易使用：

p1=（50100,0）
p2=（200250,50）

要创建三维矩形（立方体），您需要完成以下几个步骤：

• 将这两点转换为立方体的角点。例如，右前下角的前部和底部坐标为

  p1

  ，水平坐标为

  p2

• 将投影公式用于正交投影。在最简单的形式中，您可以使用：

2D-3D
x=x+z
y=y-z

• 组成立方体的线条，例如底部前水平线等

---

我不知道ActionScript，但这里有一个概念证明可以帮助您：。

您正在寻找的是一个。它比更一般的更容易理解，尽管您可能也希望了解这一点

理解正交投影的直观方法：3d坐标系中的每个轴（例如，示例中的H、W和D轴）在屏幕坐标中都有一个2d方向向量（即，用于绘图的

（x、y）

坐标）：

要理解这些方向向量的含义：如果您绘制H轴，并用TIC标记为

（H=0，H=1，H=2，…）

，则

hx

是连续TIC之间的x坐标差，

hy

是连续TIC之间的y坐标差。因此，您可以通过使用任何轴的方向向量来更改其方向和比例（与其他轴无关！）

一旦您选择了原点和方向向量，您就可以计算屏幕坐标

（x，y）

，如下所示：

let:  H-axis direction vector = (hx, hy)
      W-axis direction vector = (wx, wy)
      D-axis direction vector = (dx, dy)

and:  origin screen position = (ox, oy)

此公式的高度规则乘/加结构基本上是：

---

可能重复为什么你不能只取X和Y，而不取Z。所以p1是（-10,2）p2是（-20，-2）我想这就是你要找的，但不确定@shaunhusain，从这个链接理解起来很复杂。如果我将pimvdb提供的JS转换成AS3，任何直接公式都会有帮助，这会被认为是解决您问题的方法吗？我想我可以很容易地移植它。谢谢，它对我不起作用。我正在尝试将这两点添加到三维笛卡尔矩形中！将它们添加到一个矩形中？对不起，但这并不能真正说明问题。你有一个清晰的（视觉）的想法，你到底要实现什么？Q是编辑，我添加了矩形的图像。请。看看它，我认为我们非常接近，当你说，H轴向量=（hx，hy），hx=最小值hy=轴的最大值？正确的。我们可以在聊天室聊几分钟吗？不，

（hx，hy）

是H轴指向的方向。如果绘制H轴，并用记号标记它（H=0，H=1，H=2…），则

hx

是连续记号的x坐标差，

hy

是连续记号的y坐标差。所以，你可以通过摆弄它的方向向量来改变任何轴的方向和比例（独立于其他轴！）。我不明白，hx和hy，你怎么知道轴的方向和比例。我已经上传了通过编辑Q，其中显示记号标记的图像。从这张图片中，你能帮我找到这些值吗：）我已经编辑了我的答案，添加了我的上述解释。我还创建了一个聊天室供进一步讨论，名为“正交投影”

let:  H-axis direction vector = (hx, hy)
      W-axis direction vector = (wx, wy)
      D-axis direction vector = (dx, dy)

and:  origin screen position = (ox, oy)

      x = H * hx + W * wx + D * dx + ox
      y = H * hy + W * wy + D * dy + oy

[ x y ]  =  [ H W D 1 ] * [ hx hy ]
                          [ wx wy ]
                          [ dx dy ]
                          [ ox oy ]