CN109636887B - 一种二维电子技术图纸格式转换及矢量化交互系统 - Google Patents

Abstract

一种二维电子技术图纸格式转换及矢量化交互系统，包括数据转换模块、动画制作模块、SVG输出模块以及浏览交互模块。数据转换模块读取和识别外部输入的二维电子技术图纸的实体对象及其属性信息，将其转换为对应的SVG信息，更新所有SVG图元的坐标值，将更新后的SVG信息输出到动画制作模块；动画制作模块为指定的SVG图元添加动画描述信息，并保存到临时SVG文档；SVG输出模块将临时SVG文档保存成SVGP文件；浏览交互模块：用于加载SVGP文件，能够与用户进行交互，监听和响应用户鼠标操作和热点输入，播放动画以及显示热点关联内容。本发明能够跨平台使用，工作量小，文件简单，加载速度快，不需要制作3D产品模型，省时省力。

Description

一种二维电子技术图纸格式转换及矢量化交互系统

技术领域

本发明涉及一种二维电子技术图纸格式转换及矢量化交互系统，属于信息技术领域。

背景技术

二维电子技术图纸在航空航天及其他工程机械领域进行了广泛应用，基于二维电子技术图纸开展航空航天及其他工程机械装备设计、装配仿真、生产制作、技术培训等工作对于提升产品质量具有重要意义。二维电子技术图纸已成为航空航天及其他工程机械装备研制的输出结果和制造依据、用于跨部门、跨流程间的数据信息传递。目前的二维电子技术图纸多是以DWG、DXF(AutoCAD软件产生的文档格式)或PDF(Adobe公司制定的文档格式)文档存储。而在航空航天及其他工程机械装备安装实施、辅助维修、后勤保障、技术培训等应用中，仅仅以二维图、文字等的形式展示系统或产品的结构组成、装配关系、机构运动原理、电气工作原理、液压传动原理等方面存在着不够直观、不够生动的问题，为了使设计人员、制造人员、使用人员、维修人员尽快熟悉及理解产品的使用及维护保障等方面知识，需要提供一种直观、形象、易懂地方式以达到更好的效果。

目前存在两种解决方式：1)通过制作视频动画来展示原理技术，如利用Flash动画，但是安卓系统即将不支持Flash软件，而且制作flash动画工作量大，文件复杂，导致该方法不能得到长期的使用；2)通过制作3D产品模型，并在其中添加装配关系、运动模拟来展示原理，但是仅仅制作3D模型就平均需要耗费2周到一个月的时间，后期添加装配关系、运动关系耗费的时间更长，制作麻烦，费时费力。

发明内容

本发明解决的技术问题为：克服现有技术不足，提供一种二维电子技术图纸格式转换及矢量化交互系统，能够跨平台使用，工作量小，文件简单，加载速度快，不需要制作3D产品模型，省时省力。

本发明解决的技术方案为：

一种二维电子技术图纸格式转换及矢量化交互系统，包括数据转换模块、动画制作模块、SVGP输出模块以及浏览交互模块；

数据转换模块：读取和识别外部输入的二维电子技术图纸的实体对象及其属性信息，将其转换为对应的SVG信息，所述SVG信息包括SVG图层及其属性信息、SVG图元及其属性信息、SVG图层和图元的层次关系信息；更新所有SVG图元的坐标值；将更新后的SVG信息输出到动画制作模块；

动画制作模块：接收数据转换模块的SVG信息，为指定的SVG图元添加动画描述信息；将添加动画描述信息的SVG信息保存到临时SVG文档；所述动画描述信息包括动画资源、动画和热点交互控制脚本；

SVGP输出模块：打开动画制作模块保存的临时SVG文档，将其保存成SVGP文件，同时删除SVG文档；

浏览交互模块：用于加载SVGP文件，采用分层迭代渲染方式对SVGP文件中的SVG图元和动画进行渲染和显示，并能够与用户进行交互，监听和响应用户鼠标操作和热点输入，播放动画以及显示热点关联内容。

二维电子技术图纸的实体对象包括图层类实体对象、基本图形类实体对象和扩展图形类实体对象；

其中

图层实体对象包括：图层；图层类实体对象属性信息包括：图层名称、图层ID和图层状态；

基本图形类实体对象包括：直线、矩形、折线、多边形、圆、圆弧、椭圆、椭圆弧、样条曲线、文字；

扩展图形类实体对象包括：符号、图块、填充图形、尺寸；

基本图形类实体对象和扩展图形类实体对象属性包括：颜色、填充样式、线形宽度、仿射变换类型、实体坐标、实体宽度和实体高度。

所述数据转换模块读取和识别外部输入的二维电子技术图纸的实体对象及其属性信息，将其转换为对应的SVG信息的方式如下：

(3.1)读取二维电子技术图纸文件，查找并分别解析文件中的图层及其属性信息，形成图层列表；遍历每个图层，查找并解析每个图层所包含的所有实体对象及其属性信息，每个图层所包含的所有实体对象包括基本图形类实体对象和扩展图形类实体对象；

(3.2)将步骤(3.1)中所有图层及其属性信息转换为SVG图层及其属性信息；按照映射数据字典和XML匹配关系文件将每个图层包含的所有实体对象及其属性信息转换为对应的SVG图元及其属性信息；

(3.3)根据二维电子技术图纸文件构建SVG图层和图元的层次关系；

(3.4)SVG图层及其属性信息、SVG图元及其属性信息、SVG图层和图元的层次关系信息即为转换后的SVG信息。

映射数据字典中记录二维电子技术图纸每个基本图形类实体对象和扩展图形类实体对象与SVG图元间的转换匹配关系，XML匹配关系文件记录二维电子技术图纸每个基本图形类实体对象和扩展图形类实体对象属性与SVG图元属性间的转换匹配关系。

数据转换模块更新SVG信息的方法如下：

对所有SVG图元坐标进行旋转加平移的仿射变换，据此更新所有SVG图元的坐标值。

仿射变换所使用的矩阵为

f为适配屏幕高度方向分辨率。

动画制作模块为指定的SVG图元添加动画描述信息的方法如下：

(7.1)打开数据转换模块传来的所有SVG信息，确定哪些SVG图元要动以及如何动；

(7.2)通过选用内置SMIL元素动画制作方法和外挂脚本控制动画制作方法，为指定的SVG图元添加动画资源、动画和热点交互控制脚本。

所述步骤(7.2)的具体实现方法如下：

如果要动的SVG图元为一个单独个体，则采用内置SMIL元素动画制作方法，直接在选定的SVG图元中添加动画元素并设置对应动画元素属性值；

如果要动的SVG图元为多个个体，则采用外挂脚本控制动画制作方法，先将这些个体组合成块，为每个块分配ID和属性，通过JavaScript操作和修改SVG DOM信息的方式为块添加动画和热点交互控制脚本，将动画和热点交互控制脚本与触发事件响应建立关联，所述脚本包括块和块中每个实体对象动作的路径、时间和顺序。

所述SVGP输出模块将临时SVG文档保存成SVGP文件的方式如下：读取并识别临时SVG文档中的SVG信息以及动画描述信息；新建SVGP格式的空白文件，采用复合文档流式结构化二进制存储方式，将临时SVG文档中的SVG信息以及动画描述信息写入到SVGP文件中并保存。

将临时SVG文档中的SVG信息以及动画描述信息写入到SVGP文件的方式如下：

(a)将文件头部信息写入SVGP文件中，所述文件头部信息包括文件格式标识信息、版本信息和地址索引；

(b)将动画资源、动画和热点交互控制脚本以二进制方式写入SVGP文件中；

(c)逐次将图层信息和每个图层包含的SVG图元信息以二进制方式分层写入SVGP文件中；

(d)将文件结束标识、文件循环冗余正确性校验信息以二进制方式分层写入SVGP文件，保存并输出SVGP文件。

本发明与现有技术和系统相比的优点在于：

(1)本发明提出了一套全新二维电子技术图纸格式转换及矢量化交互解决方案，能够解决了二维电子技术图纸格式转换和数据长期存储问题,实现机械和电气等领域工程历史数据的复用；跨平台兼容Windows和Android操作系统，能够在Android平台中取代现有Flash和Silverlight实现二维电子图纸的矢量化交互及动画效果；动画制作操作简单且支持编程扩展，极大降低动画制作时间和成本；自定义的SVGP文件，文件小，数据加载速度快，数据可控，安全性高。

(2)采用通过异构图元分层映射方法，能将二维电子技术图纸的实体对象及其属性信息快速转换为SVG图层及其属性信息、SVG图元及其属性信息、SVG图层和图元的层次关系信息，提高了异构数据转换效率，保障了数据转换的正确性和完整性，同时也为规范化管理转换后SVG数据提供了便利条件；

(3)支持内置SMIL元素动画制作和外挂脚本控制动画制作两种方法，支持在浏览器、SVG浏览软件中查看矢量化数据和响应用户交互，改变传统动画制作的人机交互方式，减少了动画制作工作量和制作时间，节约了动画制作成本；

(4)采用复合文档流式结构化二进制存储的自定义SVGP文件格式，相较于其他文件格式，文件体积小，自主可控，数据安全性强；分层迭代渲染方式展示SVGP文件内容，数据加载速度快，展示效果好。

附图说明

图1为本发明系统组成示意图；

图2为数据转换模块工作流程；

图3为动画制作模块工作流程；

图4为SVGP输出模块工作流程。

具体实施方式

下面结合附图和具体实施例对本发明做进一步详细描述。

二维电子技术图纸格式转换及矢量化交互系统包括数据转换模块、动画制作模块、SVG输出模块以及浏览交互模块。二维电子技术图纸格式转换及矢量化交互系统组成及内部数据传递如图1所示。二维电子技术图纸格式转换及矢量化交互系统具体实施方式如下。

(一)数据转换模块

数据转换模块的工作流程如图2所示，其核心工作流程如下。

(1)加载二维电子技术图纸

DWG文档格式是Autodesk公司创建的二维图纸文件格式，该格式文件为非公开格式，因此处理该文件显得几位复杂。DWG文件内部包含一个控制块、模型空间块和布局空间块。每一个块可以代表任意一种形状元素：线、圆、或文本等。整个执行过程按顺序循环遍历块，读取块中元素和属性，将其转换为SVG数据即可。

PDF文档格式存贮信息完全是按照对象的方式存贮的，存贮逻辑为“页->坐标->对象->属性”。这些对象可以是文字、图片、矢量图、书签、超链接、附件等等。PDF的文档结构是一种树型结构，树的根节点也就是PDF文件的根对象，根节点下面有四个子树：页面树(Pages Tree)、书签树(Outline Tree)、线索树(Article Threads)和名字树(NamedDestination)。在解析PDF文档格式过程中，按顺序循环遍历对象，读取对象中的矢量元素和属性，将其转换为SVG数据即可。

DXF文档格式同样是Autodesk公司创建的二维图纸文件格式，不同于DWG该文件格式是公开的。DXF文件分为七个区域，每个区域内有多个组构成。组是最小内容单位。每组占两行，第一行是Key，为一个整数，表明其后数据元素的类型(属性)，也指出了数据元素对于给定对象(或记录)类型的含意；第二行Value(元素)，具体数据类型根据Key来确定，可以是字符串型、整型或浮点数型等。DXF格式数据转换过程即是循环遍历所有组，根据不同类型分别转化为SVG对应的数据内容。

加载二维电子技术图纸时数据转换模块首先将二维电子技术图纸文件加入到内存，然后获得Application对象，依据Application对象取得Document对象，之后便可以识别和遍历保存直线、矩形、折线、多边形、圆、圆弧、椭圆、椭圆弧、样条曲线、文字、符号、图块、填充图形、尺寸和图层等实体对象和属性了。

(2)读取和识别二维电子图纸中图层实体对象，形成图层列表及其属性信息

为方便二维电子技术图纸中的实体对象能够快速组合映射为SVG图元对象，并实现对映射转换后的SVG图元进行分层管理，首先将二维电子技术图纸文件中的实体对象进行自定义分类，分别为基本图形类实体对象、扩展图形类实体对象和图层实体对象，图层实体对象包括：图层。图层类实体对象属性信息包括：图层名称、图层ID和图层状态。

(3)按照图层列表顺序依次遍历各个图层

(4)读取和识别二维电子图纸每个图层中所有基本图形类、扩展图形类实体对象列表及属性信息

其中基本图形类实体对象包括：直线、矩形、折线、多边形、圆、圆弧、椭圆、椭圆弧、样条曲线、文字；扩展图形类实体对象包括：符号、图块、填充图形、尺寸；基本图形类实体对象和扩展图形类实体对象属性包括：颜色、填充样式、线形宽度、仿射变换类型、实体坐标、实体宽度和实体高度；

(5)将每个图层及属性进行SVG格式转换，得到SVG图层及其属性信息；

(6)按照映射数据字典和XML匹配关系文件将每个图层包含的所有实体对象及其属性信息转换为对应的SVG图元及其属性信息；

映射数据字典中记录二维电子技术图纸每个基本图形类实体对象和扩展图形类实体对象与SVG图元间的转换匹配关系，XML匹配关系文件记录二维电子技术图纸每个基本图形类实体对象和扩展图形类实体对象属性与SVG图元属性间的转换匹配关系。

(7)重新构建SVG图层和SVG图元间的层次关系，对所有SVG图元坐标属性进行仿射变换并更新；

将所有SVG图元的坐标属性进行平移加旋转的仿射变换运算，仿射变换所使用的矩阵为

f为适配屏幕高度方向分辨率。

(8)将更新后的SVG图层及属性、SVG图元及属性、SVG图层及图元层次关系等信息传递到动画制作模块

(二)动画制作模块

数据转换模块的工作流程如图3所示，其核心工作流程如下。

(1)接收数据转换模块传递的SVG图层及其属性信息、SVG图元及其属性信息、SVG图层和图元的层次关系信息；

(2)为指定的SVG图元添加动画资源、动画和热点交互控制脚本等动画描述信息；

通过选用内置SMIL元素动画制作方法和外挂脚本控制动画制作方法，为指定的SVG图元添加动画资源、动画和热点交互控制脚本等动画描述信息；

如果要动的实体对象为一个单独个体，则采用内置SMIL元素动画制作方法，直接在选定的SVG图元中添加动画元素并设置对应动画元素属性值；

如果要动的SVG图元为多个个体，则采用外挂脚本控制动画制作方法，先将这些个体组合成块，为每个块分配ID和属性，通过JavaScript操作和修改SVG DOM信息实现为块添加具体动作脚本，所述具体动作脚本包括块和块中每个实体对象动作的路径、时间和顺序。

把一些固定的或没有相对运动的图形连接在一起，可以组合成一个块。块支持嵌套操作，即一个或多个块或图形，还可以再组合成一个更大的块。每个块有名称或ID来标识。具体过程包括：拾取所要组成块的图形－〉组合成块－〉块分配ID－〉配置块属性。

拾取图形可以有三种方式:1、单个拾取，叠加的方式来组合。2、框选，用鼠标画一个方框，自动把方框内的图形裁剪成一个单独的块。3、自定义拾取框，用鼠标画一个封闭的多边形连线，自动把多边形内的图形裁剪后组合起来一个单独块。

组合块生成后，系统自动为块分配ID，用于唯一识别。每个块都具有块属性，定义块名称、线型、颜色、字体等属性，块属性允许修改。

块属性配置好以后，就可以定义连接了。把一个图形与一段文字映射起来，点击图形时可以显示文字，或点击文字时显示相关图形，这种关系就称之为连接。这种关系即可以是单向的，也可以是双向的，图形块与文字相互映射。

