在3D场景中来自YouTube的threejs视频

Question

我有一个根据加载的模型创建的场景。现场有电视。 我想在电视屏幕上添加youtube播放器。

我用     适用于场景中所有模型的THREE.WebGLRenderer。     适用于iframe和youtube的THREE.CSS3DRenderer。

问题是webGL中电视模型的屏幕尺寸太小（1.2x0.8），我无法在电视屏幕中将iframe与youtube匹配。

如何为iframe设置比例或单位，或者以某种方式在webGL单位和CSS3D像素之间设置比例？

// creating css object    
function createCssObject(w, h, position, rotation, url) {
    var html = [
    '<div style="width:' + w + 'px; height:' + h + 'px;">',
    '<iframe src="' + url + '" width="' + w + '" height="' + h + '">',
    '</iframe>',
    '</div>'
    ].join('\n');
    var div = document.createElement('div');
    div.innerHTML = html;
    var cssObject = new THREE.CSS3DObject(div);
    cssObject.position.x = position.x;
    cssObject.position.y = position.y;
    cssObject.position.z = position.z;
    cssObject.rotation.x = rotation.x;
    cssObject.rotation.y = rotation.y;
    cssObject.rotation.z = rotation.z;
    return cssObject;
}