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

标签 javascript unity-game-engine three.js konvajs microstation

我在 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 中也使用鼠标创建形状,但没有找到任何解决方案。

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

最佳答案

绘制线段,可以使用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 .

关于javascript - JavaScript 中的 2D/3D CAD 设计,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57264440/

相关文章:

javascript - 在前端解析 HTML 是一种不好的形式吗?

android - Unity Tilt Shift Shader 在移动设备 (Android) 上的视觉效果不佳?

c# - 求两个向量之间的斜率(以度为单位)

c# - 获取对象在世界空间中的开始和结束位置

reactjs - TS 表达式产生的联合类型太复杂,无法用 Material-UI 和 @react-three/fiber 表示

javascript - 如何选择类名为 "nav"的 <ul> 中的所有 <li> ?

javascript - 旁边菜单示例中的错误

javascript - 如何将数组值插入对象?

three.js - 在 Three.js 中更改对象父级?

javascript - 无法在 ThreeJS 场景上加载 blender 模型未定义