旋转球体纹理Three.js

我正在通过three.js渲染一个球体，当我应用一个纹理时，它工作得很好。但是，我用来制作标记的公式并不是我可以玩的。如何旋转球体上的纹理，以便根据标记位置对齐图像？特别是在x方向。旋转球体纹理Three.js

问题...标记应该是在鹿儿岛，日本和中国香港，中国 Markers should be over Kagoshima, Japan and Hong Kong, China

应该是....并没有，我没有解决它...这是它应该是什么样子没怎么现在 No I did not solve it...this is what it should look like not how it is now

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);

来源

2013-07-10 Markus Proctor

'MeshShaderMaterial'已被弃用。它现在是'ShaderMaterial'。你是从网上复制过时的代码还是从过时的书中复制过来的代码？学习适用于当前版本库的three.js示例。 – WestLangley

要改变纹理一定数量的经度的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

来源

2013-07-10 19:02:36 WestLangley

我尝试使用你提到的代码，而地球仪根本没有加载。我附上了我用来创建球体并附加纹理的代码。 –

这是你问的问题的正确答案。如果您的代码存在其他问题，那么请发一个新帖子，最好有一个实例，并提出具体问题。 – WestLangley

@Markus Proctor。很长一段时间，因为你的问题，但FYI这个解决方案对我来说工作正常（当试图在three.js R83的圆柱体上旋转纹理时）。也许你省略了在代码中定义变量“弧度”。 – steveOw

要移动纹理看看this question，这是另一种解决方案，为我工作。

来源

2014-02-04 10:48:38 user3241019

旋转球体纹理Three.js

回答

相关问题