CN103020340A - 基于web的3D家居设计系统 - Google Patents

Abstract

本发明提供了一种基于web的3D家居设计系统，包括图片渲染系统、以及3D设计系统，其中，所述图片渲染系统用于生成产品在3D设计系统中需要加载的各角度产品图片，所述3D设计系统用于按照场景从所述图片渲染系统获取并实时加载与产品的放置角度所对应的产品图片。本发明在3ds Max中生成家居产品的三维模型，通过MAXScript脚本语言编程，渲染出当前产品的所需角度的图片，然后在Flash中实时动态加载产品不同角度的图片，实现三维显示的效果。采用基于Java技术的Web应用程序将可交互的Flash场景嵌入网页，用户无需下载任何插件，即可实现在线3D家居设计。

Description

基于web的3D家居设计系统

技术领域

本发明涉及Web3D技术，具体地，涉及基于web的3D家居设计系统。

背景技术

目前国内外家居设计网站众多，采用的技术方案各不相同，虽然可以部分解决家具建材产品的在线展示和销售问题，但是鉴于家居类产品的特殊性，无法满足消费者想要知道具体某个产品摆放在自己家里的实际效果的需求。

比较传统的方法是采用图片加文字的二维方式展示家居产品。目前国内大部分家居设计和电商网站都采用此方法，通过精美的产品效果图和详尽的产品功能描述进行家居产品的营销，但消费者还是不能通过真实的产品三维显示去体验其放置在自己家里的实际效果。

目前的趋势是依靠Web3D技术展示产品，以给予用户直观的感受。Web3D技术是随着互联网与虚拟现实技术的发展而产生的，网络技术及计算机硬件技术的飞速发展，使三维可视化技术在互联网上得以实现。但这种新兴的基于Web的三维显示技术还不成熟，性能还需提高。目前的解决方案虽然众多，但是几乎每个厂商开发的标准都需要自己插件的支持，这些插件从几百K到几兆不等，在带宽不理想的条件下必然限制了一部分人的使用热情。

Web3D的实现技术主要为如下三种：

1.基于编程的实现技术

开发Web3D最直接的方法是通过编程来实现。其编程语言主要有：虚拟现实建模语言VRML、网络编程语言Java和Java3D，并且需要基层软件或者驱动库的支持，如：ActiveX、COM和DCOM等。其中，使用最为广泛的是VRML和Java3D。

VRML语言就是采用其提供的节点、字段和事件来直接编程，但工作量大，开发效率低，直接表现很复杂的场景很困难，必须借助其它可视化编程工具，才能实现对复杂场景的构建。另外，VRML所提供的API远不能满足应用程序开发的要求，且复杂、不易使用。

Java3D是在OpenGL、DirectX等三维图形标准的基础上发展起来的，它的编程模型是基于图像场景的，这就消除了以前的API强加给编程人员的繁琐细节，允许编程人员更多的考虑场景及其组织，而非底层渲染代码。

基于编程的Web3D实现技术，有编程工作量大且较难掌握的共同缺点。

2.基于开发工具的实现技术

为了提高Web3D技术的实用性，近年来，一些公司开发了专门针对Web3D对象建构的可视化开发工具（如Cult3D、Viewpoint、Pul se3D、Shout3D、Blaxunn3D等），从而为不熟悉编程的人员开发Web3D对象提供了方便的实现途径。这些专门的开发工具，尽管用法和功能各异，但开发过程一般都包括：（1）建立或编辑三维场景模型；（2）增强图形质量；（3）设置场景中的交互；（4）优化场景模型文件；（5）加密等。

通过开发工具实现Web3D的开发，流程简单直观、并易掌握。

3.基于多媒体工具软件的实现技术

利用Flash等多媒体工具软件，不通过编程就很方便进行Web3D的开发。在交互式矢量动画软件Flash中，对导入的序列图像或已拼接的360度的全景图像，通过Act ionScript设置交互而形成的3D对象或全景虚拟环境，能实现360度视角可见的图像的控制。由于该技术具有矢量性，所以，具有画面清晰度不因缩放而降低、文件小等优点。

发明内容

