Question

我的代码出了什么问题？我看不到应该是2个文本的背景图像。这是我的代码：

<html>
    <body>

    <script src="Three.js"></script>
    <script src="file:///C|/Program Files (x86)/three.js/src/objects/Mesh.js"></script>
    <script src="file:///C|/Program Files (x86)/three.js/src/extras/geometries/ShapeGeometry.js"></script>

    <script src="file:///C|/Program Files (x86)/three.js/src/lights/AmbientLight.js"></script>
   <script src='file:///C|/Program Files (x86)/three.js/build/three.min.js'></script> 

    <script src="file:///C|/Program Files (x86)/three.js/examples/js/utils/FontUtils.js"></script>

这是使用typefont.js

创建的js文件

    <script src="../../../../xampp/htdocs/myown/Starcraft_Normal.typeface.js"></script>

按照javascript代码

   <script>
    var scene = new THREE.Scene();
    var camera = new THREE.PerspectiveCamera(25, window.innerWidth/window.innerHeight, 0.1, 1000);


    var renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true });

    renderer.setSize(window.innerWidth, window.innerHeight);
    document.body.appendChild(renderer.domElement);

    camera.position.z = 5;
     // Load the background texture
        var texture = THREE.ImageUtils.loadTexture( 'maschera.png' );
        var backgroundMesh = new THREE.Mesh(
            new THREE.PlaneGeometry(4,2.2,5,5),
            new THREE.MeshLambertMaterial({
                map: texture
            }));


       scene.add( camera );
        scene.add(backgroundMesh );

        // LIGHT
    var light = new THREE.AmbientLight(0xFFFFFF);
    light.position.set(60,80,120);
    light.shadowCameraVisible = true;



        // text
        var textShapes = THREE.FontUtils.generateShapes('developer' );
var textgeom = new THREE.ShapeGeometry( textShapes );
var textMesh = new THREE.Mesh( textgeom, new THREE.MeshBasicMaterial( { color: 0xff0000 } ) ) ;

scene.add(textMesh);
// Example text options : {'font' : 'helvetiker','weight' : 'normal', 'style' : 'normal','size' : 100,'curveSegments' : 300};





    var render = function () {
      requestAnimationFrame(render);
      renderer.render(scene, camera);
    };
    render();
  </script>
  </body>
</html>

它是否因为我忘记了一些JS文件而失败了？

three.js背景图片+动态创建的2d文本

0 个答案: