java - 如何在jME3中定位球体上的纹理？

Question

我想将 JPEG 纹理贴图放置在球体上。它对我有用，但我想将纹理旋转 180 度。即我希望图像不是从零 UV 坐标开始，而是更早开始。

更新

我尝试重新分配球体的纹理坐标。纹理坐标是 float ，我希望它们不被限制在 [0..1] 的范围内。否则它应该将我的图像放入 [0..1 x 0..1] 区域。

它做了类似后者的事情，但不精确:

即整个图像被放入球体的一小块区域中。但是，它所在的这个确切区域与 U 的负值相对应，即在相同的经度上，即先前实验中图像边缘的位置(顶部球体)。

为什么？

图片在这里:https://en.wikipedia.org/wiki/File:Equirectangular_projection_SW.jpg

代码如下:

package tests.com.jme3;

import java.nio.FloatBuffer;

import com.jme3.app.SimpleApplication;
import com.jme3.font.BitmapText;
import com.jme3.light.DirectionalLight;
import com.jme3.material.Material;
import com.jme3.math.ColorRGBA;
import com.jme3.math.Quaternion;
import com.jme3.math.Vector2f;
import com.jme3.math.Vector3f;
import com.jme3.scene.Geometry;
import com.jme3.scene.VertexBuffer;
import com.jme3.scene.VertexBuffer.Type;
import com.jme3.scene.VertexBuffer.Usage;
import com.jme3.scene.shape.Sphere;
import com.jme3.util.BufferUtils;

public class Try_TextureTransform  extends SimpleApplication {

    public static void main(String[] args) {
        Try_TextureTransform app = new Try_TextureTransform();
        app.setShowSettings(false);
        app.start(); // start the game
    }

    final float speed = 0.01f;

    BitmapText hudText;
    Sphere sphere1Mesh, sphere2Mesh;
    Material sphere1Mat, sphere2Mat;
    Geometry sphere1Geo, sphere2Geo;
    Quaternion orientation;
    DirectionalLight sun;

    @Override
    public void simpleInitApp() {

        flyCam.setEnabled(false);
        setDisplayStatView(false); 
        setDisplayFps(false);


        hudText = new BitmapText(guiFont, false);          
        hudText.setSize(guiFont.getCharSet().getRenderedSize());      // font size
        hudText.setColor(ColorRGBA.Blue);                             // font color
        hudText.setText("");             // the text
        hudText.setLocalTranslation(300, hudText.getLineHeight()*2, 0); // position
        guiNode.attachChild(hudText);

        sphere1Mesh = new Sphere(50, 50, 2);
        sphere1Mesh.setTextureMode(Sphere.TextureMode.Projected); // matrc

        sphere1Mat = new Material(assetManager, "Common/MatDefs/Misc/Unshaded.j3md");
        sphere1Mat.setTexture("ColorMap", assetManager.loadTexture("textures/Equirectangular_projection_SW.jpg"));

        sphere1Geo = new Geometry("Sphere2", sphere1Mesh);
        sphere1Geo.setMaterial(sphere1Mat); 
        sphere1Geo.setLocalTranslation(0, 0, 2);

        sphere2Mesh = new Sphere(50, 50, 2);

        VertexBuffer vb = sphere2Mesh.getBuffer(Type.Position);
        FloatBuffer fb = (FloatBuffer) vb.getData();
        float[] vertexCoordinates = BufferUtils.getFloatArray(fb);

        VertexBuffer vb2 = sphere2Mesh.getBuffer(Type.TexCoord);
        FloatBuffer fb2 = (FloatBuffer) vb2.getData();
        float[] uvCoordinates = BufferUtils.getFloatArray(fb2);

        double rho;
        for (int i = 0; i < vertexCoordinates.length/3; ++i) {

            uvCoordinates[i*2] = (float) Math.atan2(vertexCoordinates[i*3+1], vertexCoordinates[i*3]);
            rho = Math.sqrt(Math.pow( vertexCoordinates[i*3], 2) + Math.pow( vertexCoordinates[i*3+1], 2));
            uvCoordinates[i*2+1] = (float) Math.atan2(vertexCoordinates[i*3+2], rho);
        }
      //apply new texture coordinates
        VertexBuffer uvCoordsBuffer = new VertexBuffer(Type.TexCoord);
        uvCoordsBuffer.setupData(Usage.Static, 2, com.jme3.scene.VertexBuffer.Format.Float, BufferUtils.createFloatBuffer(uvCoordinates));
        sphere2Mesh.clearBuffer(Type.TexCoord);
        sphere2Mesh.setBuffer(uvCoordsBuffer);


        //sphere2Mesh.setTextureMode(Sphere.TextureMode.Projected); // better quality on spheres

        sphere2Mat = new Material(assetManager, "Common/MatDefs/Misc/Unshaded.j3md");
        sphere2Mat.setTexture("ColorMap", assetManager.loadTexture("textures/Equirectangular_projection_SW.jpg"));

        sphere2Geo = new Geometry("Sphere2", sphere2Mesh);
        sphere2Geo.setMaterial(sphere2Mat); 
        sphere2Geo.setLocalTranslation(0, 0, -2);

        cam.setLocation(new Vector3f(-10, 0, 0));
        cam.lookAt(Vector3f.ZERO, Vector3f.UNIT_Z);

        rootNode.attachChild(sphere1Geo);
        rootNode.attachChild(sphere2Geo); 

    }