针对现有技术中的缺陷，本发明的目的是提供一种的控制方法以及相应的控制装置。

根据本发明的一个方面，提供一种基于web的3D家居设计系统，包括图片渲染系统、以及3D设计系统，其中，所述图片渲染系统用于生成产品在3D设计系统中需要加载的各角度产品图片，所述3D设计系统用于按照场景从所述图片渲染系统获取并实时加载与产品的放置角度所对应的产品图片。

优选地，所述图片渲染系统包括如下装置：

创建装置，用于创建产品的主场景模型，其中，所述主场景模型中包括若干个与产品相对应的模型对象；

命名装置，用于给每个模型对象添加唯一的ID号；

拆分装置，用于将主场景中的各个模型对象拆分到单独场景中；

渲染装置，用于根据环境模版对模型对象在各角度下进行渲染，以生成所述产品图片。

优选地，所述图片渲染系统作为3ds Max的插件工具，处理的数据源为3ds Max的三维模型，所述主场景模型为3D MAX主场景模型。

优选地，所述3D设计系统包括如下装置：

空间生成装置，用于生成二维空间，并在所述二维空间内放置产品；

三维视图装置，用于将所述二维空间拉伸为立体的三维空间，根据产品的放置角度加载对应的产品图片，形成产品的三维视图。

优选地，所述空间生成装置包括如下装置：

房型设计装置，用于在可交互操作的场景中，在二维画布上生成各种房型；

产品布置装置，用于加载产品的缩略图片，根据用户指令将产品的俯视图放置在房间的指定位置处。

优选地，所述产品布置装置包括如下装置：

重叠干涉装置，用于在放置产品的俯视图时，通过实时侦测当前拖动产品的俯视图是否与其他其他产品的俯视图相重叠，若重叠则进行提示；

吸附装置，用于根据与产品对应的放置规则，将产品的俯视图自动吸附到墙面；

高度检测装置，用于通过对放置的产品设置三维显示视图下的高度属性。

优选地，所述可交互操作的场景为Flash场景、或者html5场景。

优选地，所述3D设计系统还包括如下装置：

装修预算装置，用于解析当前场景中的设计方案，计算地面、墙面的面积，通过数据库系统查询当前放置产品的价格，生成装修预算的报价单。

本发明采用基于Java技术的Web应用程序将可交互的Flash场景嵌入网页，用户无需下载任何插件，即可实现在线3D家居设计。依托web应用程序的后台完善的数据库管理功能，对产品数据及其各角度图片做统一管理，方便与其他商业系统的数据对接，达到真正实用化和商业化。在优选的具体实施方式中，本发明实现的技术路径为在3dsMax中生成家居产品的三维模型，通过MAXScript脚本语言编程，渲染出当前产品的所需角度的图片，然后在ActionScript 3语言开发的Flash中实时动态加载产品不同角度的图片，实现三维显示的效果。采用基于Java技术的Web应用程序将可交互的Flash场景嵌入网页，用户无需下载任何插件，即可实现在线3D家居设计。

与现有技术相比，本发明具有如下的有益效果：

1.能够快速方便地将一个家居产品的三维模型，生成三维设计和显示所需各个角度的图片，包括正交视图，景深图，缩略图等。

2.生成可交互Flash场景，可以实时设计各种房型，并可动态修改房间大小，尺寸、角度可自动标注。

3.在可交互Flash场景中，在已创建的房间中任意摆放家居产品，并支持产品间的智能自动干涉检测。

4.在可交互Flash场景中，将设计好的房间及产品生成三维视图，并支持旋转、拖动、产品替换等。

5.实时解析当前Flash场景的设计方案，计算地面、墙面面积，生成产品物料清单。

附图说明

通过阅读参照以下附图对非限制性实施例所作的详细描述，本发明的其它特征、目的和优点将会变得更明显：

图1为本发明的结构框图。

具体实施方式

下面结合具体实施例对本发明进行详细说明。以下实施例将有助于本领域的技术人员进一步理解本发明，但不以任何形式限制本发明。应当指出的是，对本领域的普通技术人员来说，在不脱离本发明构思的前提下，还可以做出若干变形和改进。这些都属于本发明的保护范围。

