CN107219969B - 3d显示方法和装置 - Google Patents
3d显示方法和装置 Download PDFInfo
- Publication number
- CN107219969B CN107219969B CN201710327813.5A CN201710327813A CN107219969B CN 107219969 B CN107219969 B CN 107219969B CN 201710327813 A CN201710327813 A CN 201710327813A CN 107219969 B CN107219969 B CN 107219969B
- Authority
- CN
- China
- Prior art keywords
- scenes
- webpage
- model files
- models
- scene
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
- G06F3/04815—Interaction with a metaphor-based environment or interaction object displayed as three-dimensional, e.g. changing the user viewpoint with respect to the environment or object
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T19/00—Manipulating 3D models or images for computer graphics
- G06T19/20—Editing of 3D images, e.g. changing shapes or colours, aligning objects or positioning parts
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F2203/00—Indexing scheme relating to G06F3/00 - G06F3/048
- G06F2203/048—Indexing scheme relating to G06F3/048
- G06F2203/04802—3D-info-object: information is displayed on the internal or external surface of a three dimensional manipulable object, e.g. on the faces of a cube that can be rotated by the user
Abstract
本发明公开了一种3D显示方法和装置。其中,该方法包括:获取待载入网页页面的3D模型文件,其中,3D模型文件包括3D物体或角色;将3D模型文件的格式与网页页面进行格式适配,得到适配后的3D模型文件;在网页页面创建3D场景;在网页页面的3D场景中导入适配后的3D模型文件,得到导入的3D模型文件;对导入的3D模型文件进行渲染。本发明解决了由于只能在客户端实现3D游戏效果造成的使用局限性高的技术问题。
Description
技术领域
本发明涉及3D显示领域,具体而言,涉及一种3D显示方法和装置。
背景技术
在3D显示领域中,例如3D游戏,游戏中的人物、场景和基础地形等都是使用三维立体模型实现的,玩家可以旋转视角,从多个角度观看游戏,增加了游戏的自由度和趣味性,具有更好的用户体验,但是现有技术中,用户在想要玩3D游戏时,必须在终端安装APP,通过APP实现3D模型的渲染与操作,PC和移动端用户在安装了APP的终端之后可以查看并操控模型。
但是由于必须安装游戏APP才能实现3D显示,受到很多限制,例如,安装APP需要时间成本和宽带要求,也不利于户外广告宣传,大多数用户不愿意在非WIFI条件下下载游戏APP,影响用户体验,并且,对于不同的平台需要下载不同的游戏APP和应用,而PC端与移动端无法共用一套代码,对于开发者来说也增加了工作量。
针对上述的问题,目前尚未提出有效的解决方案。
发明内容
本发明实施例提供了一种3D显示方法和装置,以至少解决由于只能在客户端实现3D游戏效果造成的使用局限性高的技术问题。
根据本发明实施例的一个方面,提供了一种3D显示方法,包括:获取待载入网页页面的3D模型文件,其中,所述3D模型文件包括3D物体或角色;将所述3D模型文件的格式与网页页面进行格式适配,得到适配后的3D模型文件;在所述网页页面创建3D场景;在所述网页页面的3D场景中导入所述适配后的3D模型文件,得到导入的3D模型文件;对所述导入的3D模型文件进行渲染。
根据本发明实施例的另一方面,还提供了一种3D显示装置,包括:获取单元,用于获取待载入网页页面的3D模型文件,其中,所述3D模型文件包括3D物体或角色;适配单元,用于将所述3D模型文件的格式与网页页面进行格式适配,得到适配后的3D模型文件;创建单元,用于在所述网页页面创建3D场景;导入单元,用于在所述网页页面的3D场景中导入所述适配后的3D模型文件,得到导入的3D模型文件;渲染单元,用于对所述导入的3D模型文件进行渲染。
在本发明实施例中,采用获取待载入网页页面的3D模型文件,将3D模型文件的格式与网页页面进行格式适配,然后在网页页面中创建3D场景,在创建好的场景中导入适配后的3D模型文件,然后对导入的3D模型文件进行渲染,通过将所述3D模型文件的格式与网页页面进行格式适配,然后在网页页面中创建3D场景并在3D场景中对模型文件进行渲染,达到了在网页页面中实现3D显示效果的目的,从而实现了提高3D游戏使用场景的灵活性的技术效果,进而解决了由于只能在客户端实现3D游戏效果造成的使用局限性高的技术问题。
附图说明
此处所说明的附图用来提供对本发明的进一步理解,构成本申请的一部分,本发明的示意性实施例及其说明用于解释本发明,并不构成对本发明的不当限定。在附图中:
图1是根据本发明实施例的3D显示方法的硬件环境的示意图;
图2是根据本发明实施例的一种可选的3D显示方法的流程图;
图3是根据本发明实施例的一种可选的3D显示方法的流程图;
图4是根据本发明实施例的一种可选的3D显示装置的示意图;
以及
图5是根据本发明实施例的一种终端的结构框图。
具体实施方式
为了使本技术领域的人员更好地理解本发明方案,下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本发明一部分的实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都应当属于本发明保护的范围。
需要说明的是,本发明的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象,而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换,以便这里描述的本发明的实施例能够以除了在这里图示或描述的那些以外的顺序实施。此外,术语“包括”和“具有”以及他们的任何变形,意图在于覆盖不排他的包含,例如,包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元,而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。
首先,在对本发明实施例进行描述的过程中出现的部分名词或者术语适用于如下解释:
1、WebGL:网页图形库,Web Graphics Library。
2、3ds MAX:一种用来制作3D模型、动画、特效等的电脑软件。
3、unity:用来在3ds MAX中融合动画之间联系的动画引擎工具。
4、Maya:一种三维建模渲染和三维动画制作软件。
5、模型:在3ds MAX中创建的3D物体或人物形象。
6、骨骼:在3ds MAX中创建的用来控制模型动画的虚拟物体。
7、蒙皮:在3ds MAX中把模型面数和顶点附着在骨骼上的叫法。
8、绑定:把3ds MAX中的骨骼附着到模型上,通过骨骼控制模型动作的一种行为叫法。
实施例1
根据本发明实施例,提供了一种3D显示的方法实施例。
可选地,在本实施例中,上述3D显示方法可以应用于如图1所示的由服务器102和终端104所构成的硬件环境中。如图1所示,服务器102通过网络与终端104进行连接,上述网络包括但不限于:广域网、城域网或局域网,终端104并不限定于PC、手机、平板电脑等。本发明实施例的3D显示方法可以由服务器102来执行,也可以由终端104来执行,还可以是由服务器102和终端104共同执行。其中,终端104执行本发明实施例的3D显示方法也可以是由安装在其上的客户端来执行。
在一种可选的应用场景中,由终端读取待载入网页页面的3D模型文件,然后将读取到的模型文件的格式进行调整,以获得与当前网页页面的格式适配的模型文件,在网页页面内创建3D场景,在创建好的场景中导入适配后的3D模型文件,然后对导入的3D模型文件进行渲染,也可以由终端读取待载入网页页面的3D模型文件之后将文件发送到服务器,由服务器进行处理,然后将处理结果发送回终端显示。
图2是根据本发明实施例的一种可选的3D显示方法的流程图,如图2所示,该方法可以包括以下步骤:
步骤S202,获取待载入网页页面的3D模型文件,其中,3D模型文件包括3D物体或角色。
步骤S204,将3D模型文件的格式与网页页面进行格式适配,得到适配后的3D模型文件。
步骤S206,在网页页面创建3D场景。
步骤S208,在网页页面的3D场景中导入适配后的3D模型文件,得到导入的3D模型文件。
步骤S210,对导入的3D模型文件进行渲染。
通过上述步骤S202至步骤S210,通过将所述3D模型文件的格式与网页页面进行格式适配,然后在网页页面中创建3D场景并在3D场景中对模型文件进行渲染,可以解决由于只能在客户端实现3D游戏效果造成的使用局限性高的技术问题,进而达到提高3D游戏使用场景的灵活性的技术效果。
在步骤S202提供的技术方案中,3D模型文件可以是需要载入页面的3D物体或角色的文件,这些文件可以是多种格式的。
在步骤S204提供的技术方案中,在获取了待载入网页页面的3D模型文件之后,需要转换文件格式,将文件转换成web端可用的形式,因此,将3D模型文件的格式与网页页面进行格式适配,得到适配后的3D模型文件。
在步骤S206提供的技术方案中,在网页页面中创建3D场景,也可以是在网页内搭建web3D环境,搭建web3D环境的过程可以包括多个步骤,例如,包括对3D场景中的多种对象进行初始化或者定位等步骤。
在步骤S208提供的技术方案中,在完成格式适配和创建3D场景之后,在3D场景中导入适配后的3D模型文件,由于适配后的3D模型文件是当前网页页面可用的格式,因此,可以在3D场景中导入适配后的3D模型文件,适配后的3D模型文件可以是多个文件,多个文件可以是单一格式的,也可以是多个格式的,但是多个格式需要都是当前网页页面中可用的格式。
在步骤S210提供的技术方案中,在网页页面的3D场景中导入适配后的3D模型文件之后,对导入的3D模型文件进行渲染,以使3D模型文件最终呈现出效果图或者动画效果,对导入的3D模型文件进行渲染可以通过多种类型的软件进行。
作为一种可选的实施例,在网页页面创建3D场景之前,判断当前浏览器是否支持3D场景渲染功能,其中,如果判断出当前浏览器支持3D场景渲染功能,则在网页页面创建3D场景。浏览器是当前网页页面所使用的浏览器,如果当前网页页面所使用的浏览器支持3D场景渲染功能,则可以在网页页面中创建3D场景,如果当前网页页面所使用的浏览器不支持3D场景渲染功能,则降级进入普通web页面,不创建3D场景。
作为一种可选的实施例,在网页页面创建3D场景包括:载入预设的3D引擎组件库,对3D场景进行渲染;对待置入3D场景中的对象进行初始化;将初始化之后的3D场景中的对象置入3D场景中;渲染3D场景中的相机中可见区域的场景。预设的3D引擎组件库可以是threejs库及相关组件库,通过预设的3D引擎组件库对3D场景进行渲染,还需要对待置入3D场景中的对象进行初始化,包括3D场景相机初始化,初始化3D场景对象定位,然后将初始化之后的物体置入3D场景中,对3D场景中的相机可见区域的场景进行渲染。
作为一种可选的实施例,对待置入3D场景中的对象进行初始化包括:初始化3D场景相机;绑定重力感应;初始化3D场景的灯光;初始化3D场景的对象定位。将待置入3D场景中的对象进行初始化可以是初始化3D场景相机,绑定重力感应功能,初始化3D场景中的灯光、对象定位等多种对象。
作为一种可选的实施例,对导入的3D模型文件进行渲染可以通过以下步骤:在网页中声明加载器;遍历导入的3D模型的材质,将材质的皮肤属性设置为可见;对3D模型进行初始化三维定位。
作为一种可选的实施例,在对3D模型进行初始化三维定位之后,遍历3D模型内的动画;按照时间序列将角色的动作进行裁剪;将加载完成的3D模型置入场景定位点中;对3D模型的中角色动作控制进行交互绑定。
本发明还提供了一种优选实施例,该优选实施例包括以下步骤:
1、在3D编辑软件(例如:3ds max,maya,unity等软件)中调试需要载入页面的3D模型。
2、在3D编辑软件中载入web端模型导出脚本(例如:ThreeJSAnimationExporter.ms),调整模型骨骼,蒙皮对应信息,选择web需要的数据(例如:json)进行导出。
3、在网页中搭建web3D环境。
(1)载入threejs库及相关组件库,渲染场景,代码可以是scene=newTHREE.Scene();
(2)初始化3D场景相机,代码可以是camera=new THREE.PerspectiveCamera(90,camera_w/camera_h,1,1000);
(3)绑定重力感应,代码可以是controls=newTHREE.DeviceOrientationControls(camera);
(4)初始化3d场景灯光,代码可以是light=new THREE.AmbientLight(0x404040,3);
(5)初始化3d场景对象定位,代码可以是:
(6)将所有的初始化物体置入场景中,代码可以是:
scene.add(light);
scene.add(poi_jc);
(7)渲染相机中可见区域的场景,代码可以是:
renderer=new THREE.WebGLRenderer({antialias:true,alpha:true});
renderer.render(scene,camera);
4、在web3d中引入3D模型的json格式文件渲染并进行调试。
(1)在web中声明加载器,代码可以是loader=new THREE.JSONLoader();
(2)遍历模型内的材质,将材质的skinning(皮肤)设为true(显示),代码可以是:
(3)初始化模型的3维定位,代码可以是:
mesh.position.set(0,0,0);
mesh.scale.set(1,1,1);
mesh.rotation.set(1,1,1);
(4)遍历模型内动画,并将动作细分裁剪,代码可以是:
mixer=new THREE.AnimationMixer(mesh);
ani=geometry.animations[0];
action=mixer.clipAction(ani);
(5)将加载完成的模型置入场景定位点中,代码可以是:poi_dc.add(moxing);
(6)对模型文件动作进行交互绑定,代码可以是:
moxing.action.time=0;
moxing.action.setEffectiveTimeScale(1);
5、渲染页面,至此用户可以直接在网页中查看并操作3d模型。
web3D可以实现跨平台3D渲染,用户无需针对不同的平台去下载不同的APP及3D软件,并且web3D可实现点开即玩,实时更新,无需每个版本重新下载一遍APP更新包,节省用户时间和网络流量。
图3是根据本发明实施例的一种可选的3D显示方法的流程图,如图3所示,该方法可以包括以下步骤:
步骤S301,在3D软件中编辑模型。
打开模型文件,调整节点蒙皮数据,调试成web端可用的形式。
步骤S302,导出web端可用的模型文件。
导出为web端可识别格式(json)格式,并将tga图片转为png格式。
步骤S303,判断当前浏览器是否支持3D模型。
判断当前浏览器是否支持webgl,支持threejs中的着色器shader,不支持则执行步骤S307跳过模型渲染,进入普通web页。支持进入下一步S304。
步骤S304,判断web端是否支持创建3D场景。
判断当前浏览器是否支持3d场景渲染,如果不支持则执行步骤S307跳过场景渲染,进入普通web页。支持则执行S305。
步骤S305,创建3D场景。
在页面内创建场景,代码可以为:scene=new THREE.Scene();添加灯光scene.add(new THREE.AmbientLight(0x404040,3));。
步骤S306,渲染3D模型。
var loader=new THREE.JSONLoader();
loader.load("模型json路径",function(geometry,materials){});。
需要说明的是,在本发明实施例中,有很多替代实施方案都属于本发明的保护范围,例如,导出的模型格式除了json还可以是obj,dae,mtl格式,导出的图片也可以是dds,tga,jpg,gif格式,场景相机除了透视相机,也可以使用正交相机替代,场景光源除了环境光还可使用平行光及聚焦光,在pc端中,重力感应绑定可替换为鼠标绑定。
通过本发明实施例的技术方案,从3D编辑软件中导出3D模型的json格式,在网页上创建3D场景并导入json文件并渲染3D模型,通过一系列网页命令实现用户在网页上直接进行3D模型的交互操作,用户可以随时随地打开3D模型,预览并操作游戏,相较以往2D的页面体验,3D模型让玩家更容易有带入感,对于页面留存有很高的积极作用。在Web端就能够实现3D模型渲染,大大降低了用户接触3D效果的门槛,可有效提升用户对3D效果的适应性,并且,Web端实现3D模型渲染可以打破PC与移动端的隔阂,同一套代码可同时应用于两个平台。
需要说明的是,对于前述的各方法实施例,为了简单描述,故将其都表述为一系列的动作组合,但是本领域技术人员应该知悉,本发明并不受所描述的动作顺序的限制,因为依据本发明,某些步骤可以采用其他顺序或者同时进行。其次,本领域技术人员也应该知悉,说明书中所描述的实施例均属于优选实施例,所涉及的动作和模块并不一定是本发明所必须的。
通过以上的实施方式的描述,本领域的技术人员可以清楚地了解到根据上述实施例的方法可借助软件加必需的通用硬件平台的方式来实现,当然也可以通过硬件,但很多情况下前者是更佳的实施方式。基于这样的理解,本发明的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质(如ROM/RAM、磁碟、光盘)中,包括若干指令用以使得一台终端设备(可以是手机,计算机,服务器,或者网络设备等)执行本发明各个实施例所述的方法。
实施例2
根据本发明实施例,还提供了一种用于实施上述3D显示方法的3D显示装置。图4是根据本发明实施例的一种可选的3D显示装置的示意图,如图4所示,该装置可以包括:获取单元10、适配单元20、创建单元30、导入单元40、渲染单元50。
获取单元10,用于获取待载入网页页面的3D模型文件,其中,3D模型文件包括3D物体或角色。
适配单元20,用于将3D模型文件的格式与网页页面进行格式适配,得到适配后的3D模型文件。
创建单元30,用于在网页页面创建3D场景。
导入单元40,用于在网页页面的3D场景中导入适配后的3D模型文件,得到导入的3D模型文件。
渲染单元50,用于对导入的3D模型文件进行渲染。
可选地,该装置还包括:判断单元。判断单元,用于在网页页面创建3D场景之前,判断当前浏览器是否支持3D场景渲染功能,其中,如果判断出当前浏览器支持3D场景渲染功能,则在网页页面创建3D场景。
可选地,创建单元30包括:载入模块、初始化模块、置入模块、渲染模块。载入模块,用于载入预设的3D引擎组件库,对3D场景进行渲染。初始化模块,用于对待置入3D场景中的对象进行初始化。置入模块,用于将初始化之后的3D场景中的对象置入3D场景中。渲染模块,用于渲染3D场景中的相机中可见区域的场景。
可选地,初始化模块用于:初始化3D场景相机;绑定重力感应;初始化3D场景的灯光;初始化3D场景的对象定位。
可选地,渲染单元50包括:处理模块、遍历模块、定位模块。处理模块,用于在网页中声明加载器。遍历模块,用于遍历导入的3D模型的材质,将材质的皮肤属性设置为可见。定位模块,用于对3D模型进行初始化三维定位。
可选地,该装置还包括:遍历单元、裁剪单元、置入单元、绑定单元。遍历单元,用于在对3D模型进行初始化三维定位之后,遍历3D模型内的动画。裁剪单元,用于按照时间序列将角色的动作进行裁剪。置入单元,用于将加载完成的3D模型置入场景定位点中。绑定单元,用于对3D模型的中角色动作控制进行交互绑定。
需要说明的是,该实施例中的获取单元10可以用于执行本申请实施例1中的步骤S202,该实施例中的适配单元20可以用于执行本申请实施例1中的步骤S204,该实施例中的创建单元30可以用于执行本申请实施例1中的步骤S206,该实施例中的导入单元40可以用于执行本申请实施例1中的步骤S208,该实施例中的渲染单元50可以用于执行本申请实施例1中的步骤S210。
此处需要说明的是,上述模块与对应的步骤所实现的示例和应用场景相同,但不限于上述实施例1所公开的内容。需要说明的是,上述模块作为装置的一部分可以运行在如图1所示的硬件环境中,可以通过软件实现,也可以通过硬件实现。
通过上述模块,可以解决由于只能在客户端实现3D游戏效果造成的使用局限性高的技术问题,进而达到了提高3D游戏使用场景的灵活性的技术效果。
此处需要说明的是,上述模块与对应的步骤所实现的示例和应用场景相同,但不限于上述实施例1所公开的内容。需要说明的是,上述模块作为装置的一部分可以运行在如图1所示的硬件环境中,可以通过软件实现,也可以通过硬件实现,其中,硬件环境包括网络环境。
实施例3
根据本发明实施例,还提供了一种用于实施上述3D显示方法的服务器或终端。
图5是根据本发明实施例的一种终端的结构框图,如图5所示,该终端可以包括:一个或多个(图中仅示出一个)处理器201、存储器203、以及传输装置205(如上述实施例中的发送装置),如图5所示,该终端还可以包括输入输出设备207。
其中,存储器203可用于存储软件程序以及模块,如本发明实施例中的3D显示方法和装置对应的程序指令/模块,处理器201通过运行存储在存储器203内的软件程序以及模块,从而执行各种功能应用以及数据处理,即实现上述的3D显示方法。存储器203可包括高速随机存储器,还可以包括非易失性存储器,如一个或者多个磁性存储装置、闪存、或者其他非易失性固态存储器。在一些实例中,存储器203可进一步包括相对于处理器201远程设置的存储器,这些远程存储器可以通过网络连接至终端。上述网络的实例包括但不限于互联网、企业内部网、局域网、移动通信网及其组合。
上述的传输装置205用于经由一个网络接收或者发送数据,还可以用于处理器与存储器之间的数据传输。上述的网络具体实例可包括有线网络及无线网络。在一个实例中,传输装置205包括一个网络适配器(Network Interface Controller,NIC),其可通过网线与其他网络设备与路由器相连从而可与互联网或局域网进行通讯。在一个实例中,传输装置205为射频(Radio Frequency,RF)模块,其用于通过无线方式与互联网进行通讯。
其中,具体地,存储器203用于存储应用程序。
处理器201可以通过传输装置205调用存储器203存储的应用程序,以执行下述步骤:
获取待载入网页页面的3D模型文件,其中,3D模型文件包括3D物体或角色;将3D模型文件的格式与网页页面进行格式适配,得到适配后的3D模型文件;在网页页面创建3D场景;在网页页面的3D场景中导入适配后的3D模型文件,得到导入的3D模型文件;对导入的3D模型文件进行渲染。
处理器201还用于执行下述步骤:判断当前浏览器是否支持3D场景渲染功能,其中,如果判断出当前浏览器支持3D场景渲染功能,则在网页页面创建3D场景。
处理器201还用于执行下述步骤:载入预设的3D引擎组件库,对3D场景进行渲染;对待置入3D场景中的对象进行初始化;将初始化之后的3D场景中的对象置入3D场景中;渲染3D场景中的相机中可见区域的场景。
处理器201还用于执行下述步骤:初始化3D场景相机;绑定重力感应;初始化3D场景的灯光;初始化3D场景的对象定位。
处理器201还用于执行下述步骤:在网页中声明加载器;遍历导入的3D模型的材质,将材质的皮肤属性设置为可见;对3D模型进行初始化三维定位。
处理器201还用于执行下述步骤:遍历3D模型内的动画;按照时间序列将角色的动作进行裁剪;将加载完成的3D模型置入场景定位点中;对3D模型的中角色动作控制进行交互绑定。
可选地,本实施例中的具体示例可以参考上述实施例1和实施例2中所描述的示例,本实施例在此不再赘述。
本领域普通技术人员可以理解,图5所示的结构仅为示意,终端可以是智能手机(如Android手机、iOS手机等)、平板电脑、掌上电脑以及移动互联网设备(Mobile InternetDevices,MID)、PAD等终端设备。图5其并不对上述电子装置的结构造成限定。例如,终端还可包括比图5中所示更多或者更少的组件(如网络接口、显示装置等),或者具有与图5所示不同的配置。
本领域普通技术人员可以理解上述实施例的各种方法中的全部或部分步骤是可以通过程序来指令终端设备相关的硬件来完成,该程序可以存储于一计算机可读存储介质中,存储介质可以包括:闪存盘、只读存储器(Read-Only Memory,ROM)、随机存取器(RandomAccess Memory,RAM)、磁盘或光盘等。
实施例4
本发明的实施例还提供了一种存储介质。可选地,在本实施例中,上述存储介质可以用于执行3D显示方法的程序代码。
可选地,在本实施例中,上述存储介质可以位于上述实施例所示的网络中的多个网络设备中的至少一个网络设备上。
可选地,在本实施例中,存储介质被设置为存储用于执行以下步骤的程序代码:
S1,获取待载入网页页面的3D模型文件,其中,3D模型文件包括3D物体或角色;
S2,将3D模型文件的格式与网页页面进行格式适配,得到适配后的3D模型文件;
S3,在网页页面创建3D场景;
S4,在网页页面的3D场景中导入适配后的3D模型文件,得到导入的3D模型文件;
S5,对导入的3D模型文件进行渲染。
可选地,存储介质还被设置为存储用于执行以下步骤的程序代码:判断当前浏览器是否支持3D场景渲染功能,其中,如果判断出当前浏览器支持3D场景渲染功能,则在网页页面创建3D场景。
可选地,存储介质还被设置为存储用于执行以下步骤的程序代码:载入预设的3D引擎组件库,对3D场景进行渲染;对待置入3D场景中的对象进行初始化;将初始化之后的3D场景中的对象置入3D场景中;渲染3D场景中的相机中可见区域的场景。
可选地,存储介质还被设置为存储用于执行以下步骤的程序代码:初始化3D场景相机;绑定重力感应;初始化3D场景的灯光;初始化3D场景的对象定位。
可选地,存储介质还被设置为存储用于执行以下步骤的程序代码:在网页中声明加载器;遍历导入的3D模型的材质,将材质的皮肤属性设置为可见;对3D模型进行初始化三维定位。
可选地,存储介质还被设置为存储用于执行以下步骤的程序代码:遍历3D模型内的动画;按照时间序列将角色的动作进行裁剪;将加载完成的3D模型置入场景定位点中;对3D模型的中角色动作控制进行交互绑定。
可选地,本实施例中的具体示例可以参考上述实施例1和实施例2中所描述的示例,本实施例在此不再赘述。
可选地,在本实施例中,上述存储介质可以包括但不限于:U盘、只读存储器(ROM,Read-Only Memory)、随机存取存储器(RAM,Random Access Memory)、移动硬盘、磁碟或者光盘等各种可以存储程序代码的介质。
上述本发明实施例序号仅仅为了描述,不代表实施例的优劣。
上述实施例中的集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时,可以存储在上述计算机可读取的存储介质中。基于这样的理解,本发明的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来,该计算机软件产品存储在存储介质中,包括若干指令用以使得一台或多台计算机设备(可为个人计算机、服务器或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。
在本发明的上述实施例中,对各个实施例的描述都各有侧重,某个实施例中没有详述的部分,可以参见其他实施例的相关描述。
在本申请所提供的几个实施例中,应该理解到,所揭露的客户端,可通过其它的方式实现。其中,以上所描述的装置实施例仅仅是示意性的,例如所述单元的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式,例如多个单元或组件可以结合或者可以集成到另一个系统,或一些特征可以忽略,或不执行。另一点,所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口,单元或模块的间接耦合或通信连接,可以是电性或其它的形式。
所述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
另外,在本发明各个实施例中的各功能单元可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现,也可以采用软件功能单元的形式实现。
以上所述仅是本发明的优选实施方式,应当指出,对于本技术领域的普通技术人员来说,在不脱离本发明原理的前提下,还可以做出若干改进和润饰,这些改进和润饰也应视为本发明的保护范围。
Claims (8)
1.一种3D显示方法,其特征在于,包括:
获取待载入网页页面的3D模型文件,其中,所述3D模型文件包括3D物体或角色,所述3D模型文件为json格式的游戏文件;
将所述3D模型文件的格式与网页页面进行格式适配,得到适配后的3D模型文件,其中,适配后的3D模型文件是多个文件,多个文件是多个格式的,多个格式都是当前网页页面中可用的格式;
在所述网页页面创建3D场景;
在所述网页页面的3D场景中导入所述适配后的3D模型文件,得到导入的3D模型文件;
对所述导入的3D模型文件进行渲染;
在所述网页中声明加载器;
遍历所述导入的3D模型的材质,将所述材质的皮肤属性设置为可见;
对所述3D模型进行初始化三维定位;
遍历所述3D模型内的动画;
按照时间序列将所述角色的动作进行裁剪;
将加载完成的所述3D模型置入场景定位点中;
对所述3D模型中的角色动作控制进行交互绑定。
2.根据权利要求1所述的方法,其特征在于,在所述网页页面创建3D场景之前,所述方法还包括:
判断当前浏览器是否支持3D场景渲染功能,
其中,如果判断出所述当前浏览器支持3D场景渲染功能,则在所述网页页面创建3D场景。
3.根据权利要求1所述的方法,其特征在于,在所述网页页面创建3D场景包括:
载入预设的3D引擎组件库,对所述3D场景进行渲染;
对待置入所述3D场景中的对象进行初始化;
将初始化之后的所述3D场景中的对象置入所述3D场景中;
渲染所述3D场景中的相机中可见区域的场景。
4.根据权利要求3所述的方法,其特征在于,对待置入所述3D场景中的对象进行初始化包括:
初始化所述3D场景相机;
绑定重力感应;
初始化所述3D场景的灯光;
初始化所述3D场景的对象定位。
5.一种3D显示装置,其特征在于,包括:
获取单元,用于获取待载入网页页面的3D模型文件,其中,所述3D模型文件包括3D物体或角色,所述3D模型文件为json格式的游戏文件;
适配单元,用于将所述3D模型文件的格式与网页页面进行格式适配,得到适配后的3D模型文件,其中,适配后的3D模型文件是多个文件,多个文件是多个格式的,多个格式都是当前网页页面中可用的格式;
创建单元,用于在所述网页页面创建3D场景;
导入单元,用于在所述网页页面的3D场景中导入所述适配后的3D模型文件,得到导入的3D模型文件;
渲染单元,用于对所述导入的3D模型文件进行渲染,
所述渲染单元包括:
处理模块,用于在所述网页中声明加载器;
遍历模块,用于遍历所述导入的3D模型的材质,将所述材质的皮肤属性设置为可见;
定位模块,用于对所述3D模型进行初始化三维定位,
所述装置还包括:
遍历单元,用于在对所述3D模型进行初始化三维定位之后,遍历所述3D模型内的动画;
裁剪单元,用于按照时间序列将所述角色的动作进行裁剪;
置入单元,用于将加载完成的所述3D模型置入场景定位点中;
绑定单元,用于对所述3D模型中的角色动作控制进行交互绑定。
6.根据权利要求5所述的装置,其特征在于,所述装置还包括:
判断单元,用于在所述网页页面创建3D场景之前,判断当前浏览器是否支持3D场景渲染功能,其中,如果判断出所述当前浏览器支持3D场景渲染功能,则在所述网页页面创建3D场景。
7.根据权利要求5所述的装置,其特征在于,所述创建单元包括:
载入模块,用于载入预设的3D引擎组件库,对所述3D场景进行渲染;
初始化模块,用于对待置入所述3D场景中的对象进行初始化;
置入模块,用于将初始化之后的所述3D场景中的对象置入所述3D场景中;
渲染模块,用于渲染所述3D场景中的相机中可见区域的场景。
8.根据权利要求7所述的装置,其特征在于,所述初始化模块用于:
初始化所述3D场景相机;
绑定重力感应;
初始化所述3D场景的灯光;
初始化所述3D场景的对象定位。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201710327813.5A CN107219969B (zh) | 2017-05-10 | 2017-05-10 | 3d显示方法和装置 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201710327813.5A CN107219969B (zh) | 2017-05-10 | 2017-05-10 | 3d显示方法和装置 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN107219969A CN107219969A (zh) | 2017-09-29 |
CN107219969B true CN107219969B (zh) | 2018-11-06 |
Family
ID=59944894
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201710327813.5A Active CN107219969B (zh) | 2017-05-10 | 2017-05-10 | 3d显示方法和装置 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN107219969B (zh) |
Families Citing this family (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN107679188B (zh) * | 2017-09-30 | 2021-11-16 | 深圳市同立方科技有限公司 | 一种在网页中加载3d模型的方法 |
CN109215113A (zh) * | 2018-08-14 | 2019-01-15 | 北京爱康宜诚医疗器材有限公司 | 骨骼三维模型的显示方法及装置 |
CN109448100B (zh) * | 2018-09-18 | 2023-05-23 | 深圳市彬讯科技有限公司 | 三维模型格式转换方法、系统、计算机设备及存储介质 |
CN110069725A (zh) * | 2019-04-22 | 2019-07-30 | 成都四方伟业软件股份有限公司 | 可视化内嵌浏览器方法和装置 |
CN110851043B (zh) * | 2019-11-14 | 2021-05-11 | 腾讯科技(深圳)有限公司 | 页面显示方法和装置、存储介质及电子装置 |
CN113628321A (zh) * | 2021-07-15 | 2021-11-09 | 杭州玖欣物联科技有限公司 | 一种大型工业三维模型渲染的方法 |
Citations (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US7523411B2 (en) * | 2000-08-22 | 2009-04-21 | Bruce Carlin | Network-linked interactive three-dimensional composition and display of saleable objects in situ in viewer-selected scenes for purposes of object promotion and procurement, and generation of object advertisements |
CN102063475A (zh) * | 2010-12-22 | 2011-05-18 | 张丛喆 | 三维模型的网页用户终端呈现方式 |
CN105468801A (zh) * | 2014-09-09 | 2016-04-06 | 中国科学院深圳先进技术研究院 | 公共场所人群疏散仿真方法及系统 |
Family Cites Families (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN103325138A (zh) * | 2013-07-11 | 2013-09-25 | 乐淘(中国)有限公司 | 通过网页进行3d场景装饰并渲染的方法 |
-
2017
- 2017-05-10 CN CN201710327813.5A patent/CN107219969B/zh active Active
Patent Citations (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US7523411B2 (en) * | 2000-08-22 | 2009-04-21 | Bruce Carlin | Network-linked interactive three-dimensional composition and display of saleable objects in situ in viewer-selected scenes for purposes of object promotion and procurement, and generation of object advertisements |
CN102063475A (zh) * | 2010-12-22 | 2011-05-18 | 张丛喆 | 三维模型的网页用户终端呈现方式 |
CN105468801A (zh) * | 2014-09-09 | 2016-04-06 | 中国科学院深圳先进技术研究院 | 公共场所人群疏散仿真方法及系统 |
Also Published As
Publication number | Publication date |
---|---|
CN107219969A (zh) | 2017-09-29 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN107219969B (zh) | 3d显示方法和装置 | |
CN108619720B (zh) | 动画的播放方法和装置、存储介质、电子装置 | |
CN110399064A (zh) | 显示界面的切换方法和装置、存储介质及电子装置 | |
CN109685909B (zh) | 图像的显示方法、装置、存储介质和电子装置 | |
CN105468353B (zh) | 一种界面动画的实现方法及装置、移动终端和电脑终端 | |
CN109848985B (zh) | 一种机器人的图形编程方法、装置及智能终端 | |
CN106412277B (zh) | 虚拟场景的加载方法和装置 | |
CN109710348A (zh) | 页面跳转的方法及装置、计算机设备、存储介质 | |
CN108563517A (zh) | 系统接口的调用方法及装置 | |
CN107358649A (zh) | 地形文件的处理方法和装置 | |
CN105096373A (zh) | 一种媒体内容渲染的方法、用户设备及系统 | |
CN104202417A (zh) | 基于云计算的信息处理方法、客户端、云服务器及系统 | |
CN107506306B (zh) | 美术资源的测试方法和装置 | |
CN106293753A (zh) | 编辑器的开发方法和装置,编辑方法及编辑器 | |
CN104958900B (zh) | 用于开发2d场景和3d角色的游戏引擎系统及调用方法 | |
CN107566346A (zh) | 3d游戏数据的传输方法、装置以及存储介质、电子装置 | |
CN110990100A (zh) | 游戏场景中节点对象的处理方法及装置 | |
CN110930484B (zh) | 动画配置方法和装置、存储介质及电子装置 | |
CN112307403A (zh) | 页面渲染方法、装置、存储介质以及终端 | |
CN105617655B (zh) | 物理效果展示方法、装置及游戏系统 | |
CN107172136A (zh) | 体素数据的同步方法和装置 | |
CN105243268A (zh) | 一种游戏地图定位方法、装置及用户终端 | |
CN107911700A (zh) | 一种基于虚拟化的硬件解码方法、解码设备及存储介质 | |
CN107770458A (zh) | 一种场景切换的方法及终端设备 | |
CN113989442B (zh) | 建筑信息模型构建方法及相关装置 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |