基于Web的三维设计协作框架及其在产品开发中的应用

þHOS T E D B Y可在www.sciencedirect.com网站上查阅计算设计与工程学报2（2015）148www.elsevier.com/locate/jcde一种基于Web的协作框架，用于促进3D设计开发过程中的Purevdorj Nyamsurena，b，Soo-Hong Leea，n，Hyun-Tae Hwanga，Tae-JooKimaa韩国首尔西大门区延世路50号延世大学机械工程系b蒙古科技大学技术力学系，8 horoo，Baga-toiruu，Sukhbaatar区。蒙古乌兰巴托接收日期：2014年12月28日;接收日期：2015年2月22日;接受日期：2015年2月23日2015年3月18日在线发布摘要日益激烈的竞争挑战迫使企业寻找更好的方法，以更快地将其应用程序推向市场分布式开发环境可以通过支持并行活动来帮助公司缩短上市时间。尽管如此，这样的环境在产品开发过程中的实时通信和实时协作方面仍然有其局限性。本文介绍了一种基于Web的协同框架，已开发支持决策的三维设计开发过程。本文描述了用于讨论的3D设计文件，该文件包含其表面上的所有相关注释及其在用户界面上的可视化，以便进行设计更改。该框架包括原生CAD数据转换模块、基于三维数据的实时通信模块、三维数据的修改控制模块以及数据存储、数据管理等子模块我们还讨论了项目中提出的一些问题以及正在采取的解决措施。&2015 年 CAD/CAM 工 程 师 协 会 。 由 Elsevier 制 作 和 主 持 。 这 是 一 个 在 CC BY-NC-ND 许 可 证 下 的 开 放 获 取 文 章（http://creativecommons.org/licenses/by-nc-nd/4.0/）。关键词：决策;分布式环境;三维数据可视化;版本控制; WebGL1. 介绍传统的计算机辅助设计（CAD）和产品生命周期管理（PLM）工具在支持快速上市、协作产品开发环境方面存在局限性[1]。如今，产品开发是基于网络的协作过程的结果，因为大多数项目需要具有不同能力的地理分布的专家组之间的合作[2]。在分布式开发过程中大多数设计错误是由于分布式设计团队和制造专家之间缺乏沟通。分布式信息系统框架已应用于协同产品设计系统，n通讯作者。联系电话/传真：82 02 2123 2823。电子邮件地址：shlee@yonsei.ac.kr（S.- H. Lee）。同行评审由CAD/CAM工程师协会负责。分为三种主要方法：Web服务，远程服务和远程存储库[3]。基于Web服务的框架相对于基于远程服务和远程存储库的框架具有优势，并且它们设计、实现相对简单，降低了软件安装成本，并且具有协同工作的能力[3，4]。各种基于Web服务的PLM应用程序已在工业中使用[5]。本质上，这些应用程序只管理可以存储在数据库表中的信息，或者管理不同类型的图纸和物料清单[6]。产品生命周期管理和协作工具缺乏集成导致大型工业项目中的问题日益严重。通过基于Web的协作框架开发的3D设计的决策过程使用非正式的通信形式，如实时聊天和视频会议。然而，在使用网络技术的决策过程中，设计变更和设计错误的可视化存在一些缺点。此外，在3D表面上标记误差存在可能的局限性http://dx.doi.org/10.1016/j.jcde.2015.02.0012288-4300/2015 CAD/CAM工程师协会。&由Elsevier制作和主持。这是一个在CC BY-NC-ND许可证下的开放获取文章（http://creativecommons.org/licenses/by-nc-nd/4.0/）。P. Nyamsuren等人/计算设计与工程学报2（2015）148149并通过标注的方式向协同设计者发出警报。这些缺点导致协作工作复杂化，决策时间更长。这项工作介绍了一个新的基于Web的框架，以促进决策的三维设计开发过程。该框架包括以下功能：三维数据表面的标注、三维设计之间的修改控制、文本和二维图像文档的实时协作、文本聊天和视频会议。本文的结构如下：第2总结了框架的体系结构和实现技术，第3节演示了框架功能，第4节演示了案例研究。结论和未来的贡献列于第5。2. 系统架构2.1. 整体结构图1示出了用于促进关于3D设计过程的决策的协作框架的结构。该框架包括：（1）三维设计模块，（2）数据管理模块，（3）实时通信模块。设计服务器包含商业CAD程序的STL转换器API（应用程序编程接口）和3D Java对象的转换器。通过数据管理，利用MySQL数据库和PHP服务器实现文件上传、下载、用户认证、数据修改、数据存储访问等功能module.此外，3D设计和可视化相关的JavaBean代码位于主Web服务器上。客户端java applet包括基于Web的3D文件可视化功能、差异可视化功能和3D注释功能。这些函数是通过基于JavaScript的WebGL技术生成的。实时通信模块包括文本聊天服务器和视频会议服务器。视频和文本聊天等服务器通过名为Node.js的开源生成这种实时通信模块的活动分离的优点是，一个系统可以继续工作，而不管另一个系统的可持续活动是否由于过载而中断。实时通信模块包括文本聊天服务器和视频会议服务器。视频和文本聊天等服务器通过名为Node.js的开源生成这种实时通信模块的活动分离的优点是，一个系统可以继续工作，而不管另一个系统的可持续活动是否由于过载而中断。在大多数PLM系统中，用户能够看到修改版本的信息，作为“文本数据类型”的修复设计数据文件。通过使用这个基于Web的框架，它是可能的，使三维可视化的产品几何形状的变化，也可以纠正必要的部分的三维数据，通过进行注释和显示实时协作用户。用户使用文本聊天和视频会议功能相互通信。3D模型上的决策相关文件存储在数据存储器中。图1.一、基于Web的决策系统的结构150P. Nyamsuren等人/计算设计与工程学报2（2015）148此外，所有注释和笔记都与添加注释的文档历史记录一起存储。2.2. 实施技术Web技术已被广泛用于促进不同硬件和软件解决方案之间以及不同计算机架构和API之间的互操作性。然而，大多数分布式协同设计系统都是采用Web技术开发的.对于该系统，Web技术，即基于Java-Script的WebGL和C是一个理想的平台，三维标注和三维差异可视化模块。它允许创建独立于平台的软件工具，并且其准备好的可用性使用户能够加载基于Java的对象并将其链接以创建完整的应用程序。Microsoft Visual C适合开发API来支持实体和几何建模。对于实时通信功能，我们使用了一个开源的Node.js，它是用JavaScript编写的。Node.js是一个软件平台，用于构建可扩展的网络（特别是服务器端）应用程序。因此，选择PHP和MySQL作为开发基于Web的协作框架的基础技术。该系统有助于提高项目执行和管理中3D CAD设计开发决策的沟通速度，并完全隔离了软件更新，安装3D或CAD查看器以及实时通信工具或许可的必要性。3. 框架组件该框架包含以下功能：（1）3D数据表面的通知，（2）3D设计文件之间的修订控制，（3）通过2D图像文档进行实时协作，（4）文本聊天和（5）视频会议。3.1. 3D CAD数据近 年 来 ， 一 些 CAD 程 序 被 用 于 开 发 产 品 。 例 如 ，CATIA用于设计车身，Pro/ Engineer主要用于设计动力总成。尽管CAD软件可以相互交换本地文件，但它们无法控制不同软件设计的因此，需要一个转换STL文件还可以在Web浏览器上实现3D模型的可视化转换程序是用C语言编写的。图2示出了转换的结构。将用户创建的设计文件转换为STL格式的系统与安装在3D设计模块上的系统同时工作，两个系统通过FTP（文件传输协议）交换数据。图二、STL文件转换程序流程图STL转换器可以单独工作，而其他转换器则需要安装在服务器上的两个CAD软件包，因为它们使用来自该系统的代码（API）来写入数据3.2. 3D CAD数据修订控制在大多数PLM系统中，用户能够看到修改版本的信息，作为这是一个耗时的过程，因为包含在几何数据版本中的每个信息都在每个界面上单独可视化。为了解决这样的不便，在修复过程中比较设计数据文件，并在3D中查看形状的变化是必要的。此外，大多数3D CAD程序具有识别和显示3D设计数据文件差异的功能，但PLM程序和协同设计环境没有任何类似的功能。为了确定3D几何数据之间的形状差异，大多数CAD程序都使用Brière-Litté[8]研究的空间占用比较方法，该方法也用于建议的系统。2011年，Evan Wallace引入了一个新的基于WebGL的CSG.js[9]开源，用于计算简单3D形状之间的差异，如立方体，圆柱体和球体。图3示出了基本的布尔运算。一组三个操作（联合，减去，相交）允许计算两个CAD模型之间的差异。图4中示出了CSG（构造性立体几何）操作所使用的差异识别过程的步骤。如前所述，该方法的要点是两个形状（A，B）的相交作为复杂的几何形状。P. Nyamsuren等人/计算设计与工程学报2（2015）148151object.多个版本的文件可以通过高亮显示添加或删除的几何体的颜色来可视化。需要将商业CAD软件创建的3D模型转换为中性3D文件（如STL，STEP等）。以便在网站上将它们可视化。STL几何数据应该被转换成JavaScript中的Array形式，以便通过使用布尔运算来可视化3D模型之间图5示出了用于差异可视化的JS（JavaScript）设计数据文件的结构。此3D JavaScript文件用于计算设计变更。仅当设计具有两个以上的历史时才应用该算法。参考版本（A）与修改版本（B）相比增加和删除的形状分别用蓝色和红色表示图三. 几何工厂：布尔操作。见图4。 差异识别步骤。大多数CAD差异查看器可能会发现从原始模型到更新模型的变化，但它们无法比较更新模型之间的变化，因为原始模型是唯一被视为参考模型的文件。尽管如此，建议的系统允许用户定义模型的参考版本和模型的比较版本。3.3. 基于3D数据的注释和评论3D媒介通信现在用于制造业产品生命周期管理。2013年，Siltanen[10]提出了产品生命周期管理中3D中介协作的简单方法，并开发了基于Web的3D中介协作框架。3D媒介协作本身的好处是让远程用户与同一3D模型交互，同时分享关于手头问题的想法然而，3D模型也可以用于将讨论链接到所讨论的产品组件的上下文，并且设计相关的讨论将以文本类型写在网络浏览器的其他部分上。这意味着，需要以文本形式精确描述3D模型的哪个部分需要校正。在这样的框架中，3D模型仅通过放大、缩小和旋转等交互与用户连接[11]。但在我们提出的系统的情况下，除了先前的交互（旋转，放大，缩小）的3D模型是交互式地使用在决策过程中。换句话说，用户可以在3D模型的任何所需部分或表面上一个特殊的球形标记将被创建在3D模型的注释和评论部分，其他用户可以通过鼠标移动轻松查看。见图6。 用于决策的3D注释窗口。图五、用于差异可视化的设计数据文件结构152P. Nyamsuren等人/计算设计与工程学报2（2015）148图6示出了用于讨论过程的3D模型。总共有3个不同的用户参与讨论，每个用户在3D模型表面上创建一个注释。注释编写的架构和与其他客户共享的过程如图7所示。基于HTML5和JavaScript的WebGL技术实现了三维模型的可视化和与三维模型的交互。WebGL（Web-based Graphics Language）是一种在Web浏览器上实现三维图形可视化的有效技术。它是一个与图形处理单元（GPU）交互的JavaScriptAPI各种WebGL框架可用于3D可视化和产品开发流程，如OSG，Oak3D，J3D，X3DOM和Three.js。Three.js是一个JavaScript库，用于在Web界面上绘制基于WebGL的3D模型，是使用最广泛的框架之一。虽然在原始WebGL中构造一个简单的对象需要数百行JavaScript代码，但在Three.js中只需几行代码即可构造相同的对象。图7的左侧示出了与JavaScript相关的功能，如3D可视化、3D注释和3D修订控制。上述JavaScript库函数如表1所示。3.4. 实时沟通决策自20世纪90年代中期以来，参数化CAD/CAM/CAE系统与其他PLM组件集成，PLM系统的应用在全球市场上增加[12，13]。从那个时代开始，各种通信系统已被用于产品开发，它缩短了生产时间，降低了产品成本。因此，分布式团队面临着图7.第一次会议。一个基于3D数据结构的讨论程序。使用实时通信工具进行协作工作。在全球制造市场中，在分布式开发中进行最新的实时通信实时通信（RTC）是所有用户可以即时或以可忽略的延迟交换信息的任何远程通信模式。在协同设计开发中使用以下实时通信变体：(1) IRC（互联网中继聊天）或其他聊天模式。(2) 实时视频会议通信。这些通信变化都由浏览器到浏览器的消息传递过程来保持。有几种服务可以提供浏览器到浏览器的消息，例如Google App引擎和Adobe Livecycle协作服务。最有前途的新消息传递方法似乎是WebSocket[14]，它通过TSP提供双向通信通道。WebSocket协议由IETF标准化，应用程序编程接口WebSocket API[15]由W3C标准化。WebSocket协议并不是所有浏览器都支持，主要是因为第一个协议标准版本解决了安全问题。由Google开发的基于WebSocket协议的基于JavaScript的Node.js框架是最有前途的开源。Node.js是一个软件平台，用于构建可扩展的网络（尤其是服务器端）应用程序[16]。Node.js使用JavaScript作为其脚本语言，并通过非阻塞I/O和单线程事件循环实现高吞吐量。Node.js包含一个内置的HTTP服务器库，使得在不使用外部软件（如Apache或Lighttpd）的情况下运行Web服务器成为可能，并允许更多地控制Web服务器的工作方式。Node与其他服务器端技术的主要区别在于Node使用单线程和异步架构。许多其他服务器端技术是多线程和同步的，这意味着线程在等待数据库响应时可能会被阻塞。每个请求都会根据系统RAM使用情况从有限的池中创建一个新线程。Node的异步设计允许它在单线程上以高吞吐量处理大量并发连接，这使它具有高度的可伸缩性。Node并不意味着要替代其他技术栈，但它可以为适合其目的的应用程序提供可扩展性和更高的的一些示例表1JavaScript的函数1Three.js是一个轻量级的跨浏览器JavaScript库/API，用于在Web浏览器上创建和显示动画3D计算机图形2CSG.js是一种建模技术，它使用联合和交集等布尔运算来组合3D实体3STLLoader.js将STL文件转换为基于WebGL的 3D文件4Detector.js确定当前Web浏览器是否支持WebGL5jQuery.js是一个跨平台的JavaScript库，旨在简化HTML的客户端脚本编写6Html2canvas.js将3D设计文件转换为2D图像文件。P. Nyamsuren等人/计算设计与工程学报2（2015）148153可以从使用Node中受益的应用程序类型包括REST API、聊天应用程序和实时跟踪应用程序（经纪交易仪表板、实时用户统计等）。图8示出了基于node.js的实时通信模块的结构。除了视频会议和文本消息功能外，基于2D图像的实时注释功能完成了实时通信模块。这些功能都安装在不同的服务器上，从任何客户端浏览器发送的信息或数据都会传输给所有用户，反之亦然。见图8。 通过Node.js进行通信。4. 框架的实施图9示出了所建议的框架的主用户界面。用户界面使用主要的Web技术构建，包括PHP，HTML5，MySQL和两个外部库提供的API：Three.js用于可视化和交互3D模型，Node.js用于决策过程的实时通信STL模型加载到Web浏览器上通过JavaScript库。每个用户都可以看到相同的模型，并通过选择3D模型组件，在3D模型的表面上放置注释和注释来与它进行交互。用户界面的基本功能是旋转模型，以便从不同角度查看。用户输入的注释在3D模型表面上显示为不同颜色的球体。这使得可以轻松查看哪个用户评论了3D模型的哪个部分。图9示出了总共3个用户参与3D讨论过程。在用户界面的左侧，即时消息链接到正在讨论的3D模型。然而，当注释放在3D模型的表面上时，相关信息会自动更新到用户界面的相关注释部分。此外，3D模型链接和讨论相关文件显示在网络浏览器的右侧图10显示了将要讨论的关于白板上的图片的部分。每次用户与模型交互时，定义模型视角变化的转换矩阵使用WebSockets发送到其他用户的浏览器，外部浏览器中的视角相应地改变。图11展示了关于具有两个不同版本的CAD模型的案例研究。图11（a）和（b）显示了参考模型和更新模型，由Solidworks 2010建模见图9。 3D设计讨论的主界面。154P. Nyamsuren等人/计算设计与工程学报2（2015）148见图10。 白板的窗口见图11。 一个版本可视化窗口。P. Nyamsuren等人/计算设计与工程学报2（2015）148155图12个。文件存储和时间表行。表2与商业系统的比较表。基于Web的3D设计框架的类型表2显示了商业系统和本文开发的系统的比较。所有被比较的系统都支持基于Web的三维模型协作。本系统的核心技术是对3D Verold Cadline社区我们的系统模型的表面，并且评论点将被实时地快速更新给其他用户。利用Node.JS和WebSocket，系统提供了注记点坐标数据的共享，但视角不共享。该系统类似于其他文档共享系统（例如Google Chrome），共享光标的位置而不是用户的视图。 它可以给用户显示的自由。与商业系统相比，它包含了商业系统的所有功能，并且系统通过Node.js和WebSocket提供了表面注释的实时功能。这些模型之间的两个显著差异是左侧表面上的切割孔和表面上存在的水平孔，这仅在更新的模型中可见。在图11（c）中，红色和蓝色分别表示删除和添加的模型部分。图12显示了该框架的文件存储。当在3D模型上开始新的讨论时，系统自动创建与讨论相关的文件夹。当讨论过程都在进行时，动作保存在时间表部分。通过使用时间表窗口，用户可以找出项目更新的日期。5. 结论和今后的工作在三维环境下进行产品设计，需要对人、工程工具、产品相关信息等分布式资源进行整合，需要付出大量的努力。此外，用于3D设计过程的决策的PLM系统已经转向基于Web的系统，以提供分布式设计环境。特别是讨论了三维设计过程和设计变更的可视化，实时显示XXOO(3D模型）信息（文本/视频）OOXO移动/缩放OOOO2D屏幕截图OOXO素描曲面上的点，XXXO评论156P. Nyamsuren等人/计算设计与工程学报2（2015）148网络浏览器非常复杂，因此需要分配大量资源。基于网络的决策系统可以帮助大大减少这些要求。WebGL是一个主要的工具，用于在Web浏览器上可视化设计过程中的交互式3D模型。此外，基于JavaScript的通信工具的软件不过，建议的制度只适用于讨论 简单的3D模型设计过程。该系统应进一步发展，以支持更复杂的3D模型和特殊形式;此外，应支持不同环境中的用户之间的实时通信工具，在未来。引用[1] 蒋达，崔佩AJC，顾CC。以知识为基础之智慧系统支援协同设计社群之动态设计推论。 Int. J. Adv. 制造商Technol. 2006; 31：421-33.[2] 藻属制造系统：理论与实践，第二版，New York：Springer-Verlag.ISBN：978-0-387-25683-2。[3] 放大图片作者：TeresaW，Nan X. 协同产品开发分布式信息系统的设计与实现。J.计算机信息科学Eng.2004; 4（4）281-93.[4] 李世石，李世石. 基于Web的3D CAD模型数据修订控制框架。国际精密仪器公司2013; 14（10）1797-803。[5] Chang YW，Lee SH.以使用者为中心的网路化制程分析系统之开发。国际精密仪器公司Eng. 制造商2013; 14（10）2165-70.[6] Siltanen P，Valli S.制造业中基于Web的3D介导通信，见：第19届ISPE并行工程国际会议论文集，2013年，第11页。1181-1192年。[7] Randelovic S，Zivanovic S. CAD-CAM数据传输是产品生命周期的一部分。 FACTA大学机甲Eng. 2007; 5（1）87-96。[8] 放大图片作者：Antoine BC，Louis R.面向工程定制产品设计重用的自适应通用产品结构建模。Comput.印第安纳2010; 61（1）53-63.[9] CSG.js可以访问http：//evanw.github.com/csg.js/docs。[10] Siltanen P，Valli S.制造业中基于网络的3D媒介沟通。同意工程师接近维持。Prod. Dev.多个窗口。Environ. 2013; 1（1）1181-92.[11] Shana S，Fong S.基于互联网的CAD协作工具的评估。J. Technol.Stud. 2004; 30（2）79-85.[12] 梁建生基于Web的三维虚拟技术开发产品信息框架。国际高级制造技术杂志2007; 34：617-30.[13] Song IH，Chung SC.基于Web的CAD查看器，具有通过STEP翻译服务器进行尺寸验证的功能。 J. 机甲Sci. Technol. 2007; 21（8）1235-43.[14] 希克森岛，Web Socket协议IETF，Standards Track，2009。[15] WebSocket API ， 2011 年 12 月 5 日 编 辑 草 案 ， http ：dev.w3.org/html5/websockets/websockets，2012年1月26日访问。[16] Node.js API，请参见http：//nodejs.org/en.js。Initial release：27，May 2009，accessed 23.01.14.