目前大多数基于web的3D显示技术采用的是加载真实3D模型，需要下载客户端或者插件，且真实3D模型数据大，网络加载速度缓慢。针对在线3D显示快速访问，效果逼真等性能要求，本发明采用“3D自动成像技术”，将3ds Max模型实时渲染，自动生成多角度图片，通过在线Flash加载不同角度的图片，实现了具有真实感的3D景观自动生成功能，提高了用户对家居设计方案三维浏览的真实感体验，有效地解决了现有技术中其他在线设计网站存在的3D模型在线加载速度缓慢，放大显示效果模糊等问题。

在进行家居设计时，本发明采用“3D智能感应技术”，如在拖动床到墙边时自动转向，柜子靠墙自动吸附并标注尺寸，桌面摆放物体自动判断景深等，将真实生活中装修时的放置规则自动应用的软件系统，用户通过简单的鼠标拖拽就可完成3D家装设计，而现有技术中的类似软件，操作繁杂，使用者需具备相当专业背景知识才可完成满意的3D设计。

根据本发明提供的基于web的3D家居设计系统，包括产品图片渲染系统和3D设计系统两大子系统。图片渲染系统包括模型命名，场景分割，图片渲染三个功能模块，用于生成产品在3D设计系统中需加载的各角度图片。3D设计系统主要包括房型设计，产品布置，三维显示，装修预算等功能模块。

图片渲染系统

通过MAXScript脚本语言编程，生成可视化图片渲染工具，作为3ds Max的插件，快速方便的在3ds Max中将一个家居产品的三维模型，渲染生成所需各个角度的图片，包括正交视图，景深图，缩略图等。

优选地，图片渲染的步骤如下：

1)创建产品3D MAX主场景模型

图片渲染系统作为3ds Max的插件工具，处理的数据源为3ds Max的三维模型，使用UVW世界坐标系系统，依据产品的真实尺寸建模，一个3ds Max主场景中可以包含多个对象（objects），其中，对象与产品相对应。

2)给模型对象命名，给每个对象添加一个唯一的ID号

给每个对象添加一个唯一的，放置在中括号[]内的ID号，如果对象本身的名字就是唯一的，可以复制它到中括号[]内作为ID号。

3)拆分主场景中各个模型对象到单独的场景

用来渲染的场景只能有一个对象，如果一个场景的对象多于一个，就要用“分割场景”工具将其拆分为多个场景。

4)选择环境模版，渲染所需的产品图片

3ds Max中渲染一个场景时需要指定一个环境模版，模拟当前场景的环境灯光等效果，调用max脚本的渲染命令（render）时，可以引用3ds Max软件自带的环境模版。也可以使用自定义的环境模版，其中环境光线的参数可以自由设置。

本领域技术人员应当理解，上述具体实施方式中的部分内容以3ds MAX为例进行了说明，但这些3ds MAX的举例并不属于对本发明的局限和必然实施方式，而是作为本发明的优选例予以说明，在更多的变化例中，还可以通过Maya、renderman、maxwell、以及vray等其它3d软件实现，这并不影响本发明的实质内容，在此不予赘述。

优选地，3D设计系统的实现如下：

通过ActionScript 3语言开发的可交互Flash场景，实时设计各种房型，在房间中摆放产品后，生成三维视图，支持旋转，拖动，产品替换等操作，并可自动生成产品物料清单。

（1）房型设计

在可交互操作的Flash场景中，在二维画布上设计各种房型，通过鼠标拖拽修改房间大小，实时显示房间的尺寸信息。

（2）产品布置

在Flash场景右侧产品面板，加载产品的缩略图片，拖拽某个产品到已创建的房间中，摆放产品的俯视图到合适位置。

摆放产品时，通过实时侦测当前拖动产品的图片是否与其他其他产品图片相重叠，判断摆放位置是否合理，实现自动干涉检查。

对于不同类别的产品设置不同的放置规则，如衣柜，电视柜等靠墙时产品背面自动吸附到墙上，并在靠墙移动时自动显示尺寸。

