소스 검색

update to not use setTexture2D which has been remove as of r103

Gregg Tavares 6 년 전
부모
커밋
cda9eccfc9
2개의 변경된 파일29개의 추가작업 그리고 3개의 파일을 삭제
  1. 15 2
      threejs/lessons/threejs-canvas-textures.md
  2. 14 1
      threejs/threejs-canvas-textured-labels-one-canvas.html

+ 15 - 2
threejs/lessons/threejs-canvas-textures.md

@@ -369,7 +369,7 @@ Above we used a new canvas for each texture. Whether or not to use a
 canvas per texture is up to you. If you need to up them often then 
 having one canvas per texture is probably the best option. If they are
 rarely or never updated then you can choose to use a single canvas
-for multiple textures by calling `WebGLRenderer.setTexture2D`.
+for multiple textures by forcing three.js to use the texture.
 Let's change the code above to do just that.
 
 ```js
@@ -384,6 +384,19 @@ function makeLabelCanvas(baseWidth, size, name) {
 
 }
 
++const forceTextureInitialization = function() {
++  const material = new THREE.MeshBasicMaterial();
++  const geometry = new THREE.PlaneBufferGeometry();
++  const scene = new THREE.Scene();
++  scene.add(new THREE.Mesh(geometry, material));
++  const camera = new THREE.Camera();
++
++  return function forceTextureInitialization(texture) {
++    material.map = texture;
++    renderer.render(scene, camera);
++  };
++}();
+
 function makePerson(x, labelWidth, size, name, color) {
   const canvas = makeLabelCanvas(labelWidth, size, name);
   const texture = new THREE.CanvasTexture(canvas);
@@ -392,7 +405,7 @@ function makePerson(x, labelWidth, size, name, color) {
   texture.minFilter = THREE.LinearFilter;
   texture.wrapS = THREE.ClampToEdgeWrapping;
   texture.wrapT = THREE.ClampToEdgeWrapping;
-+  renderer.setTexture2D(texture, 0);
++  forceTextureInitialization(texture);
 
   ...
 ```

+ 14 - 1
threejs/threejs-canvas-textured-labels-one-canvas.html

@@ -103,6 +103,19 @@ function main() {
     return ctx.canvas;
   }
 
+  const forceTextureInitialization = function() {
+    const material = new THREE.MeshBasicMaterial();
+    const geometry = new THREE.PlaneBufferGeometry();
+    const scene = new THREE.Scene();
+    scene.add(new THREE.Mesh(geometry, material));
+    const camera = new THREE.Camera();
+
+    return function forceTextureInitialization(texture) {
+      material.map = texture;
+      renderer.render(scene, camera);
+    };
+  }();
+
   function makePerson(x, labelWidth, size, name, color) {
     const canvas = makeLabelCanvas(labelWidth, size, name);
     const texture = new THREE.CanvasTexture(canvas);
@@ -111,7 +124,7 @@ function main() {
     texture.minFilter = THREE.LinearFilter;
     texture.wrapS = THREE.ClampToEdgeWrapping;
     texture.wrapT = THREE.ClampToEdgeWrapping;
-    renderer.setTexture2D(texture, 0);
+    forceTextureInitialization(texture);
 
     const labelMaterial = new THREE.MeshBasicMaterial({
       map: texture,