(3)将添加动画资源、动画和热点交互控制脚本的SVG图层及其属性信息、SVG图元及其属性信息、SVG图层和图元的层次关系信息保存到临时SVG文档

(三)SVGP输出模块

SVGP输出模块的工作流程如图4所示，其核心工作流程如下。

(1)打开动画制作模块保存的临时SVG文档；

(2)读取SVG文档中图层信息、图元信息和属性、动画信息；

(3)新建SVGP类型空白文件；

(4)将文件格式标识信息、版本信息、地址索引等文件头部信息SVGP文件；

(5)将动画资源、动画和热点交互控制脚本以二进制方式写入SVGP文件；

(6)逐次将图层信息和每个图层包含的SVG图元信息以二进制方式分层写入SVGP文件；

(7)将文件结束标识、文件循环冗余正确性校验信息以二进制方式分层写入SVGP文件，保存并输出SVGP文件。

(四)浏览交互模块

浏览交互模块的核心工作流程如下。

(1)打开SVGP文件，验证文件格式标识和文件循环冗余校验信息；

(2)解析SVGP文件中的图层、图元和动画信息；

(3)逐次迭代渲染图层和图层中的所有SVG图元信息；

(4)绑定动画资源、动画控制脚本与其对应的SVG图元；

在控件内部需要对SVGP数据进行处理，解析图元数据、显示数据，热点数据等，并且对数据进行管理及响应。解析数据完毕后，在主界面显示二维矢量图，并提供系列API，供外部调用。

(5)监听和响应用户鼠标操作和热点输入，播放动画。

当用户在浏览交互中做出操作，如鼠标点击激活热点，浏览控件会对外部容器(需要事先注册)发出消息。由外部容器自行决定是否处理该消息、如何处理该消息。

本发明提出了一套全新二维电子技术图纸格式转换及矢量化交互解决方案，能够解决了二维电子技术图纸格式转换和数据长期存储问题,实现机械和电气等领域工程历史数据的复用；跨平台兼容Windows和Android操作系统，能够在Android平台中取代现有Flash和Silverlight实现二维电子图纸的矢量化交互及动画效果；动画制作操作简单且支持编程扩展，极大降低动画制作时间和成本；自定义的SVGP文件，文件小，数据加载速度快，数据可控，安全性高，不需要制作3D产品模型，省时省力。

本发明未详细说明部分属本领域技术人员公知常识。

Claims (4)

1.一种二维电子技术图纸格式转换及矢量化交互系统，其特征在于：包括数据转换模块、动画制作模块、SVGP输出模块以及浏览交互模块；

数据转换模块：读取和识别外部输入的二维电子技术图纸的实体对象及其属性信息，将其转换为对应的SVG信息，所述SVG信息包括SVG图层及其属性信息、SVG图元及其属性信息、SVG图层和图元的层次关系信息；更新所有SVG图元的坐标值；将更新后的SVG信息输出到动画制作模块；

动画制作模块：接收数据转换模块的SVG信息，为指定的SVG图元添加动画描述信息；将添加动画描述信息的SVG信息保存到临时SVG文档；所述动画描述信息包括动画资源、动画和热点交互控制脚本；

SVGP输出模块：打开动画制作模块保存的临时SVG文档，将其保存成SVGP文件，同时删除SVG文档；

浏览交互模块：用于加载SVGP文件，采用分层迭代渲染方式对SVGP文件中的SVG图元和动画进行渲染和显示，并能够与用户进行交互，监听和响应用户鼠标操作和热点输入，播放动画以及显示热点关联内容；

二维电子技术图纸文件格式包括DWG文档格式、PDF文档格式、DXF文档格式；

二维电子技术图纸的实体对象包括图层类实体对象、基本图形类实体对象和扩展图形类实体对象；

其中：

图层实体对象包括：图层；图层类实体对象属性信息包括：图层名称、图层ID和图层状态；

基本图形类实体对象包括：直线、矩形、折线、多边形、圆、圆弧、椭圆、椭圆弧、样条曲线、文字；

扩展图形类实体对象包括：符号、图块、填充图形、尺寸；

基本图形类实体对象和扩展图形类实体对象属性包括：颜色、填充样式、线形宽度、仿射变换类型、实体坐标、实体宽度和实体高度；

所述数据转换模块读取和识别外部输入的二维电子技术图纸的实体对象及其属性信息，将其转换为对应的SVG信息的方式如下：

(3.1)读取二维电子技术图纸文件，查找并分别解析文件中的图层及其属性信息，形成图层列表；遍历每个图层，查找并解析每个图层所包含的所有实体对象及其属性信息，每个图层所包含的所有实体对象包括基本图形类实体对象和扩展图形类实体对象；

(3.2)将步骤(3.1)中所有图层及其属性信息转换为SVG图层及其属性信息；按照映射数据字典和XML匹配关系文件将每个图层包含的所有实体对象及其属性信息转换为对应的SVG图元及其属性信息；

(3.3)根据二维电子技术图纸文件构建SVG图层和图元的层次关系；

(3.4)SVG图层及其属性信息、SVG图元及其属性信息、SVG图层和图元的层次关系信息即为转换后的SVG信息；

所述SVGP输出模块将临时SVG文档保存成SVGP文件的方式如下：读取并识别临时SVG文档中的SVG信息以及动画描述信息；新建SVGP格式的空白文件，采用复合文档流式结构化二进制存储方式，将临时SVG文档中的SVG信息以及动画描述信息写入到SVGP文件中并保存；

将临时SVG文档中的SVG信息以及动画描述信息写入到SVGP文件的方式如下：

(a)将文件头部信息写入SVGP文件中，所述文件头部信息包括文件格式标识信息、版本信息和地址索引；

(b)将动画资源、动画和热点交互控制脚本以二进制方式写入SVGP文件中；

(c)逐次将图层信息和每个图层包含的SVG图元信息以二进制方式分层写入SVGP文件中；

(d)将文件结束标识、文件循环冗余正确性校验信息以二进制方式分层写入SVGP文件，保存并输出SVGP文件；

动画制作模块为指定的SVG图元添加动画描述信息的方法如下：

(7.1)打开数据转换模块传来的所有SVG信息，确定哪些SVG图元要动以及如何动；

(7.2)通过选用内置SMIL元素动画制作方法和外挂脚本控制动画制作方法，为指定的SVG图元添加动画资源、动画和热点交互控制脚本；

所述步骤(7.2)的具体实现方法如下：

如果要动的SVG图元为一个单独个体，则采用内置SMIL元素动画制作方法，直接在选定的SVG图元中添加动画元素并设置对应动画元素属性值；

如果要动的SVG图元为多个个体，则采用外挂脚本控制动画制作方法，先将这些个体组合成块，为每个块分配ID和属性，通过JavaScript操作和修改SVG DOM信息的方式为块添加动画和热点交互控制脚本，将动画和热点交互控制脚本与触发事件响应建立关联，所述脚本包括块和块中每个实体对象动作的路径、时间和顺序。

2.根据权利要求1所述的一种二维电子技术图纸格式转换及矢量化交互系统，其特征在于：映射数据字典中记录二维电子技术图纸每个基本图形类实体对象和扩展图形类实体对象与SVG图元间的转换匹配关系，XML匹配关系文件记录二维电子技术图纸每个基本图形类实体对象和扩展图形类实体对象属性与SVG图元属性间的转换匹配关系。

3.根据权利要求1所述的一种二维电子技术图纸格式转换及矢量化交互系统，其特征在于：数据转换模块更新所有SVG图元的坐标值的方法如下：

对所有SVG图元坐标进行旋转加平移的仿射变换，据此更新所有SVG图元的坐标值。

4.根据权利要求3所述的一种二维电子技术图纸格式转换及矢量化交互系统，其特征在于：仿射变换所使用的矩阵为

f为适配屏幕高度方向分辨率。/>

Images