通过对摆放的产品设置三维显示视图下的高度属性，可以将一个产品放置到另一个产品上面，如电视柜上摆放电视，并通过产品的景深图片，确定合适的摆放位置，如电视的摆放应该避开电视柜表面凹凸连接处。

（3）三维视图

对设计好的房间按固定高度拉伸，将一个平面的二维房间拉伸为立体的三维空间，通过加载摆放产品的合适角度的图片，形成设计方案的三维视图显示，遮挡视线的墙体自动隐藏。

三维视图的场景按用户设置的角度旋转后，实时加载放置产品的对应角度的图片，保证3D视图的显示效果。通过替换同类产品的相同角度的图片，可以实现产品替换的功能。

（4）装修预算

解析当前Flash场景中的设计方案，计算地面，墙面的面积，通过数据库系统查询当前摆放产品的价格等信息，生成装修预算的报价单，并支持打印。

本领域技术人员应当理解，上述具体实施方式中的部分内容以Flash场景为例进行了说明，但这些Flash场景的举例并不属于对本发明的局限和必然实施方式，而是作为本发明的优选例予以说明，在更多的变化例中，还可以通过html5、Silverlight等其它场景实现，这并不影响本发明的实质内容，在此不予赘述。

以上对本发明的具体实施例进行了描述。需要理解的是，本发明并不局限于上述特定实施方式，本领域技术人员可以在权利要求的范围内做出各种变形或修改，这并不影响本发明的实质内容。

Claims (8)

1.一种基于web的3D家居设计系统，其特征在于，包括图片渲染系统、以及3D设计系统，其中，所述图片渲染系统用于生成产品在3D设计系统中需要加载的各角度产品图片，所述3D设计系统用于按照场景从所述图片渲染系统获取并实时加载与产品的放置角度所对应的产品图片。

2.根据权利要求1所述的基于web的3D家居设计系统，其特征在于，所述图片渲染系统包括如下装置：

创建装置，用于创建产品的主场景模型，其中，所述主场景模型中包括若干个与产品相对应的模型对象；

命名装置，用于给每个模型对象添加唯一的ID号；

拆分装置，用于将主场景中的各个模型对象拆分到单独场景中；

渲染装置，用于根据环境模版对模型对象在各角度下进行渲染，以生成所述产品图片。

3.根据权利要求2所述的基于web的3D家居设计系统，其特征在于，所述图片渲染系统作为3ds Max的插件工具，处理的数据源为3ds Max的三维模型，所述主场景模型为3D MAX主场景模型。

4.根据权利要求1所述的基于web的3D家居设计系统，其特征在于，所述3D设计系统包括如下装置：

空间生成装置，用于生成二维空间，并在所述二维空间内放置产品；

三维视图装置，用于将所述二维空间拉伸为立体的三维空间，根据产品的放置角度加载对应的产品图片，形成产品的三维视图。

5.根据权利要求4所述的基于web的3D家居设计系统，其特征在于，所述空间生成装置包括如下装置：

房型设计装置，用于在可交互操作的场景中，在二维画布上生成各种房型；

产品布置装置，用于加载产品的缩略图片，根据用户指令将产品的俯视图放置在房间的指定位置处。

6.根据权利要求5所述的基于web的3D家居设计系统，其特征在于，所述产品布置装置包括如下装置：

重叠干涉装置，用于在放置产品的俯视图时，通过实时侦测当前拖动产品的俯视图是否与其他其他产品的俯视图相重叠，若重叠则进行提示；

吸附装置，用于根据与产品对应的放置规则，将产品的俯视图自动吸附到墙面；

高度检测装置，用于通过对放置的产品设置三维显示视图下的高度属性。

7.根据权利要求5所述的基于web的3D家居设计系统，其特征在于，所述可交互操作的场景为Flash场景、或者html5场景。

8.根据权利要求4所述的基于web的3D家居设计系统，其特征在于，所述3D设计系统还包括如下装置：

装修预算装置，用于解析当前场景中的设计方案，计算地面、墙面的面积，通过数据库系统查询当前放置产品的价格，生成装修预算的报价单。

Images