DASH 创建N个title的mediaPlayer,根据three.js ,如何渲染到球面上?

你在看桥下风景
  • 15

目前有一个流mpd,根据其中的title创建N个mediaplayer。
使用three.js,目前可以使用planGeometry,创建3*3的一个平面,渲染单面,根据UV贴图,可以得到完整的,
如6个title的mediaplayer,根据3*3UV贴图得到一个完整的视频:

 var textures = [
        texture1,
        texture2,
        texture3,
        texture4,
        texture5,
        texture6,
        texture7,
        texture8,
        texture9,
      ];
      var geometryfaces = geometry.faces;
      for (let i = 0; i < geometryfaces.length; i++) {
        const faces = geometryfaces[i];
        materials[i] = new THREE.MeshBasicMaterial({
          map: textures[i],
        });
      }

      var faceId = 0;

      var uv = [
        new THREE.Vector2(0, 0),
        new THREE.Vector2(0, 1),
        new THREE.Vector2(1, 1),
        new THREE.Vector2(1, 0),
      ];
      //设纹理坐标
      for (var m = 0; m < geometryfaces.length; m += 2) {
        geometry.faces[m].materialIndex = faceId;
        console.log(geometry.faces);
        geometry.faces[m + 1].materialIndex = faceId;
        geometry.faceVertexUvs[0][m] = [uv[2], uv[3], uv[1]];
        geometry.faceVertexUvs[0][m + 1] = [uv[3], uv[0], uv[1]];
        faceId++;
      }

      var material = new THREE.MeshFaceMaterial(materials);
      var mesh = new THREE.Mesh(geometry, material); //网格模型对象Mesh

渲染出的图VS原本六模块视频图
image.png
image.png

目前怎么用渲染出的图转成或者贴到球面上

回复
阅读 124
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
你知道吗?

宣传栏