WEB 3D 已经到来!



如果你是 Flash 开发者,是否记得曾经使用过的基于 Flash Stage 3D 开发的3D引擎 Away 3D、Alternativa3D、Flare3D以及2D模拟3D类引擎PV3D,以及WEB中threejs等。

现在可以使用 Egret 3D 制作富有想象力的 WEB 创作,Egret 3D 提供完善的文档 API 以及继承显示容器与显示列表的概念。

Egret 3D 基于 WEBGL 实现。 目前为测试版本,希望开发者能多多提供评测建议。 QQ群:180593985

获取下载 »

300x200

按主题分类显示讲解 Egret 3D

文档 ›

300x200

浏览3D API及代码示例帮助你提高

API ›

300x200

获得专家解答,提供丰富的问题解决方案

社区 ›

300x200

观看最新的官方演示DEMO

演示 ›

Egret 3D 新功能


  • 模型系统 : 模型系统 Egret3D封装了自己的引擎静态模型,及动画模型。并提供了3Dmax 导出插件,也就是说支持任意3D模型格式。

  • 材质系统 : 根据自己的渲染风格可编辑材质球参数或者加入对应的材质特效。

  • 灯光系统 : 支持TBN 直接光照系统,在未来,还会支持间接光照,提高光影效果。

  • 动画系统 : 支持了3Dmax中高级骨骼动画,及相机动画。满足绝大部分游戏需要。

  • 粒子系统 : 丰富高效的粒子系统是一个引擎的一大标准,同样Egret3D粒子引擎拥有强大的可编辑功能,更高级的粒子功能拓展

  • shadow系统 : 阴影系统,提高渲染效果,增强渲染视觉真实感。

  • shader系统 : 原生webgl shader ,基于OpenGL ES2.0 标准,并与引擎功能紧密结合及拓展。并与未来shader编辑器做好了铺垫。

如何运行

下载 Egret 3D 项目,确认您拥有以下项目文件夹

|--Egret3D
    |--Sample
    |--script
    |--3Dmax-Export-tool
    |--package.json
    |--README.md


使用 Egret Wing                


  • 将项目放置于您的 HTTP 服务器下 

  • 确认已安装 Egret Wing 2.5.0 

  • 打开 Egret Wing,选择 文件 - 导入项目 - 标准TypeScript 项目,导入 Sample文件夹 

  • 使用 Ctrl + B 进行构建 

  • 在浏览器中以 localhost 方式打开 index.html               


使用终端或其他开发工具                


  • 将项目放置于您的 HTTP 服务器下 

  • 在终端中打开 Sample 文件夹 

  • 执行 tsc 

  • 使用 Ctrl + B 进行构建 

  • 在浏览器中以 localhost 方式打开 index.html

Hello, World!


class Main {

    protected _time: number = 0;
    protected _delay: number = 0;
    protected _timeDate: Date = null;
    protected _view3D: egret3D.View3D = null;
    protected _viewPort: egret3D.Rectangle = null;
    protected _cameraCtl: egret3D.LookAtController = null;

    public constructor(width: number = 800, height: number = 600) {

        this._viewPort = new Egret3D.Rectangle(0, 0, width, height);

        egret3D.Egret3DDrive.requstContext3D(DeviceUtil.getGPUMode, this._viewPort, () => this.onInit3D());
    }

    protected onInit3D(): void {

        this._view3D = new egret3D.View3D(this._viewPort);

        this._cameraCtl = new Egret3D.LookAtController(this._view3D.camera3D, new egret3D.Object3D());

        this._cameraCtl.setEyesLength(0.1);

        this.onView3DInitComplete();

        this._time = new Date().getTime();

        requestAnimationFrame(() => this.onUpdate());
    }

    protected onView3DInitComplete(): void {
    
    
       //<img id='t1' src='resource/xxx.png' hidden='hidden'>
        var skyTexture: egret3D.SkyTexture = new egret3D.SkyTexture(
            <HTMLImageElement>document.getElementById("t1"),
            <HTMLImageElement>document.getElementById("t2"),
            <HTMLImageElement>document.getElementById("t3"),
            <HTMLImageElement>document.getElementById("t4"),
            <HTMLImageElement>document.getElementById("t5"),
            <HTMLImageElement>document.getElementById("t6")
        );

        this._view3D.sky = new egret3D.Sky(skyTexture);
    }
    
    protected onUpdate(): void {

        this._timeDate = new Date();

        this._delay = this._timeDate.getTime() - this._time;

        this._time = this._timeDate.getTime();

        this._cameraCtl.update();

        this._view3D.renden(this._time, this._delay);

        requestAnimationFrame(() => this.onUpdate());
    }
}


评论


lyy57:不错!
12月25日 12:10
dily3825002:占座!
12月25日 17:32
jiangtao_qepyou: 不懂3D怎么办
01月01日 17:13
xsstomy:回复 jiangtao_qepyou 学,什么不是学会的
01月04日 10:57
cecil_su:坐等新手教程出来。
01月05日 14:23
ifyx:回复 cecil_su 我们会在未来几周放出新手教程。
01月06日 17:55
windeer:H5 玩3D 不要玩脱了呀 白鹭 什么时候像flash一样 支持下原生的socket 这样很重度游戏就会方便白鹭来开发,3D 我感觉几年内还不可能有人用
01月24日 11:17