第一个Three.js程序——动手写一个简单的场景

三维场景基本要素：

步骤：

代码：

源码：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <script type="text/javascript" src="js/three.js"></script>

    <style>

    html,body{background: #000000;}

    </style>

</head>

<body>

    <script type="text/javascript">

        var scene = new THREE.Scene();

        var geometry = new THREE.CubeGeometry(100,100,100);

        var material = new THREE.MeshLambertMaterial({color:0xff0000});

        var mesh = new THREE.Mesh(geometry,material);

        scene.add(mesh);

        var light = new THREE.PointLight(0xffffff);

        light.position.set(300,400,200);

        scene.add(light);

        var camera = new THREE.PerspectiveCamera(40 , 800/600, 1, 1000);

        camera.position.set(200,200,200);

        camera.lookAt(scene.position);

        var renderer = new THREE.WebGLRenderer();

        renderer.setSize(800,600);

        document.body.appendChild(renderer.domElement);

        renderer.render(scene,camera);

    </script>

</body>

</html>

巴特西

第一个Three.js程序——动手写一个简单的场景

最新文章

热门文章