一.簡介

3D貪吃蛇是貪吃蛇游戲的3D版本。通過攝取食物，累積數量來通關，隨著攝取食物的增加，蛇身體會慢慢變長變肥大。游戲開放了許多快捷鍵，方便玩家操作。游戲一共七個關卡，一關比一關難。最后一關的隨機障礙物更加是玩家的噩夢。為了獲取更好的游戲體驗，推薦使用谷歌瀏覽器或者楓樹瀏覽器。

二.游戲框架和開發團隊

這個游戲是使用Jscex作為動畫引擎，使用Three.js框架作為3D引擎開發的HTML5游戲.

使用到的HTML5特性主要包括Canvas, CSS3 （按鈕），沒有使用WebGL。后期打算加入localStorage存儲關卡信息。

在游戲中, 控制小蛇躲避前方的障礙物, 同時去吃前方的食物。與傳統的貪吃蛇區別是：蛇吃完食物后身體會長大，而不僅僅是變長。

通過該游戲的開發,讓團隊對HTML5的未來更加充滿信心.

• 團隊名稱：磚家隊

• 作品名稱：《3D Anakonda》

• 團隊成員：張磊、方方瑩

隊長+主程：張磊

策劃：張磊、方方瑩

測試：張磊、方方瑩

美工：張磊

程序：張磊

三.游戲指南

a. 上下左右控制蛇的運動方向

b. SHIFT切換速度模式

c. 按住Ctrl加速，放開不加速

d. L打開或者關閉光影開關,關閉光影的效果如下：

e. V切換到推薦視角

f. 按住鼠標旋轉視角

四.核心代碼

見2D貪吃蛇http://www.rzrgm.cn/iamzhanglei/archive/2011/10/08/2200858.html

光影開關：

            // Lights
            if (scene.lights.length == 0) {
                var ambientLight = new THREE.AmbientLight(0x555555);
                scene.addLight(ambientLight);

                var directionalLight = new THREE.DirectionalLight(0xffffff);
                directionalLight.position.x = -0.5;

                directionalLight.position.y = -0.5;
                directionalLight.position.z = 0.005;
                directionalLight.position.normalize();
                scene.addLight(directionalLight);

                var directionalLight = new THREE.DirectionalLight(0x808080);
                directionalLight.position.x = -0.1;
                directionalLight.position.y = 0.3;
                directionalLight.position.z = 0.5;
                directionalLight.position.normalize();
                scene.addLight(directionalLight);
            } else {
                scene.lights.length = 0;
            }

加速和減速控制：

        var moveAsync = eval(Jscex.compile("async", function () {
            while (true) {
                ......
                ......
                ......
                $await(Jscex.Async.sleep(speed));
            }
        }));

相當于通過鍵盤事件來控制speed就可以了。

文字旋轉以及移動特效：

        var wordMoveAsync = eval(Jscex.compile("async", function () {
            while (playParent.position.x > -500) {
                $await(Jscex.Async.sleep(1));

                playParent.position.x -= 30;

                render();
            }
        }))
        var logoMoveAsync = eval(Jscex.compile("async", function () {
            while (true) {
                $await(Jscex.Async.sleep(1));

                logoParent.position.z -= 30;
                if (logoParent.position.z < -450) {
                    initSnakeBody();
                    moveAsync().start();
                    break;

                }

            }
        }))
        var wordMoveBackAsync = eval(Jscex.compile("async", function () {
            while (playParent.position.x < 0) {
                $await(Jscex.Async.sleep(1));
                //-100
                playParent.position.x += 30;

                render();
            }
        }))
        var logoMoveBackAsync = eval(Jscex.compile("async", function () {
            while (true) {
                $await(Jscex.Async.sleep(1));

                logoParent.position.z += 30;
                if (logoParent.position.z > 300) {
                    if (gameOverTextParent) {
                        scene.removeChild(gameOverTextParent);
                    }
                    if (completeTextParent) {
                        scene.removeChild(completeTextParent);

                    }
                    for (var i = 1; i < mission + 1; i++) {
                        document.getElementById("Button" + i).disabled = ""
                    }
                    break;

                }

            }
        }))

        var rotationLogoAsync = eval(Jscex.compile("async", function () {
            while (true) {
                $await(Jscex.Async.sleep(50))
                logoParent.rotation.y += 0.1;
                render();
            }

        }))
        rotationLogoAsync().start();

五.總結

本游戲由兩人團隊完成，還有很多不足，本想增加一些可玩性，比如加入一些變速食物和中毒的食物，比如蛇大到一定程度可以吃障礙物，但是由于時間關系，最終沒抽出時間去實現。

同步

本文已同步更新至：

HTML5實驗室【目錄】:   http://www.rzrgm.cn/iamzhanglei/archive/2011/11/06/2237870.html