复制纹理Three.js

Question

I want to load the left half of video texture to left Geometry and right half of video texture to the right Geometry

var video = document.createElement("video");
var texture = new THREE.Texture(video);
texture.offset = new THREE.Vector2(0,0);
texture.repeat = new THREE.Vector2( 0.5, 1 );
var material = new THREE.MeshLambertMaterial({
    map: texture,
    side: THREE.DoubleSide
});

this is the left plane texture

var texture2 = new THREE.Texture(video);
texture2.minFilter = THREE.NearestFilter;
texture2.offset = new THREE.Vector2(0.5,0);
texture2.repeat = new THREE.Vector2( 0.5, 1 );
var material2 = new THREE.MeshLambertMaterial({
    map: texture2,
    side: THREE.DoubleSide
});

this is the right plane texture

var plane = new THREE.Mesh(new THREE.PlaneBufferGeometry(320,   240), material);
var plane2 = new THREE.Mesh(new THREE.PlaneBufferGeometry(320, 240), material2);

loading two video texture didn't work,the left plane does display but the right not ,Than I try to copy texture instead of loading the same video texture:

 texture2 = THREE.Texture.clone(texture);

or

 texture = texture;

both don't work,too.Because(in three.js reference):

.clone(texture)
Make copy of texture. Note this is not a "deep copy", the image is shared.

What if anything can I do ?

function change_uvs( geometry, unitx, unity, offsetx, offsety ) {
    var faceVertexUvs = geometry.faceVertexUvs[ 0 ];
    for ( var i = 0; i < faceVertexUvs.length; i ++ ) {
       var uvs = faceVertexUvs[ i ];
       for ( var j = 0; j < uvs.length; j ++ ) {
         var uv = uvs[ j ];
         uv.x = ( uv.x + offsetx ) * unitx;
         uv.y = ( uv.y + offsety ) * unity;
      }
   }
}
var P1 = new THREE.PlaneGeometry(320, 240);
var p2 = new THREE.PlaneGeometry(320, 240);
change_uvs(p1,0.5,1,0,0);//left plane
change_uvs(p2,0.5,1,1,0);// right plane

by changging the uvMapping of planes i solve the problem :)

Answer 1

If it was to work in theory You will need to change the UV co-ordinates on either plane and add the texture to that. I had a similar issue with an image file more or less, check here :

three.js webgl custom shader sharing texture with new offset

There is a lot of info i had put there and should help you with a resolution.