    @Override
    public void simpleUpdate(float tpf) {


        Vector2f cursorPosition = inputManager.getCursorPosition();
        Vector3f cursorPositionWorld = cam.getWorldCoordinates(cursorPosition, 1);

        orientation = new Quaternion().fromAngleAxis(cursorPositionWorld.z*speed, Vector3f.UNIT_Y);
        orientation.multLocal(new Quaternion().fromAngleAxis(-cursorPositionWorld.y*speed, Vector3f.UNIT_Z));

        rootNode.setLocalRotation(orientation);



    }

}

Answer 1

正确的方法是按照您认为合适的方式旋转几何体或编辑纹理(技术 1 和 2)，但因为您谈论的是修改纹理坐标本身，所以我包括技术 3 和 4，以防您使用这个例子是为了在合适的时候学习更大的技术。

技术 1 - 旋转几何图形

旋转几何体，使其按照您想要的方式定向。这是迄今为止最简单、最合适、最容易理解的技术，也是我推荐的

    //Add this
    Quaternion quat=new Quaternion();
    quat.fromAngles(0 ,0 , FastMath.PI);
    sphere1Geo.setLocalRotation(quat);

完整的程序

public class Main extends SimpleApplication {

    public static void main(String[] args) {
        Main app = new Main();
        app.setShowSettings(false);
        app.start(); // start the game
    }

    final float speed = 0.01f;

    BitmapText hudText;
    Quaternion orientation;
    DirectionalLight sun;

    @Override
    public void simpleInitApp() {

        flyCam.setEnabled(false);
        setDisplayStatView(false); 
        setDisplayFps(false);


        hudText = new BitmapText(guiFont, false);          
        hudText.setSize(guiFont.getCharSet().getRenderedSize());      // font size
        hudText.setColor(ColorRGBA.Blue);                             // font color
        hudText.setText("");             // the text
        hudText.setLocalTranslation(300, hudText.getLineHeight()*2, 0); // position
        guiNode.attachChild(hudText);

        cam.setLocation(new Vector3f(10, 0, 0));
        cam.lookAt(Vector3f.ZERO, Vector3f.UNIT_Z);

        addOriginalSphere();
        addRotatedSphere();

    }

    public void addOriginalSphere(){
        Sphere sphere1Mesh = new Sphere(50, 50, 2);
        sphere1Mesh.setTextureMode(Sphere.TextureMode.Projected); // matrc

        Material sphere1Mat = new Material(assetManager, "Common/MatDefs/Misc/Unshaded.j3md");
        sphere1Mat.setTexture("ColorMap", assetManager.loadTexture("Textures/world.png"));

        Geometry sphere1Geo = new Geometry("Original Sphere", sphere1Mesh);
        sphere1Geo.setMaterial(sphere1Mat); 
        sphere1Geo.setLocalTranslation(0, -2, 0);

        rootNode.attachChild(sphere1Geo);
    }
    public void addRotatedSphere(){
        Sphere sphere1Mesh = new Sphere(50, 50, 2);
        sphere1Mesh.setTextureMode(Sphere.TextureMode.Projected); // matrc

        Material sphere1Mat = new Material(assetManager, "Common/MatDefs/Misc/Unshaded.j3md");
        sphere1Mat.setTexture("ColorMap", assetManager.loadTexture("Textures/world.png"));

        Geometry sphere1Geo = new Geometry("Rotated Sphere", sphere1Mesh);
        sphere1Geo.setMaterial(sphere1Mat); 
        sphere1Geo.setLocalTranslation(0, 2, 0);

        //Add this
        Quaternion quat=new Quaternion();
        quat.fromAngles(0 ,0 , FastMath.PI);
        sphere1Geo.setLocalRotation(quat);

        rootNode.attachChild(sphere1Geo);
    }

    @Override
    public void simpleUpdate(float tpf) {



    }

}

技术 2 - 编辑纹理以符合您想要的方式

存在许多图像编辑程序，我使用的是 Paint.Net，并且(像大多数编辑软件一样)提供精确的像素鼠标坐标。只需剪切并粘贴图像，使格林威治位于最左侧。在你的情况下，你无论如何都需要编辑图像，因为它上面有可怕的白色边框。

技术 3 - 弄乱顶点纹理坐标

这对于这个来说太过分了，不是我推荐的。但如果这是学习创建自己的练习custom mesh然后继续阅读

public void addRotatedSphere_ByMessingWithMesh(){
    Sphere sphere1Mesh = new Sphere(50, 50, 2);
    sphere1Mesh.setTextureMode(Sphere.TextureMode.Projected); // matrc


    FloatBuffer textureBuffer=sphere1Mesh.getFloatBuffer(Type.TexCoord);

    float[] newTextureCoordinates=new float[textureBuffer.capacity()];


    for(int i=0;i<newTextureCoordinates.length;i++){
        //texture buffer goes x co-ordinate, y coordinate, x coordinate, y coordinate
        if (i%2!=1){
            newTextureCoordinates[i]=(float)((textureBuffer.get(i)+0.5)%1);
        }else{
            newTextureCoordinates[i]=textureBuffer.get(i);
        }
    }

    sphere1Mesh.setBuffer(Type.TexCoord, 2,newTextureCoordinates);

    Material sphere1Mat = new Material(assetManager, "Common/MatDefs/Misc/Unshaded.j3md");
    sphere1Mat.setTexture("ColorMap", assetManager.loadTexture("Textures/world.png"));



    Geometry sphere1Geo = new Geometry("Rotated Sphere", sphere1Mesh);
    sphere1Geo.setMaterial(sphere1Mat); 
    sphere1Geo.setLocalTranslation(0, 2, 0);



    rootNode.attachChild(sphere1Geo);
}

这个有问题，因为后面的接缝没有做好；因为真实的纹理坐标为 0,0.2,0.4,0.8,1。而新的则在远端进行环绕。在这个具体示例中，您可以手动处理接缝，但您已经可以看到这很痛苦。

技术 4 - 编写自己的着色器

这接近于限制，但你可以写一个 custom shader这将采用真实的纹理坐标并应用类似于技术 3 中执行的转换，但这将在图形卡上完成，并且对于调试来说是一场噩梦。

