var mesh = creatGradPlane(0,0,0, 100,100, [[0, '#fcc'], [1, '#fc3']])

scene.add(mesh);

}

function creatGradPlane(x,y,z, w,h, colors ,startX, startY, endX, endY){

? ? if (startX === undefined){

? ? ? ? startX= 0;? startY = 0;

? ? ? ? endX = 0; endY = h;

? ? }

? ? var canvas = document.createElement('canvas');

? ? canvas.width = w;

? ? canvas.height = h;

? ? var ctx = canvas.getContext('2d');

? ? var gradient = ctx.createLinearGradient(startX, startY, endX, endY);

? ? if(Array.isArray(colors))

? ? colors.forEach(element => {

? ? ? ? gradient.addColorStop(element[0], element[1]);

? ? });

? ? ctx.clearRect(0, 0, w, h);

? ? ctx.fillStyle = gradient;

? ? ctx.fillRect(0, 0, w, h);

? ? var texture = new THREE.Texture(canvas);

? ? texture.needsUpdate = true;

? ? var material = new THREE.MeshBasicMaterial( {map: texture} );

? ? var plane = new THREE.PlaneGeometry( w, h, 4, 4 );

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

? ? mesh.position.set(x,y,z)

? ? return mesh;

}