CN117331549B - 一种三维可视化开发框架构建方法 - Google Patents

Abstract

本发明公开了一种三维可视化开发框架构建方法，涉及开放框架构建领域。该方法包括：构建工具区，并利用工具区对待处理的三维模型文件进行工具化处理，以确定处理后的三维模型文件；构建实体展示区，并利用实体展示区构建处理后的三维模型文件的三维实体展示图；设置平台组件，利用平台组件在三维实体展示图中进行三维漫游和用户界面九宫格化处理。本发明开发的三维可视化开发框架支持多人协同开发项目和单一项目存在多个园区，降低了离线版部署方式的复杂度，减少了渲染园区的时间，并且增加了三维漫游功能以便于进行实景巡检。

Description

一种三维可视化开发框架构建方法

技术领域

本发明涉及开放框架构建领域，具体涉及一种三维可视化开发框架构建方法。

背景技术

现有方法通过构建低代码平台区、代码编辑区和三维可视化区以在线编写代码以及结合其内置的大量现有的接口来进行三维可视化快速开发。低代码平台提供实现各种功能的参考代码。用户需要实现某个功能时，可在低代码平台快速获取到指定模板并进行二次编辑。代码编辑区主要使用的是JavaScript（一种开发语言）语言进行编辑。当中间代码保存时，可以在三维可视化区实时展示代码运行出的三维图。

现有方法存在以下缺点：

1、在线开发无法做环境区分，因此开发、测试、正式发布使用的均为同一套代码，导致项目迭代困难；

2、不支持SVN（一个开放源代码的版本控制系统）、GIT（一个开源的分布式版本控制系统）项目管理，因此无法多人协同开发项目；

3、缺少三维漫游功能，无法满足施工、隧道行业的巡检要求；

4、对于保密性要求高的项目，使用在线开发的方式很容易导致数据泄露，因此只能使用离线部署，现有方法虽然提供了离线版的部署方式，但是操作极其复杂，还会限制服务器部署方式；

5、不支持同一个项目中存在多个园区的功能；

6、当模型文件过大，会导致每次渲染园区的时间会很长。

发明内容

针对现有技术中的上述不足，本发明提供了一种三维可视化开发框架构建方法，通过该方法开发的三维可视化开发框架支持多人协同开发项目和单一项目存在多个园区，降低了离线版部署方式的复杂度，减少了渲染园区的时间，并且增加了三维漫游功能以便于进行实景巡检。

为了达到上述发明目的，本发明采用的技术方案为：

一种三维可视化开发框架构建方法，包括以下步骤：

S1、构建工具区，并利用工具区对待处理的三维模型文件进行工具化处理，以确定处理后的三维模型文件；

S2、构建实体展示区，并利用实体展示区构建处理后的三维模型文件的三维实体展示图；

S3、设置平台组件，利用平台组件在三维实体展示图中进行三维漫游和用户界面九宫格化处理。

进一步地，在步骤S1中，工具区包括文件加载区、样式排版区、优化操作区、园区加载切换区、线条美化区和环境变量区。

进一步地，步骤S1包括以下分步骤：

S11、构建文件加载区，并利用文件加载区加载待处理的三维模型文件；

S12、构建样式排版区，并利用样式排版区对待处理的三维模型文件进行样式排版；

S13、构建优化操作区，并利用优化操作区对待处理的三维模型文件进行优化操作；

S14、构建园区加载切换区，并利用园区加载切换区对待处理的三维模型文件进行园区加载切换操作；

S15、构建线条美化区，并利用线条美化区对待处理的三维模型文件进行线条美化操作；

S16、构建环境变量区，并利用环境变量区对设定的配置文件设置自定义环境变量。

进一步地，步骤S13包括以下分步骤：

S131、构建优化选择模块，利用优化选择模块选取适用于待处理的三维模型文件的优化处理方法，并根据选取的优化处理方法对待处理的三维模型文件进行优化处理；

S132、构建优化模型移除模块，利用优化模型移除模块对优化处理后的三维模型文件进行模型移除前的预处理。

进一步地，步骤S14包括以下分步骤：

S141、构建园区加载选择模块，利用园区加载选择模块选取适用于待处理的三维模型文件的园区加载方法，并根据选取的园区加载方法对待处理的三维模型文件进行园区加载；

S142、构建园区切换模块，利用园区切换模块对加载园区后的三维模型文件进行园区切换。

进一步地，在步骤S2中，实体展示区包括园区构建区、三维面板构建区、图标构建区、天空盒构建区和轨迹线构建区。

进一步地，步骤S2包括以下分步骤：

S21、构建园区构建区，并利用园区构建区构建处理后的三维模型文件的园区；

S22、构建三维面板构建区，并利用三维面板构建区构建处理后的三维模型文件的三维面板；

S23、构建图标构建区，并利用图标构建区构建处理后的三维模型文件的图标；

S24、构建天空盒构建区，并利用天空盒构建区构建处理后的三维模型文件的天空盒；

S25、构建轨迹线构建区，并利用轨迹线构建区构建处理后的三维模型文件的轨迹线。

进一步地，步骤S21包括以下分步骤：

S211、设置园区渲染模块，并利用园区渲染模块对处理后的三维模型文件进行渲染以获取三维模型渲染图；

S212、构建抗锯齿效果器，并利用抗锯齿效果器对三维模型渲染图进行平滑处理以获取三维模型渲染平滑图；

S213、构建亮度校正效果器，并利用亮度校正效果器对三维模型渲染平滑图进行色彩修正以获取处理后的三维模型文件的园区。

进一步地，在步骤S3中，平台组件包括三维漫游组件和九宫格用户界面组件。

进一步地，步骤S3包括以下分步骤：

S31、设置三维漫游组件，利用三维漫游组件在三维实体展示图中进行三维漫游以对园区进行实景检测；

S32、设置九宫格用户界面组件，利用九宫格用户界面组件对三维实体展示图中外观一致的图片进行用户界面九宫格化处理。

本发明具有以下有益效果：

（1）本发明利用环境变量区对设定的配置文件设置自定义环境变量，通过自定义环境变量，可实现同一套代码在不同环境下均可运行；

（2）本发明通过在优化操作区构建优化选择模块和优化模型移除模块，通过优化选择模块能够根据待处理的三维模型文件选取适用的优化处理方法，并在优化后通过优化模型移除模块对优化处理后的三维模型文件进行模型移除前的预处理，即在模型移除前自动释放几何形状以及材质，进而增强优化效果和优化效率；

（3）本发明构建的三维可视化开发框架属于本地开发，因此可以使用SVN或者GIT项目管控工具对代码进行版本管控，既保障项目正常迭代又能够实现多人协同开发；

（4）本发明通过设置九宫格用户界面组件，对三维实体展示图中外观一致的图片进行用户界面九宫格化处理，能够节省文件资源；

（5）本发明通过设置三维漫游组件，能够利用三维漫游组件在三维实体展示图中进行三维漫游以对园区进行实景检测；

（6）本发明构建的三维可视化开发框架无需任何在线网络的支撑便可独立运行，因此支持离线部署，并且不限制离线部署方式，进而降低了离线版部署方式的复杂度；

（7）本发明在园区加载切换区构建了园区加载选择模块和园区切换模块，使得单一项目能够存在多个园区；

（8）本发明通过在园区构建区设置园区渲染模块，减少了渲染园区的时间。

附图说明

图1为一种三维可视化开发框架构建方法流程示意图。

具体实施方式

下面对本发明的具体实施方式进行描述，以便于本技术领域的技术人员理解本发明，但应该清楚，本发明不限于具体实施方式的范围，对本技术领域的普通技术人员来讲，只要各种变化在所附的权利要求限定和确定的本发明的精神和范围内，这些变化是显而易见的，一切利用本发明构思的发明创造均在保护之列。

如图1所示，一种三维可视化开发框架构建方法，包括步骤S1-S3，具体如下：

S1、构建工具区，并利用工具区对待处理的三维模型文件进行工具化处理，以确定处理后的三维模型文件。