不用说，这将使用小型核武器杀死一只苍蝇，我不会明确解释所有步骤(但它很大程度上基于 unshaded.j3md 和 unshaded.vert

• 创建以下文件来定义我们的新 Material

Material 定义

唯一的变化是提及我们的自定义顶点着色器，而不是使用自定义顶点着色器

MaterialDef Unshaded {

    MaterialParameters {
        Texture2D ColorMap
        Texture2D LightMap
        Color Color (Color)
        Boolean VertexColor (UseVertexColor)
        Boolean SeparateTexCoord

        // Texture of the glowing parts of the material
        Texture2D GlowMap
        // The glow color of the object
        Color GlowColor

        // For hardware skinning
        Int NumberOfBones
        Matrix4Array BoneMatrices

        // Alpha threshold for fragment discarding
        Float AlphaDiscardThreshold (AlphaTestFallOff)

        //Shadows
        Int FilterMode
        Boolean HardwareShadows

        Texture2D ShadowMap0
        Texture2D ShadowMap1
        Texture2D ShadowMap2
        Texture2D ShadowMap3
        //pointLights
        Texture2D ShadowMap4
        Texture2D ShadowMap5

        Float ShadowIntensity
        Vector4 Splits
        Vector2 FadeInfo

        Matrix4 LightViewProjectionMatrix0
        Matrix4 LightViewProjectionMatrix1
        Matrix4 LightViewProjectionMatrix2
        Matrix4 LightViewProjectionMatrix3
        //pointLight
        Matrix4 LightViewProjectionMatrix4
        Matrix4 LightViewProjectionMatrix5
        Vector3 LightPos
        Vector3 LightDir

        Float PCFEdge

        Float ShadowMapSize
    }

    Technique {
        VertexShader GLSL100:   MatDefs/TextureSplitting.vert
        FragmentShader GLSL100: Common/MatDefs/Misc/Unshaded.frag

        WorldParameters {
            WorldViewProjectionMatrix
        }

        Defines {
            SEPARATE_TEXCOORD : SeparateTexCoord
            HAS_COLORMAP : ColorMap
            HAS_LIGHTMAP : LightMap
            HAS_VERTEXCOLOR : VertexColor
            HAS_COLOR : Color
            NUM_BONES : NumberOfBones
            DISCARD_ALPHA : AlphaDiscardThreshold
        }
    }

    Technique {
    }

    Technique PreNormalPass {

          VertexShader GLSL100 :   Common/MatDefs/SSAO/normal.vert
          FragmentShader GLSL100 : Common/MatDefs/SSAO/normal.frag

          WorldParameters {
              WorldViewProjectionMatrix
              WorldViewMatrix
              NormalMatrix
          }

          Defines {
              NUM_BONES : NumberOfBones
          }
   }

    Technique PreShadow {

        VertexShader GLSL100 :   Common/MatDefs/Shadow/PreShadow.vert
        FragmentShader GLSL100 : Common/MatDefs/Shadow/PreShadow.frag

        WorldParameters {
            WorldViewProjectionMatrix
            WorldViewMatrix
        }

        Defines {
            COLOR_MAP : ColorMap
            DISCARD_ALPHA : AlphaDiscardThreshold
            NUM_BONES : NumberOfBones
        }

        ForcedRenderState {
            FaceCull Off
            DepthTest On
            DepthWrite On
            PolyOffset 5 3
            ColorWrite Off
        }

    }


    Technique PostShadow15{
        VertexShader GLSL150:   Common/MatDefs/Shadow/PostShadow15.vert
        FragmentShader GLSL150: Common/MatDefs/Shadow/PostShadow15.frag

        WorldParameters {
            WorldViewProjectionMatrix
            WorldMatrix
        }

        Defines {
            HARDWARE_SHADOWS : HardwareShadows
            FILTER_MODE : FilterMode
            PCFEDGE : PCFEdge
            DISCARD_ALPHA : AlphaDiscardThreshold           
            COLOR_MAP : ColorMap
            SHADOWMAP_SIZE : ShadowMapSize
            FADE : FadeInfo
            PSSM : Splits
            POINTLIGHT : LightViewProjectionMatrix5
            NUM_BONES : NumberOfBones
        }

        ForcedRenderState {
            Blend Modulate
            DepthWrite Off                 
            PolyOffset -0.1 0
        }
    }

    Technique PostShadow{
        VertexShader GLSL100:   Common/MatDefs/Shadow/PostShadow.vert
        FragmentShader GLSL100: Common/MatDefs/Shadow/PostShadow.frag

        WorldParameters {
            WorldViewProjectionMatrix
            WorldMatrix
        }

        Defines {
            HARDWARE_SHADOWS : HardwareShadows
            FILTER_MODE : FilterMode
            PCFEDGE : PCFEdge
            DISCARD_ALPHA : AlphaDiscardThreshold           
            COLOR_MAP : ColorMap
            SHADOWMAP_SIZE : ShadowMapSize
            FADE : FadeInfo
            PSSM : Splits
            POINTLIGHT : LightViewProjectionMatrix5
            NUM_BONES : NumberOfBones
        }

        ForcedRenderState {
            Blend Modulate
            DepthWrite Off   
            PolyOffset -0.1 0  
        }
    }

    Technique Glow {

        VertexShader GLSL100:   Common/MatDefs/Misc/TextureSplitting.vert
        FragmentShader GLSL100: Common/MatDefs/Light/Glow.frag

        WorldParameters {
            WorldViewProjectionMatrix
        }

        Defines {
            NEED_TEXCOORD1
            HAS_GLOWMAP : GlowMap
            HAS_GLOWCOLOR : GlowColor
            NUM_BONES : NumberOfBones
        }
    }
}

顶点着色器

使用平移将真实纹理坐标映射到移位后的坐标。顺便说一下，如果你认为这不是java；事实并非如此。它的 OpenGL 着色器语言。

#import "Common/ShaderLib/Skinning.glsllib"

uniform mat4 g_WorldViewProjectionMatrix;
attribute vec3 inPosition;

#if defined(HAS_COLORMAP) || (defined(HAS_LIGHTMAP) && !defined(SEPARATE_TEXCOORD))
    #define NEED_TEXCOORD1
#endif

attribute vec2 inTexCoord;
attribute vec2 inTexCoord2;
attribute vec4 inColor;

varying vec2 texCoord1;
varying vec2 texCoord2;

varying vec4 vertColor;

void main(){
    #ifdef NEED_TEXCOORD1
        texCoord1 = inTexCoord;
        texCoord1.x=texCoord1.x+0.5;
        if (texCoord1.x>1){
            texCoord1.x=texCoord1.x-1;
        }
    #endif

    #ifdef SEPARATE_TEXCOORD
        texCoord2 = inTexCoord2;
    #endif

    #ifdef HAS_VERTEXCOLOR
        vertColor = inColor;
    #endif

    vec4 modelSpacePos = vec4(inPosition, 1.0);
    #ifdef NUM_BONES
        Skinning_Compute(modelSpacePos);
    #endif
    gl_Position = g_WorldViewProjectionMatrix * modelSpacePos;
}

然后使用它作为 Material 而不是unshaded.j3md

Material sphere1Mat = new Material(assetManager, "Materials/TextureSplitting.j3md");

背面再次出现令人讨厌的中断，真实纹理在 0 和 1 之间变化，如果我们想要的话，我们可以明确处理但是我们必须确保有 2 个顶点分割点一个纹理坐标为0，一个纹理坐标为1。

结论

技术 1 或 2 是您应该使用的技术。我包含技术 3 和 4 只是为了表明您可以使用实际纹理坐标来执行此操作，但您不应该这样做。