旋轉球體紋理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

回答

相關問題