我通过three.js渲染一个球体,当我应用纹理时,它的效果很好。 然而,我用来制作标记的等式不是我可以玩的东西。 如何在球体上旋转纹理,以便根据标记位置对齐图像?特别是在x方向。
问题......标记应该在日本鹿儿岛和中国香港
之上应该......而且不,我没有解决它......这应该是现在的样子
var geometry = new THREE.SphereGeometry(200, 40, 30);
shader = Shaders['earth'];
uniforms = THREE.UniformsUtils.clone(shader.uniforms);
uniforms['texture'].texture = THREE.ImageUtils.loadTexture('/images/world5.png');
texture.wrapS = THREE.RepeatWrapping; // This causes globe not to load
texture.offset.x = radians / ( 2 * Math.PI ); // causes globe not to load
material = new THREE.MeshShaderMaterial({
uniforms: uniforms,
vertexShader: shader.vertexShader,
fragmentShader: shader.fragmentShader
});
mesh = new THREE.Mesh(geometry, material);
mesh.matrixAutoUpdate = false;
scene.addObject(mesh);
答案 0 :(得分:1)
要将纹理移动一定数量的radians
经度,请使用以下模式:
texture.wrapS = THREE.RepeatWrapping; // You do not need to set `.wrapT` in this case
texture.offset.x = radians / ( 2 * Math.PI );
three.js r.58
答案 1 :(得分:1)
要移动纹理,请查看this question,这是另一个对我有用的解决方案。