# How to combine multiple map texture and alpha data into terrain

**URL:** <https://discourse.threejs.org/t/how-to-combine-multiple-map-texture-and-alpha-data-into-terrain/48843>\
**Category:** Questions\
**Tags:** materials, textures, geometry\
**Created:** [March 8, 2023, 3:22pm UTC](https://discourse.threejs.org/t/how-to-combine-multiple-map-texture-and-alpha-data-into-terrain/48843 "2023-03-08T15:22:41Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![mrnhuttrinh](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mrnhuttrinh/32/22916_2.png) [@mrnhuttrinh](https://discourse.threejs.org/u/mrnhuttrinh)\
**Post date:** [March 8, 2023, 3:22pm UTC](https://discourse.threejs.org/t/how-to-combine-multiple-map-texture-and-alpha-data-into-terrain/48843/1 "2023-03-08T15:22:41Z")

</div>

Hi,

I have the requirements below:

- Heightmap: 256x256
- 10 texture maps (each picture 8x8) (snow, grass, desert,…)
- 10 data express the heightmap materials (snow, grass, dessert…). each data mapping fit-in 256x256 and data from 0-255 (material alpha)

Now,

1. I want to draw the terrain 256x256 and apply 10 textures map with 10 data alpha.
2. How can I render low-poly terrain as above?

I have spent weeks struggling but it cannot blend textures and alpha data as I want. I have tried to customize the ShaderMaterial but nothing works.

Thanks.

---

<div class="post-metadata">

**Author:** ![PavelBoytchev](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/pavelboytchev/32/38639_2.png) [@PavelBoytchev](https://discourse.threejs.org/u/PavelBoytchev)\
**Post date:** [March 8, 2023, 3:37pm UTC](https://discourse.threejs.org/t/how-to-combine-multiple-map-texture-and-alpha-data-into-terrain/48843/2 "2023-03-08T15:37:19Z")

</div>

If I were you, I’d join all textures in [an atlas](https://en.wikipedia.org/wiki/Texture_atlas), and then I’d set the UV coordinates of terrain vertices to pick the correct part of the atlas.

---

<div class="post-metadata">

**Author:** ![mrnhuttrinh](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mrnhuttrinh/32/22916_2.png) [@mrnhuttrinh](https://discourse.threejs.org/u/mrnhuttrinh)\
**Post date:** [March 8, 2023, 3:59pm UTC](https://discourse.threejs.org/t/how-to-combine-multiple-map-texture-and-alpha-data-into-terrain/48843/3 "2023-03-08T15:59:33Z")

</div>

Hi @PavelBoytchev ,  
I have tried an atlas to merge multiple textures, but It doesn’t resolve my problem. Our project requests mix multiple textures as one, it is like multiple layers of stack overlap.

---

<div class="post-metadata">

**Author:** ![PavelBoytchev](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/pavelboytchev/32/38639_2.png) [@PavelBoytchev](https://discourse.threejs.org/u/PavelBoytchev)\
**Post date:** [March 8, 2023, 4:26pm UTC](https://discourse.threejs.org/t/how-to-combine-multiple-map-texture-and-alpha-data-into-terrain/48843/4 "2023-03-08T16:26:35Z")

</div>

Then, most likely I do not understand your situation. Maybe someone else might provide help.

Meanwhile, I have an example of dynamically merging two textures (one with ice and one with moss). Do you want something like this, but with 10 textures?

[Freezing cube](https://boytchev.github.io/etudes/webgl/freezing-cube.html)

[![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/0/0/00d044999445c56e49c015b0c8596104d1a40e62.jpeg)](https://boytchev.github.io/etudes/webgl/freezing-cube.html)

---

<div class="post-metadata">

**Author:** ![PavelBoytchev](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/pavelboytchev/32/38639_2.png) [@PavelBoytchev](https://discourse.threejs.org/u/PavelBoytchev)\
**Post date:** [March 8, 2023, 4:30pm UTC](https://discourse.threejs.org/t/how-to-combine-multiple-map-texture-and-alpha-data-into-terrain/48843/5 "2023-03-08T16:30:12Z")

</div>

> [@mrnhuttrinh](#):
>
> Our project requests mix multiple textures as one

- Could you merge them in image editing software?
- Could you merge them in Canvas 2D and use the result as a texture?
- Could you have 10 overlapping terrains, each having one map?

---

<div class="post-metadata">

**Author:** ![Chaser\_Code](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/chaser_code/32/20199_2.png) [@Chaser\_Code](https://discourse.threejs.org/u/Chaser_Code)\
**Post date:** [March 8, 2023, 4:53pm UTC](https://discourse.threejs.org/t/how-to-combine-multiple-map-texture-and-alpha-data-into-terrain/48843/6 "2023-03-08T16:53:29Z")

</div>

Maybe its called splat map

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/6/2/6251e3f68d301fa6cd6c14b6243073d717f97128.jpeg)  
 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/d/4/d4213bf45a9317e43c9c603fb83bfe1666711e1d.jpeg)