在本发明的一个可选实施例中，工具区包括文件加载区、样式排版区、优化操作区、园区加载切换区和线条美化区。工具区还设置有前端数据模拟器。

前端数据模拟器，由前端模拟MQTT（MessageQueuingTelemetryTransport，ISO标准下的一种订阅模式的消息协议）的数据交互逻辑，具体为：提前确定配置文件，利用配置文件和JavaScript的随机函数周期性地变更出可控的数据，并将可控的数据用于项目演示期。本发明通过前端模拟器能够达到不需要做接口对接便可模拟出设备的运行参数的效果。

步骤S1包括以下分步骤：

S11、构建文件加载区，并利用文件加载区加载待处理的三维模型文件。

本发明构建文件加载区，并利用文件加载区加载待处理的三维模型文件。本发明在文件加载区利用基于WebGL的三维开发框架提供的加载工具加载待处理的三维模型文件。

具体地，本发明在加载前通过传入类型字段控制加载待处理的三维模型文件，利用IndexDB（一种前端数据库）技术存储以及读取待处理的三维模型文件，并在加载完成后自动为待处理的三维模型文件开启阴影产生以及阴影接收，以提高三维视觉效果。

S12、构建样式排版区，并利用样式排版区对待处理的三维模型文件进行样式排版。

本发明构建样式排版区，并利用样式排版区对待处理的三维模型文件进行样式排版。本发明利用Sass（SyntacticallyAwesomeStylesheets，层叠样式表语言）为三维可视化开发框架构建样式排版区，具体通过变量、迭代器、遍历器、判断器和函数构建样式排版区。本发明能方便地在二维和三维中实现对待处理的三维模型文件的样式排版，并能在utils（基于Sass的一套样式工具包）中根据项目的用户界面规范对样式排版进行自行调配。

样式排版区具体包括边框工具类样式、弹性盒子工具类样式、尺寸工具类样式、间距工具类样式和本文工具类样式。边框工具类样式，用于快速设置待处理的三维模型文件中边框的宽度、颜色、样式以及背景颜色。弹性盒子工具类样式，用于快速设置待处理的三维模型文件中弹性盒子的属性并内置有浏览器的兼容样式。尺寸工具类样式，用于快速设置待处理的三维模型文件中盒子模型的宽高。间距工具类样式，用于快速设置待处理的三维模型文件中元素指定大小的内间距与外间距。文本工具类样式，用于快速设置待处理的三维模型文件中文本的颜色、水平对齐方式和垂直对齐方式。

S13、构建优化操作区，并利用优化操作区对待处理的三维模型文件进行优化操作。

步骤S13包括以下分步骤：

S131、构建优化选择模块，利用优化选择模块选取适用于待处理的三维模型文件的优化处理方法，并根据选取的优化处理方法对待处理的三维模型文件进行优化处理。

具体地，本发明构建的优化选择模块中包括网格合并和几何体合并两种优化处理方法。

本发明将重复多且仅是大小、旋转、位置不一样、不需要针对内部单个模型做复杂交互或者只需要做点击交互的待处理的三维模型文件进行网格合并处理。网格合并具体过程为：先从待处理的三维模型文件中提取出重复且只是大小、旋转、位置不一样的模型，将这些模型储存为JSON格式的数据集，并确定模型的数据长度；再从JSON格式的数据集中提取出任意一个模型，模型的三维坐标值均为0，旋转值均为0，缩放值均为1；再通过文件加载区加载模型，并得到模型中的几何形状和材质；再根据模型的数据长度、几何形状和材质，并利用网格合并构建一个网格模型；最后通过迭代函数迭代JSON格式的数据集，并通过网格模型的设置矩阵方法将所有数据进行还原以获取网格合并处理后的三维模型文件。网格合并内存占用低，渲染效率比几何体合并高很多。

本发明将模型数据量多且不需要做任何交互的待处理的三维模型文件进行几何体合并处理。几何体合并具体过程为：先从待处理的三维模型文件中提取出模型数据量多且不需要做任何交互的模型，将这些模型储存为JSON格式的数据集，并确定模型的数据长度；再从JSON格式的数据集中提取出任意一个模型，模型可以不一致；再通过文件加载区加载模型，并得到模型中的几何形状和材质；再遍历需要合并的模型集合，并将几何形状和材质分别储存至几何形状合集和材质合集；再基于WebGL的三维开发框架提供的合并缓冲几何体方法将几何形状合集作为参数输入，形成一个几何形状；最后构建一个网格模型，将几何形状合集和材质合集作为两个参数输入，构建出一个全新的模型以获取几何体合并处理后的三维模型文件。几何体合并能减少基于WebGL的三维开发框架渲染循环，加快后续的渲染效率，并能对不同的模型进行合并。

S132、构建优化模型移除模块，利用优化模型移除模块对优化处理后的三维模型文件进行模型移除前的预处理。

本发明构建优化模型移除模块，利用优化模型移除模块对优化处理后的三维模型文件进行模型移除前的预处理。本发明在优化模型移除模块中利用新的移除模型方法，在移除模型之前分别调用模型的几何形状的释放方法以及材质的释放方法，即在移除模型前自动释放几何形状以及材质。

S14、构建园区加载切换区，并利用园区加载切换区对待处理的三维模型文件进行园区加载切换操作。

园区加载切换区包括园区加载选择模块和园区切换模块。

步骤S14包括以下分步骤：

S141、构建园区加载选择模块，利用园区加载选择模块选取适用于待处理的三维模型文件的园区加载方法，并根据选取的园区加载方法对待处理的三维模型文件进行园区加载。

园区加载方法包括单文件加载方法和多文件加载方法。

园区加载选择模块选取单文件加载方法对文件小的待处理的三维模型文件进行园区加载。单文件加载方法的具体过程为：先在三维开发框架中储存一个全局声明的园区实例缓存对象，确定园区名称并将园区名称与园区实例缓存对象进行对应；在加载园区前，先根据园区名称到园区实例缓存对象中查找园区实例对象，若找到园区实例对象，则直接返回到对应的园区实例对象并终止后续操作，否则进入后续操作；将三维开发框架中储存一个全局声明的园区类缓存对象，确定园区类型名称，并将园区类型名称与园区类缓存对象进行对应；再通过构建新的园区类型以动态构建园区实例对象，并通过模型名称将其加载到对应的园区模型以完成对待处理的三维模型文件的园区加载。

园区加载选择模块选取多文件加载方法对文件大的待处理的三维模型文件进行园区加载。多文件加载方法的具体过程为：先对文件大的待处理的三维模型文件进行拆分以获取子三维模型文件，并确定文件数量；再通过一个全局声明的园区实例缓存对象对子三维模型文件进行园区缓存读取；再通过一个全局声明的园区类缓存对象动态构建园区实例对象；再根据文件数量和浏览器并发数计算出一共需要加载的模型组数以及每组模型的数量；然后通过遍历函数循环，并通过文件加载区对模型进行加载，并记录当前组已加载的模型数以及总共加载的模型数；若当前已加载的模型数等于当前组需要加载的模型数时，则自动加载下一组模型；当最后一组模型加载完毕，那么代表整个园区分片加载完毕，将调用加载完毕回调函数，以完成对待处理的三维模型文件的园区加载。

S142、构建园区切换模块，利用园区切换模块对加载园区后的三维模型文件进行园区切换。

具体地，本发明构建园区切换模块，利用园区切换模块对加载园区后的三维模型文件进行园区切换。本发明为保障多个园区的共同协作性，在园区抽象类中提供了园区显示时所触发的钩子函数和园区隐藏时所触发的钩子函数。本发明通过先执行切换前的园区隐藏时所触发的钩子函数，再执行切换后的园区显示时所触发的钩子函数以对加载园区后的三维模型文件进行园区切换。

S15、构建线条美化区，并利用线条美化区对待处理的三维模型文件进行线条美化操作。

