Weird scale in terrain mesh

Hi, I’m posting this here because I’ve been struggling with this for a couple of days already and can’t really find the reason why this is happening. Most probably is a silly thing but I’m not able to find it.

I’ve got a procedurally generated terrain mesh, which I “color” with the following splatmap:

But when I load the game the terrain is flipped in the actual render, as you can see here (highlighted tile in the center):

It’s as if the terrain is being rendered in a negative scale (-1 X axis), but everything is configured on the positive axis.

Any clue why might this be happening?


Hi @bayo,

It may be the case OpenGL textures are being measured from bottom to top, can you share some code on how you calculate your splatmap?

Thanks @Leonidas, wouldn’t it be the Y axis the one flipped instead if that’s the case?

I produce the splatmaps with the following simple approach:

  1. Create a 512x512 canvas
  2. Fill an array with x,y positions for the points (e.g roads in that particular picture)
  3. Iterate over the points array with the following code:
        points.forEach((point, index, arr) => {
            if(arr.length > 1) {
                if(index == 0) // scale means normalizing here
                    if (scale) ctx.moveTo(rX * (point.x - bounds[2]) + cv.width, rY * (point.y - bounds[3]) + cv.height);
                    else ctx.moveTo(point.x, point.y);

                if(index != arr.length -1) // scale means normalizing here
                    if (scale) ctx.lineTo(rX * (arr[index + 1].x - bounds[2]) + cv.width, rY * (arr[index + 1].y - bounds[3]) + cv.height);
                    else ctx.lineTo(point.x, point.y);

Now the client part of that example is basically the uranus-terain-splatmaps.js from Uranus Tiled Terrain project. So it essentially uses that code to render the splatmap.

Does that help to shed some more light on the potential issue?


So yeah, you start from top to bottom when generating your points, which is correct and straightforward bug the texture is mapped from bottom to top.

Not sure why it flips on X and not on U, most likely it’s something on the Uranus splatmap script I can’t remember now.

I think you have an easy solution here, since you have an active canvas context open, at the end just flip the image on the axis in question. That way it will sit on the terrain as expected.

Got it, there were two issues here actually, one with the way I was positioning the mesh-tiles (each of those tiles is actually a different - also tiled - mesh entity on PlayCanvas), I was flipping the X axis when positioning those mesh-tiles in my world. And the second was with the rendering of the splatmap within each of the mesh-tiles, which was also flipped on the X axis - probably because of the way the Uranus script processes the image - so I just had to flip the image using the following code (in case it helps to someone else):

        if (flipY === true) {
            ctx.transform(1, 0, 0, -1, 0, cv.height)

        if (flipX === true) {
            ctx.translate(cv.width, 0)
            ctx.scale(-1, 1)

Thank you for the insight @Leonidas.

1 Like