基于Flash 3D的在線三維商品展示研究

徐廣情,李 念（武漢東湖學(xué)院 計算機科學(xué)學(xué)院,武漢 430212）

基于Flash 3D的在線三維商品展示研究

徐廣情,李 念
（武漢東湖學(xué)院 計算機科學(xué)學(xué)院,武漢 430212）

隨著電子商務(wù)的迅速發(fā)展，人們對三維電商平臺的需求日趨強烈。本文介紹了Flash 3D技術(shù)以及其在在線商品展示上的優(yōu)勢，并在此基礎(chǔ)上提出了基于Flash 3D的在線商品展示方法，最后通過一個應(yīng)用實例說明了該技術(shù)的有效性及可行性。

Flash 3D；Away3D；在線展示；三維展示

1 Flash 3D概述

1.1 Flash 3D技術(shù)簡介

Flash 3D是指基于網(wǎng)頁Flash 播放器播放并且可以實時交互三維場景信息的一系列應(yīng)用技術(shù)的總稱。它是一種在線3D技術(shù)，其中用于實時渲染和制作三維畫面信息的工具，稱為Flash 3D引擎[1]。

1.2 Flash 3D在線展示的優(yōu)勢

目前，有許多支持在線3D展示的技術(shù)，如：基于ΗTML5 和JavaScript的3D技術(shù)、基于VRML的3D技術(shù)、基于Java的3D技術(shù)以及基于Flash的3D 技術(shù)（即Flash 3D）等。ΗTML對3D的支持是從ΗTML5才開始的，而瀏覽器對ΗTML5支持還不太普及，因而基于新的ΗTML5的開發(fā)存在一定的難度； VRML 3D技術(shù)則由于其文件數(shù)據(jù)量大且兼容性差等特點沒有得到廣泛應(yīng)用；而Java3D已于2003年停止了升級開發(fā)，同時其執(zhí)行速率不高等，都在一定程度上限制了它的進一步應(yīng)用[2]。相對于其它技術(shù)來講，F(xiàn)lash 3D所具有的優(yōu)勢有：Flash文件體積小適合快速在線瀏覽，并且?guī)缀跛械臑g覽器都支持FlashPlayer播放器，此外它還具有較強的跨平臺性以及豐富的3D特效支持等。

2 基于Flash 3D的商品展示方法

2.1 利用Flash軟件及自帶ActionScript腳本

該方法一般是先通過對實物進行多角度拍攝，一般需要16－32張圖片，將圖片在Flash中使用“逐幀動畫”來實現(xiàn)商品的360度自動旋轉(zhuǎn)，然后直接發(fā)布成.gif格式圖片，可以實現(xiàn)流暢地在線動態(tài)展示效果。這種簡單的合成圖片無法實現(xiàn)鼠標交互操作，若配合ActionScript腳本，則可以實現(xiàn)對圖片旋轉(zhuǎn)進行簡單控制如：放大、停止旋轉(zhuǎn)、拖放等。但是從本質(zhì)上來講，這種3D效果只是一種視覺上的假象，因為模型本身不具備三維的特性，只是一種“仿3D”特效。目前，大部分電子商務(wù)網(wǎng)站的三維產(chǎn)品展示都是基于這一原理的。

2.2 借助于Flash 3D引擎

Flash3D引擎可以配合Flash、Flex軟件進行實時三維模型開發(fā)。Flash3D引擎集成了對三維模型的燈光照射、地面反射等效果處理，加載速度快并且展示流暢，用戶體驗顯著提高。目前有Papervision3D、Away3D、Sandy3D、Alternativa3D等，其中Away3D以其開源、免費且具有快速、高效等優(yōu)勢為廣大用戶所使用。Flash 3D引擎支持三維模型的創(chuàng)建、渲染以及動畫的生成，也支持導(dǎo)入外部的3D模型。由于利用腳本語言直接建模相對來說難度較大，因此用戶一般會選擇先在3dmax、maya等軟件中制作好3D模型，然后在Flash 3D引擎中導(dǎo)入再實現(xiàn)對模型的渲染和交互。

3 基于Flash 3D的商品展示實例

3.1 實現(xiàn)原理

本實例以Flash CS6.0+Away3D 4.0作為開發(fā)平臺，在.fl a文件中不進行場景的繪制和動畫制作，僅僅只是加載一個基于ActionScript 3.0的類，然后在這一個自定義類中通過程序設(shè)計實現(xiàn)3D模型的繪制、加載、控制等特效。

3.2 三維模型的導(dǎo)入

Away3D支持的模型格式較為豐富。MD2、MD5、3DS、OBJ等常用的格式都支持。本案例選擇的模型為3DS。Away3D中導(dǎo)入外部模型需要用到Loader3D類，在Loader3D類的enableParser方法中設(shè)置模型的類型，然后再利用URLReques對象指定模型文件的相對路徑，最后對模型在場景中的位置大小進行設(shè)置即可。關(guān)鍵代碼：

_loader = new Loader3D();

Loader3D.enableParser(Max3DSParser);

_loader.load(new URLRequest("assets/fi le.3ds"));

_view.scene.addChild(_loader);

3.3 三維模型的交互

模型的交互即實現(xiàn)在場景中對模型的360度手動拖拽、旋轉(zhuǎn)等操作。該操作需要編寫鼠標事件的相關(guān)方法，鼠標在拖動模型時不僅可以實現(xiàn)位置的移動、角度的旋轉(zhuǎn)，而且可以產(chǎn)生透視效果，這才是真正意義上的3d特效。鼠標移動時的關(guān)鍵屬性設(shè)置如下：

_hc.panAngle = (mouseX - _lastMouseX)*.3 + _lastPanAngle;

_hc.tiltAngle = (mouseY - _lastMouseY)*.3 + _lastTiltAngle;

3.4 三維模型的發(fā)布

直接在Flash CS6中發(fā)布，之后就可以生成swf和html兩種格式，圖1 是一個簡單的小轎車展示的網(wǎng)頁，可以使用鼠標來360度旋轉(zhuǎn)汽車，也可以調(diào)節(jié)遠近大小等。

圖1 小轎車在線三維展示圖

4 小結(jié)

本文對基于Flash3D的在線產(chǎn)品展示的關(guān)鍵技術(shù)進行了探討，重點研究了基于Away3D技術(shù)的3D模型導(dǎo)入、渲染與實時交互技術(shù)。為實際的在線三維商品展示平臺墊定了基礎(chǔ)。

[1]姚波.基于Papervision3D引擎下的室內(nèi)虛擬漫游研究與探索[J].計算機與信息技術(shù),2011,149(04):145-146.

[2]李學(xué)鋒.基于Papervision3D的在線產(chǎn)品展示技術(shù)研究[J].襄樊學(xué)院學(xué)報,2009(08).

[3]劉民，萬江平.基于Flash 3D的在線虛擬漫游系統(tǒng)設(shè)計與實現(xiàn)[J].計算機時代,2014(05).

徐廣情(1993-)，女, 湖北通城人，本科,研究方向：多媒體技術(shù)、教育技術(shù)學(xué)。

10.16640/j.cnki.37-1222/t.2015.21.207