具体地，本发明构建线条美化区，并利用线条美化区对待处理的三维模型文件进行线条美化操作。本发明在线条美化区中利用基于WebGL的三维开发框架提供的线条几何形状，对待处理的三维模型文件进行线条美化操作，能够实现线条粗细可控。本发明利用线条美化区对待处理的三维模型文件进行线条美化操作，具体过程为：先获取待处理的三维模型文件中组成这些线段的三维坐标集，其中两个坐标点能形成一条线段；再构建线条几何形状实例，并调用其设置坐标集方法，将三维坐标集传入线条几何形状实例中构建几何线条，并使用设置颜色方法，为几何线条设置颜色；再构建线条材质实例，并通过设置其属性来控制其是实线还是虚线，设置线宽来控制线条的粗细，以及通过虚线缩放、虚线尺寸、间隔尺寸共同来控制虚线的线段大小；最后通过基于WebGL的三维开发框架提供的线条三维模型构建类，传入线条几何形状实例和线条材质实例以对待处理的三维模型文件进行线条美化操作。因WebGL的限制，普通线条的粗细长度只能为1。因此，本发明采用三维模型的方式来构建待处理的三维模型文件中的线条以对其进行美化。

S16、构建环境变量区，并利用环境变量区对设定的配置文件设置自定义环境变量。

具体地，本发明在环境变量区通过设定的配置文件定义待处理的三维模型文件中运行的环境，包括开发环境、测试环境和发布环境，并且在不同的环境中，通过在设定的配置文件中设置自定义环境变量以实现同一套代码在不同环境下均可运行。

S2、构建实体展示区，并利用实体展示区构建处理后的三维模型文件的三维实体展示图。

在本发明的一个可选实施例中，实体展示区包括园区构建区、三维面板构建区、图标构建区、天空盒构建区和轨迹线构建区。

步骤S2包括以下分步骤：

S21、构建园区构建区，并利用园区构建区构建处理后的三维模型文件的园区。

步骤S21包括以下分步骤：

S211、设置园区渲染模块，并利用园区渲染模块对处理后的三维模型文件进行渲染以获取三维模型渲染图。

具体地，园区渲染模块采用前端数据库将处理后的三维模型文件存储至浏览器。后续的渲染将直接从本地进行渲染。本发明通过设置园区渲染模块，除了首次的加载存储时间耗时长外，后续的渲染将缩短渲染时长。

本发明将处理后的三维模型文件存储至浏览器这一过程，采用二进制的方式存储处理后的三维模型文件，然后通过将二进制转换为网络地址的方式进行加载，以提升加载速度并减少加载过程的卡顿。

本发明在存储三维模型文件时同时存储一个版本标识，在后续渲染过程中将自动比对版本标识来确定三维模型文件是否需要更新，若是则重新下载并存储三维模型文件以对其进行渲染，若则直接从本地存储中获取三维模型文件并对其进行渲染。

S212、构建抗锯齿效果器，并利用抗锯齿效果器对三维模型渲染图进行平滑处理以获取三维模型渲染平滑图。

本发明利用抗锯齿效果器对三维模型渲染图进行平滑处理以获取三维模型渲染平滑图，具体过程为：先构建基于WebGL的三维开发框架提供的抗锯齿效果器；再构建用于将多个不同的效果器同时作用于同一场景的效果合成器，并将抗锯齿效果器添加至效果合成器；最后在主循环函数中执行效果合成器的渲染函数，持续对三维模型渲染图进行平滑处理以获取三维模型渲染平滑图。

S213、构建亮度校正效果器，并利用亮度校正效果器对三维模型渲染平滑图进行色彩修正以获取处理后的三维模型文件的园区。

本发明因使用了效果合成器，会导致场景的颜色失真，使得整体色彩暗。

因此，本发明利用亮度校正效果器对三维模型渲染平滑图进行色彩修正以获取处理后的三维模型文件的园区，具体过程为：先构建基于WebGL的三维开发框架提供的亮度校正效果器；再将亮度校正效果器添加至效果合成器中；最后在主循环函数中执行效果合成器的渲染函数，对三维模型渲染平滑图进行色彩修正以获取处理后的三维模型文件的园区。

