一种网页端的多级缓存的三维模型加载方法技术

本发明专利技术涉及三维模型加载技术领域，具体涉及一种网页端的多级缓存的三维模型加载方法，该方法包括：将组建场景的glb模型文件上传至模型库，从模型库中选择模型，通过拖拉拽的形式创建场景，提取场景数据进行保存，并将保存后的场景数据上传至服务器；浏览器通过多级缓存加载场景。将设置好的glb模型以图片形式保存在菜单栏，可节约加载时间；将模型进行分类，一部分存入浏览器内存，一部分存入本地缓存数据库，可以有效提升网页端三维模型的加载速度，在初次加载时，加载时间控制在6秒以内，后续利用本地缓存和浏览器内存这种多级加载的方式，时间优化到3秒以内。时间优化到3秒以内。时间优化到3秒以内。

【技术实现步骤摘要】
一种网页端的多级缓存的三维模型加载方法


[0001]本专利技术涉及三维模型加载
，具体涉及一种网页端的多级缓存的三维模型加载方法。

技术介绍

[0002]楼宇自控是指对建筑设备管理系统、消防自动报警系统、公共安全系统、智能卡应用系统、信息引导及发布系统、设备与工程档案管理系统等进行统一集成，实现楼宇信息高度共享。楼控行业往往需要三维模型来展示建筑、设备情况，而基于浏览器自身的局限性，如何在网页中流畅的展示和操作大型的三维模型成为了该领域技术人员所关注的核心问题。
[0003]现有的三维模型加载技术，在实际操作中存在诸多问题，由于受浏览器和显卡的能力限制，目前在网页端只能对小型的三维模型和场景进行正常的加载及渲染；如果用现有技术加载较大的模型，会超过显卡的承受能力，从而使得模型加载缓慢，甚至出现浏览器崩溃的情况。而楼控行业往往需要对很大的场景或者比较精细的模型进行加载，通过现有加载技术只能导致加载失败。
[0004]即使通过拖拉拽的形式将三维模型上传至服务器，然后加载渲染展示，能够在网页中成功加载大型的三维模型，由于有些场景本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种网页端的多级缓存的三维模型加载方法，其特征在于，所述方法包括如下步骤：S1：将组建场景的glb模型文件上传至模型库，从模型库中选择模型，通过拖拉拽的形式创建场景，提取场景数据进行保存，并将保存后的场景数据上传至服务器；S2：浏览器通过多级缓存加载场景，具体包括：S21：网页端进入场景页面，加载场景时通过网络请求获取场景数据，所述场景数据分为json格式和glb格式，所述json格式和glb格式的文件用2个接口分开请求；S22：判断浏览器内存中是否存在相同的glb模型文件，若有，则从浏览器内存中获取所述glb模型文件，直接进入步骤S26，若无，则进入步骤S23；S23：判断本地缓存中是否存在相同的glb模型文件，若有，则从本地缓存获取所述glb模型文件，进入步骤S24，若无，则进入步骤S25；S24：判断获取到的glb模型文件是否需要存储到浏览器内存中，若符合条件，则存储至浏览器内存，若不符合条件，则不做任何处理，进入步骤S26；S25：发起网络请求，获取所述glb模型文件，并缓存到本地，进入步骤S24；S26：渲染场景中的glb模型文件；S27：glb模型文件结合所述场景数据完成场景加载。2.根据权利要求1所述的一种网页端的多级缓存的三维模型加载方法，其特征在于，所述步骤S1具体分为以下步骤：S11：内置glb模型文件到模型库，并设置glb模型的模型基础数据；S12：将设置好的glb模型下载到本地，以图片形式保存在菜单栏以供选择；S13：选中glb模型，通过拖拉拽的形式创建场景，设置模型参数、场景参数；S14：提取所创建场景的场景数据，点击保存按钮进行保存；S15：将保存后的场景数据上传至服务器。3.根据权利要求2所述的一种网页端的多级缓存的三维模型加载方法，其特征在于，所述步骤S13包括以下步骤：S131：点击菜单栏中glb模型的图片，拖入浏览器场景绘制区域，发起本地请求；S132：从本地获取glb模型文件并进行解析，在浏览器中渲染出三维模型；S133：点击渲染完成的三维模型，通过空间直角坐标系和中心点的坐标位置，按住鼠标左键拖动三维模型进行位置修改；S134：通过浏览器的工具栏设置模型的尺寸大小、在空间直角坐标系内的位置、旋转角度，以及空间直角坐标系内的比例参数；S135：判断三维模型有无高级属性，若有，则进入步骤S136，若无，则直接进...

【专利技术属性】
技术研发人员：王戎，曾强，高同达，
申请(专利权)人：江苏正泰泰杰赛智能科技有限公司，
类型：发明
国别省市：