JavaScript中的二维/三维CAD设计

Question

我在微站中有2D设计，我想用任何工具(javascript/Unity3D或任何其他工具)来表示这个设计，其中web工具不会有所有的功能，但是基本的功能，比如重塑或添加一个新的形状应该是可用的。

到目前为止，我的方法是，一旦我在微站中创建了一个设计，那么我就会捕获一些形状的属性，比如直线的坐标，现在使用我想在浏览器中表示的这些坐标，因为这是一个2D设计，所以它将被绘制在某个位置(x，y)，例如，我已经在微站中创建了一条从(2,2)到(10,10)的线，所以它将是一条直线，并且我尝试在联合中重绘它的所有坐标，但我面临的问题是通过鼠标单击将长度从(2,2)更改为(20,20)。我的目标是在运行时，而不是在统一编辑器工具中这样做。

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

到目前为止，正在尝试统一，但在编辑部分挣扎，是否有办法在统一中实现这一点？

我还查看了各种javascript库，如konvaJS、makerJS、ThreeJS等，但除了konvajs之外，其他库都没有提供像creating这样的工具，在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);

还有其他解决办法：

• 使用缩放立方体或胶囊原语。
• 第三方插件：向量化

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

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