S22、构建三维面板构建区，并利用三维面板构建区构建处理后的三维模型文件的三维面板。

本发明构建三维面板构建区，并利用三维面板构建区构建处理后的三维模型文件的三维面板。三维面板构建区包括三维面板内容的静态方法模块、修改简易网页视图对象的方法模块、支持Vue语法的三维面板内容的静态方法模块和开启关联线条模块。Vue为前端主流开发框架之一。

三维面板内容的静态方法模块，具体工作过程为：通过Web提供的接口先后创建两个网页视图对象，分别将其确定为对象文件和偏移对象文件，并将偏移对象文件添加至对象文件中；再通过网页视图对象的内置属性，将从框架传入的字符串形式的网页视图内容赋值至偏移对象文件；最后将构建的对象文件执行返回操作，以实现处理后的三维模型文件的三维面板内容的构建。

修改简易网页视图对象的方法模块，具体工作过程为：通过网页视图对象内置的方法，查询到偏移对象文件的位置；再通过输入新的字符串形式的网页视图内容至偏移对象文件中内置属性，以实现处理后的三维模型文件的简易网页视图对象的修改。

支持Vue语法的三维面板内容的静态方法模块，具体工作过程为：通过Web提供的接口先后创建两个网页视图对象，分别将其确定为对象文件和偏移对象文件，并将偏移对象文件添加至对象文件中；再构建一个网页视图对象，将其确定为Vue对象文件，并将其添加至偏移对象文件中；再通过Vue提供的接口，利用创建应用程序方法构建一个新的Vue实例对象应用程序；再将新的Vue实例对象应用程序设置在Vue对象文件中以形成单例对象；最后返回至构建好的对象文件和单例对象，以实现处理后的三维模型文件的支持Vue语法的三维面板内容的构建。

开启关联线条模块，具体工作过程为：先确定线条的起始三维坐标和结束三维坐标；再构建二进制几何模型，并将线条的起始三维坐标和结束三维坐标输入至二进制几何模型以构建线条几何模型；再根据线条颜色与线条材质的对应关系构建线条材质；再根据线条几何模型和线条材质构建线条模型；最后将构建的线条模型添加至三维面板中，以完成处理后的三维模型文件的三维面板与线条的关联。

S23、构建图标构建区，并利用图标构建区构建处理后的三维模型文件的图标。

本发明构建图标构建区，并利用图标构建区构建处理后的三维模型文件的图标。本发明利用图标构建区构建处理后的三维模型文件的图标，具体过程为：构建贴图加载器，并对贴图加载器进行初始化；再利用贴图加载器的加载方法，输入图片地址，并根据图片地址构建贴图；再根据贴图构建出精灵材质；最后将精灵材质传入至处理后的三维模型文件，以完成对处理后的三维模型文件的图标的构建。

S24、构建天空盒构建区，并利用天空盒构建区构建处理后的三维模型文件的天空盒。

本发明构建天空盒构建区，并利用天空盒构建区构建处理后的三维模型文件的天空盒。天空盒构建区包括内置天空盒模块、自定义天空盒模块。

内置天空盒模块包括水面、草原、天空和阴天4种天空盒。本发明可根据不同园区选择不同的天空盒。

自定义天空盒模块能选择指定图片，并按照指定命令顺序构建自定义的天空盒。

本发明利用天空盒构建区构建处理后的三维模型文件的天空盒，具体过程为：先构建立方体贴图加载器，并对立方体贴图加载器进行初始化；再对立方体贴图加载器设置基本加载地址；再利用立方体贴图加载器的加载方法，并根据基本加载地址输入一组天空盒图片以形成立方体贴图；最后将立方体贴图输入至处理后的三维模型文件中场景的背景属性，以构建处理后的三维模型文件的天空盒。

S25、构建轨迹线构建区，并利用轨迹线构建区构建处理后的三维模型文件的轨迹线。

本发明构建轨迹线构建区，并利用轨迹线构建区构建处理后的三维模型文件的轨迹线。轨迹线构建区包括初始轨迹线构建模块和曲线坐标集构建模块。

本发明利用初始轨迹线构建模块构建处理后的三维模型文件的初始轨迹线，使得模型内的车辆和人员能够按照初始轨迹线进行运动。本发明利用初始轨迹线构建模块构建处理后的三维模型文件的初始轨迹线，具体过程为：初始化补间动画的时间轴；再通过JavaScript接口的数组迭函数遍历轨迹线的坐标，并通过基于WebGL的三维开发框架提供的三维坐标距离计算方法，计算出每条轨迹线段的距离，并确定轨迹线的总长度；再将每条轨迹线段的距离除以轨迹线的总长度，确定每条线段的运动时长；最后通过补间动画构建函数构建每条线段的补间动画实例，并将补间动画实例添加至初始化的补间动画的时间轴上，以构建处理后的三维模型文件的初始轨迹线。

本发明利用曲线坐标集构建模块对初始轨迹线进行平滑曲线处理，使得初始轨迹线更加平滑。本发明利用曲线坐标集构建模块对初始轨迹线进行平滑曲线处理，具体过程为：构建基于WebGL的三维开发框架的二次贝塞尔曲线和三次贝塞尔曲线；最后根据二次贝塞尔曲线和三次贝塞尔曲线将初始轨迹线中的坐标集转换为光滑的贝塞尔坐标集，以对初始轨迹线进行平滑曲线处理。

S3、设置平台组件，利用平台组件在三维实体展示图中进行三维漫游和用户界面九宫格化处理。

在本发明的一个可选实施例中，平台组件包括三维漫游组件和九宫格用户界面组件。

步骤S3包括以下分步骤：

S31、设置三维漫游组件，利用三维漫游组件在三维实体展示图中进行三维漫游以对园区进行实景检测。

本发明设置三维漫游组件，利用三维漫游组件在三维实体展示图中进行三维漫游以对园区进行实景检测。本发明在三维漫游组件不仅能控制摄像机根据预设的路线进行移动，还能根据漫游控制盘精准控制漫游的速度、视角、进度、播放、暂停，并能控制漫游回到初始位置。

本发明利用三维漫游组件在三维实体展示图中进行三维漫游以对园区进行实景检测，具体过程为：先利用补间动画的时间轴构建漫游轨迹，并将摄像机的三维坐标作为漫游轨迹的坐标；确定摄像机的默认观看点，根据摄像机的三维坐标确定摄像机所有的观看点，并将漫游轨迹中轨迹线段总长度的80%处设置为观看点切换位置，以完成整个漫游轨迹的构建；最后通过补间动画提供的方法执行时间轴的时间点调整、动画暂停、动画继续播放、动画重新播放和移动倍速，以利用三维漫游组件在三维实体展示图中进行三维漫游。

S32、设置九宫格用户界面组件，利用九宫格用户界面组件对三维实体展示图中外观一致的图片进行用户界面九宫格化处理。

本发明利用九宫格用户界面组件对三维实体展示图中外观一致的图片进行用户界面九宫格化处理，具体过程为：确定裁切原点和裁切盒子尺寸；再根据裁切原点和裁切盒子尺寸，利用画布的绘制图片功能，将三维实体展示图中外观一致的图片进行裁切，获取9张分图；最后通过层叠样式表中的网格布局方法，将9张分图输入至网页视图中，将设定分图的宽高进行固定，并将其余分图按照分辨率需求进行放大或缩小，以实现对三维实体展示图中外观一致的图片的用户界面九宫格化处理。

本发明是参照根据本发明实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。

这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。

这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。

本发明中应用了具体实施例对本发明的原理及实施方式进行了阐述，以上实施例的说明只是用于帮助理解本发明的方法及其核心思想；同时，对于本领域的一般技术人员，依据本发明的思想，在具体实施方式及应用范围上均会有改变之处，综上所述，本说明书内容不应理解为对本发明的限制。

