javascript - JavaScript 中的 2D/3D CAD 设计

Question

我在 microstation 中进行 2D 设计，我想使用任何工具(javascript/Unity 3D 或任何其他工具)在 web 中表示此设计，其中 web 工具不具备所有功能，但具有基本功能，如 reshape 或添加新的形状应该可用。

截至目前，我的方法是一旦我在 microstation 中创建了一个设计，然后我捕获形状的属性，比如一条线的坐标，现在使用我想在浏览器中表示的这些坐标，因为这是一个 2D 设计，所以它将在某个位置 (x,y) 绘制，例如我在 microstation 中创建了一条从 (2,2) 到 (10,10) 的线，所以它将是一条直线，并且我拥有我尝试重绘它的所有坐标Unity 能够做到，但我面临通过鼠标单击将长度从 (2,2) 更改为 (20,20) 的问题。我的目标是在运行时完成，而不是在 Unity 编辑器工具中完成。

这是我想为所有几何形状做的直线示例，任何指导将不胜感激。

截至目前，我正在尝试使用 Unity 这样做，但在编辑部分遇到了困难，有没有办法在统一中实现这一点？

我还查看了各种 javascript 库，如 konvaJS、makerJS、ThreeJS 等。但除了 konvajs 之外，其他库都没有提供 reshape 等功能，在 Konva 中也使用鼠标创建形状，但没有找到任何解决方案。

我们能否通过这两种方法中的任何一种来实现这一目标，当然，我不是在寻找所有功能，只是寻找一些自定义功能，如果是的话，哪种方法最好，我应该继续使用哪种工具？任何指导都会有所帮助。

Answer 1

绘制线段，可以使用LineRenderer .

//two points of the line-segment are known (or got from the Transform of GameObject)
Vector3 start;
Vector3 end;

GameObject myLine = new GameObject();
myLine.transform.position = start;
myLine.AddComponent<LineRenderer>();
LineRenderer lr = myLine.GetComponent<LineRenderer>();
lr.material = new Material(Shader.Find("Particles/Alpha Blended Premultiply"));
lr.SetColors(color, color);
lr.SetWidth(0.1f, 0.1f);
lr.SetPosition(0, start);
lr.SetPosition(1, end);

//to change the points of this line
myLine.transform.position = another_start;
lr.SetPosition(0, another_start);
lr.SetPosition(1, another_end);

还有其他解决方案:

• 使用缩放立方体或胶囊基元。
• 第 3 方插件:vectrosity

---

要获得鼠标点击的位置，请使用 Camera.main.ScreenToWorldPoint(Input.mousePosition)。

要确定何时单击鼠标，请使用 Input.GetMouseButtonUp .