# Mix Material and Multi-UV Layout **URL:** \ **Category:** Questions\ **Created:** [January 29, 2020, 6:49pm UTC](https://forum.babylonjs.com/t/mix-material-and-multi-uv-layout/8309 "2020-01-29T18:49:09Z")\ **Posts on this page:** 13\ **Page:** 1
**Author:** ![3D\_Wave\_Design](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/3d_wave_design/32/14412_2.png) [@3D\_Wave\_Design](https://forum.babylonjs.com/u/3D_Wave_Design)\ **Post date:** [January 29, 2020, 6:49pm UTC](https://forum.babylonjs.com/t/mix-material-and-multi-uv-layout/8309/1 "2020-01-29T18:49:09Z")
Maybe this is wishful thinking, but I’m wondering if I can utilize 2 separate UV layouts for a single Mix Material. Here’s the scenario: imagine that I have map that’s segmented into several pieces; each piece is equal in length as it is in width, like a checkerboard, and each piece has it’s own 1024x1024 image texture instead of sharing one giant high resolution texture – so that being said, all the 3D pieces fit together to make a single image (like a mosaic, or a map). Now I’d like to have a second UV layout for each piece where they all fit together on a single image texture that’ll be used as a Mix Map. The reason being is that I’d like to dynamically paint on a HTML canvas, use the canvas as the Mix Map texture and have all the 3D pieces update accordingly. I realize that I can avoid complicating the matter by just having a single UV layout where they all share the same diffuse texture that’s getting mixed, but by doing so I’m compromising image resolution significantly. Looking forward to getting your thoughts, and thanks in advance! ---
**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\ **Post date:** [January 29, 2020, 6:59pm UTC](https://forum.babylonjs.com/t/mix-material-and-multi-uv-layout/8309/2 "2020-01-29T18:59:26Z")
Invoking the creator of the MixMaterial: @julien-moreau ---
**Author:** ![3D\_Wave\_Design](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/3d_wave_design/32/14412_2.png) [@3D\_Wave\_Design](https://forum.babylonjs.com/u/3D_Wave_Design)\ **Post date:** [January 30, 2020, 3:34pm UTC](https://forum.babylonjs.com/t/mix-material-and-multi-uv-layout/8309/3 "2020-01-30T15:34:50Z")
Thanks! ---
**Author:** ![3D\_Wave\_Design](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/3d_wave_design/32/14412_2.png) [@3D\_Wave\_Design](https://forum.babylonjs.com/u/3D_Wave_Design)\ **Post date:** [January 30, 2020, 5:15pm UTC](https://forum.babylonjs.com/t/mix-material-and-multi-uv-layout/8309/4 "2020-01-30T17:15:20Z")
I had some success in the Node Material Editor: ![Babylon Node Editor](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/1/1154756b69dbba9d41bf23bd73faffbdf0921fb8.jpeg) ![Blender Shader Success](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/d/db888a977dfe47a73cacb8f5854447dbeb80b2bb.jpeg) ---
**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\ **Post date:** [January 30, 2020, 5:25pm UTC](https://forum.babylonjs.com/t/mix-material-and-multi-uv-layout/8309/5 "2020-01-30T17:25:20Z")
Even better 😉 ---
**Author:** ![3D\_Wave\_Design](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/3d_wave_design/32/14412_2.png) [@3D\_Wave\_Design](https://forum.babylonjs.com/u/3D_Wave_Design)\ **Post date:** [January 30, 2020, 5:53pm UTC](https://forum.babylonjs.com/t/mix-material-and-multi-uv-layout/8309/6 "2020-01-30T17:53:58Z")
I’m going through the exported code generated by the NME, and I can’t seem to make sense of how to access a UV Map. I see **uv1.output.connectTo(Texture1.uv);** but when I look at Babylon’s documentation, I can’t seem to find a property or method for selecting a UV and applying it to a texture. ---
**Author:** ![julien-moreau](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/julien-moreau/32/12070_2.png) [@julien-moreau](https://forum.babylonjs.com/u/julien-moreau)\ **Post date:** [January 30, 2020, 11:28pm UTC](https://forum.babylonjs.com/t/mix-material-and-multi-uv-layout/8309/8 "2020-01-30T23:28:29Z")
@3D_Wave_Design hey ! Welcome! Always a pleasure to help 🙂 I would like to understand better: the request is to be able to repeat x times the mixmap, right? ---
**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\ **Post date:** [January 30, 2020, 11:57pm UTC](https://forum.babylonjs.com/t/mix-material-and-multi-uv-layout/8309/9 "2020-01-30T23:57:20Z")
You can pick uv2 like that: ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/8/83a276c31f172021545916ea03d31d09c95339bc.png) ---
**Author:** ![3D\_Wave\_Design](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/3d_wave_design/32/14412_2.png) [@3D\_Wave\_Design](https://forum.babylonjs.com/u/3D_Wave_Design)\ **Post date:** [January 31, 2020, 1:02am UTC](https://forum.babylonjs.com/t/mix-material-and-multi-uv-layout/8309/10 "2020-01-31T01:02:22Z")
@Deltakosh I was able to create my desired effect in the NME no problem, but for future reference I’m wondering how I can toggle UV maps like you pointed out in Javascript/Typescript. ---
**Author:** ![3D\_Wave\_Design](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/3d_wave_design/32/14412_2.png) [@3D\_Wave\_Design](https://forum.babylonjs.com/u/3D_Wave_Design)\ **Post date:** [January 31, 2020, 1:07am UTC](https://forum.babylonjs.com/t/mix-material-and-multi-uv-layout/8309/11 "2020-01-31T01:07:55Z")
Hey! Well, sort of. I’m ultimately wondering if I can mix a texture that’s mapped to UV1 using a MixMap textured mapped to UV2. You can see the desired effect somewhat in my experimenting in the Node Material Editor and Blender, but I’m wondering how to do it with Javascript/Typescript. ---
**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\ **Post date:** [January 31, 2020, 2:50pm UTC](https://forum.babylonjs.com/t/mix-material-and-multi-uv-layout/8309/12 "2020-01-31T14:50:28Z")
You can toggle them with code like: ```auto var input = nodeMaterial.getInputBlockByPredicate(i => i.isAttribute && i.name === "uv"); input.name = "uv2"; ``` ---
**Author:** ![3D\_Wave\_Design](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/3d_wave_design/32/14412_2.png) [@3D\_Wave\_Design](https://forum.babylonjs.com/u/3D_Wave_Design)\ **Post date:** [February 2, 2020, 6:05pm UTC](https://forum.babylonjs.com/t/mix-material-and-multi-uv-layout/8309/13 "2020-02-02T18:05:12Z")
Hey everyone, thanks for your suggestions! In the end I used a much easier solution (of course it was staring me right in the face). I ended up creating a Dynamic Texture for each 3D tile, and used the **drawImage()** method for offsetting the canvas animation that was being used as the Mix Material Texture. ---
**Author:** ![vangold](https://avatars.discourse-cdn.com/v4/letter/v/a9a28c/32.png) [@vangold](https://forum.babylonjs.com/u/vangold)\ **Post date:** [February 3, 2020, 1:42pm UTC](https://forum.babylonjs.com/t/mix-material-and-multi-uv-layout/8309/14 "2020-02-03T13:42:09Z")
how I’ve never thought of that before? that’s absolutely ingenious!