本领域的普通技术人员将会意识到，这里所述的实施例是为了帮助读者理解本发明的原理，应被理解为本发明的保护范围并不局限于这样的特别陈述和实施例。本领域的普通技术人员可以根据本发明公开的这些技术启示做出各种不脱离本发明实质的其它各种具体变形和组合，这些变形和组合仍然在本发明的保护范围内。

Claims (6)

1.一种三维可视化开发框架构建方法，其特征在于，包括以下步骤：

S1、构建工具区，并利用工具区对待处理的三维模型文件进行工具化处理，以确定处理后的三维模型文件；

工具区包括文件加载区、样式排版区、优化操作区、园区加载切换区、线条美化区和环境变量区；

步骤S1包括以下分步骤：

S11、构建文件加载区，并利用文件加载区加载待处理的三维模型文件；

S12、构建样式排版区，并利用样式排版区对待处理的三维模型文件进行样式排版；

S13、构建优化操作区，并利用优化操作区对待处理的三维模型文件进行优化操作；

S14、构建园区加载切换区，并利用园区加载切换区对待处理的三维模型文件进行园区加载切换操作；

S15、构建线条美化区，并利用线条美化区对待处理的三维模型文件进行线条美化操作；

S16、构建环境变量区，并利用环境变量区对设定的配置文件设置自定义环境变量以实现同一套代码在不同环境下均可运行；

S2、构建实体展示区，并利用实体展示区构建处理后的三维模型文件的三维实体展示图；

S3、设置平台组件，利用平台组件在三维实体展示图中进行三维漫游和用户界面九宫格化处理；

平台组件包括三维漫游组件和九宫格用户界面组件；

步骤S3包括以下分步骤：

S31、设置三维漫游组件，利用三维漫游组件在三维实体展示图中进行三维漫游以对园区进行实景检测；

S32、设置九宫格用户界面组件，利用九宫格用户界面组件对三维实体展示图中外观一致的图片进行用户界面九宫格化处理。

2.根据权利要求1所述的一种三维可视化开发框架构建方法，其特征在于，步骤S13包括以下分步骤：

S131、构建优化选择模块，利用优化选择模块选取适用于待处理的三维模型文件的优化处理方法，并根据选取的优化处理方法对待处理的三维模型文件进行优化处理；

S132、构建优化模型移除模块，利用优化模型移除模块对优化处理后的三维模型文件进行模型移除前的预处理。

3.根据权利要求1所述的一种三维可视化开发框架构建方法，其特征在于，步骤S14包括以下分步骤：

S141、构建园区加载选择模块，利用园区加载选择模块选取适用于待处理的三维模型文件的园区加载方法，并根据选取的园区加载方法对待处理的三维模型文件进行园区加载；

S142、构建园区切换模块，利用园区切换模块对加载园区后的三维模型文件进行园区切换。

4.根据权利要求1所述的一种三维可视化开发框架构建方法，其特征在于，在步骤S2中，实体展示区包括园区构建区、三维面板构建区、图标构建区、天空盒构建区和轨迹线构建区。

5.根据权利要求4所述的一种三维可视化开发框架构建方法，其特征在于，步骤S2包括以下分步骤：

S21、构建园区构建区，并利用园区构建区构建处理后的三维模型文件的园区；

S22、构建三维面板构建区，并利用三维面板构建区构建处理后的三维模型文件的三维面板；

S23、构建图标构建区，并利用图标构建区构建处理后的三维模型文件的图标；

S24、构建天空盒构建区，并利用天空盒构建区构建处理后的三维模型文件的天空盒；

S25、构建轨迹线构建区，并利用轨迹线构建区构建处理后的三维模型文件的轨迹线。

6.根据权利要求5所述的一种三维可视化开发框架构建方法，其特征在于，步骤S21包括以下分步骤：

S211、设置园区渲染模块，并利用园区渲染模块对处理后的三维模型文件进行渲染以获取三维模型渲染图；

S212、构建抗锯齿效果器，并利用抗锯齿效果器对三维模型渲染图进行平滑处理以获取三维模型渲染平滑图；

S213、构建亮度校正效果器，并利用亮度校正效果器对三维模型渲染平滑图进行色彩修正以获取处理后的三维模型文件的园区。