Question

将纹理映射到ThreeJS中的球体时，我正在丢失球体。相反，我得到的consol错误 - 未捕获的TypeError：无法调用undefined index.html：28的方法'add' 和跨源资源共享策略拒绝跨源图像加载。图像是正确的大小和分辨率，因为它在我尝试纹理映射的另一个实例中工作，但它在这里不起作用。这应该是我如何应用地图的问题。我是javascript和ThreeJS的新手，所以请耐心等待。谢谢。

<body>
    <div id="container"></div>
    <script src="javascript/mrdoob-three.js-ad419d4/build/three.js"></script>
    <script defer="defer">
      // renderer
      var renderer = new THREE.WebGLRenderer();
      renderer.setSize(window.innerWidth, window.innerHeight);
      document.body.appendChild(renderer.domElement);

      // camera
      var camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 1000);
      camera.position.z = 500;

      // material
      var material = new THREE.MeshLambertMaterial({
        map: THREE.ImageUtils.loadTexture('images/physicalworldmapcolor.jpg')
      });

      // add subtle ambient lighting
      var ambientLight = new THREE.AmbientLight(0x000044);
      scene.add(ambientLight);

      // directional lighting
      var directionalLight = new THREE.DirectionalLight(0xffffff);
      directionalLight.position.set(1, 1, 1).normalize();
      scene.add(directionalLight);

      // scene
      var scene = new THREE.Scene();

      // sphere
      // the first argument of THREE.SphereGeometry is the radius, 
      // the second argument is the segmentsWidth
      // the third argument is the segmentsHeight.  

      var sphere = new THREE.Mesh(new THREE.SphereGeometry(150, 70, 50), 
          new THREE.MeshNormalMaterial(material));
      sphere.overdraw = true;
      scene.add(sphere);

      renderer.render(scene, camera);
    </script>

Answer 1

您提供的代码有很多错误。只需查看以下基本示例： https://github.com/mrdoob/three.js/

您的脚本缺少渲染循环，您的相机未添加到场景中，在已经将对象添加到“场景”后调用Three.Scene（）构造函数。然后你有MeshNormalMaterial（）并在那里包装另一种材料。这不起作用，只需做Three.Mesh（SphereGeometry（...），材料）。 “overdraw”是一个物质属性，所以你必须做sphere.material.overdraw。但我认为透支仅影响CSS画布渲染器的内容，如果您使用WebGLRenderer，我不确定它是否有任何意义

关于跨源错误，请在此处阅读： https://github.com/mrdoob/three.js/wiki/How-to-run-things-locally

在三个JS中将纹理映射到一个球体

1 个答案: