# Normal Map

**URL:** <https://discourse.mcneel.com/t/normal-map/113313>\
**Category:** ShapeDiver\
**Created:** [November 27, 2020, 2:35pm UTC](https://discourse.mcneel.com/t/normal-map/113313 "2020-11-27T14:35:59Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![locherschmuck](https://sea3.discourse-cdn.com/mcneel/user_avatar/discourse.mcneel.com/locherschmuck/32/257875_2.png) [@locherschmuck](https://discourse.mcneel.com/u/locherschmuck)\
**Post date:** [November 27, 2020, 2:35pm UTC](https://discourse.mcneel.com/t/normal-map/113313/1 "2020-11-27T14:35:59Z")

</div>

Hey there,

I have an issue when using a normal map in Shapediver. It shows some awkward flat surfaces on my bounded surface:

 ![grafik](https://global.discourse-cdn.com/mcneel/uploads/default/original/4X/d/6/7/d676bd4162143c79f46ff73cfd9d9e497fe50beb.jpeg)

Any idea why this is happening?

Thx for Help

---

<div class="post-metadata">

**Author:** ![pavol](https://sea3.discourse-cdn.com/mcneel/user_avatar/discourse.mcneel.com/pavol/32/206581_2.png) [@pavol](https://discourse.mcneel.com/u/pavol)\
**Post date:** [November 27, 2020, 2:42pm UTC](https://discourse.mcneel.com/t/normal-map/113313/2 "2020-11-27T14:42:22Z")

</div>

It seems that the texture is out of scale. Is your geometry correctly mapped? You can use texture mapping components from [Human](https://www.food4rhino.com/app/human) plugin. Read more on texture mapping in this article:

> **[Texture Mapping Explained!](https://www.shapediver.com/blog/shapediver-basics-texture-mapping-explained-1)**
>
> Learn how to enhance the online rendering of your 3D models in Grasshopper by properly applying texture mapping.

---

<div class="post-metadata">

**Author:** ![locherschmuck](https://sea3.discourse-cdn.com/mcneel/user_avatar/discourse.mcneel.com/locherschmuck/32/257875_2.png) [@locherschmuck](https://discourse.mcneel.com/u/locherschmuck)\
**Post date:** [November 30, 2020, 7:51am UTC](https://discourse.mcneel.com/t/normal-map/113313/3 "2020-11-30T07:51:57Z")

</div>

Yes, I have mapped the texture with Human but the scaling of the texture has no impact on the displayed rectangles at all. Here a picture of the used sphere:

 ![grafik](https://global.discourse-cdn.com/mcneel/uploads/default/original/4X/a/2/0/a207b63014e4e6b8c351bf8a3311e633e5d28237.jpeg)

---

<div class="post-metadata">

**Author:** ![pavol](https://sea3.discourse-cdn.com/mcneel/user_avatar/discourse.mcneel.com/pavol/32/206581_2.png) [@pavol](https://discourse.mcneel.com/u/pavol)\
**Post date:** [November 30, 2020, 7:56am UTC](https://discourse.mcneel.com/t/normal-map/113313/4 "2020-11-30T07:56:08Z")

</div>

Could you please share a [minimal version](https://discourse.mcneel.com/t/how-to-get-support-on-the-shapediver-forum/81054) of the definition and the texture replicating this?

---

<div class="post-metadata">

**Author:** ![locherschmuck](https://sea3.discourse-cdn.com/mcneel/user_avatar/discourse.mcneel.com/locherschmuck/32/257875_2.png) [@locherschmuck](https://discourse.mcneel.com/u/locherschmuck)\
**Post date:** [November 30, 2020, 8:17am UTC](https://discourse.mcneel.com/t/normal-map/113313/5 "2020-11-30T08:17:43Z")

</div>

Here is the gh file:

[Normalmap share.gh](https://discourse.mcneel.com/uploads/short-url/unlp7Twul16jvplNISPEVuxDnXW.gh) (4.7 MB)

---

<div class="post-metadata">

**Author:** ![pavol](https://sea3.discourse-cdn.com/mcneel/user_avatar/discourse.mcneel.com/pavol/32/206581_2.png) [@pavol](https://discourse.mcneel.com/u/pavol)\
**Post date:** [November 30, 2020, 9:36am UTC](https://discourse.mcneel.com/t/normal-map/113313/6 "2020-11-30T09:36:08Z")

</div>

I’m not sure what effect you are trying to achieve but your normal map is just a black texture which explains the incorrect rendering.

 ![image](https://global.discourse-cdn.com/mcneel/uploads/default/original/4X/5/1/a/51adfb6a113e7ce0c14370e33354308eec4cd932.png)

Unlike bump map which is a grayscale image, normal map is colour image and creates a better effect as it affects the surface normals of pixel fragments by using the RGB values. Make sure that any texture you wish to use is converted to a normal map, you can use this tool:

> **[NormalMap-Online](http://cpetry.github.io/NormalMap-Online/)**
>
> Online NormalMap Generator FREE! Create a Normalmap directly inside your browser! No Uploads required, completely client-based

With use of a proper normal map, your model renders fine.

[Normalmap share SD1.gh](https://discourse.mcneel.com/uploads/short-url/A7MvW8IP9NsFOKGMwTmS2QQLj4b.gh) (2.2 MB)

 ![image](https://global.discourse-cdn.com/mcneel/uploads/default/original/4X/3/2/e/32e6305f20b533c91261817035d91cf189fca3f5.jpeg)

---

<div class="post-metadata">

**Author:** ![locherschmuck](https://sea3.discourse-cdn.com/mcneel/user_avatar/discourse.mcneel.com/locherschmuck/32/257875_2.png) [@locherschmuck](https://discourse.mcneel.com/u/locherschmuck)\
**Post date:** [November 30, 2020, 10:43am UTC](https://discourse.mcneel.com/t/normal-map/113313/7 "2020-11-30T10:43:19Z")

</div>

Ok, did not check the bitmap in gh, it should have been a blue texture so there was probably a problem with the import.  
Thanks for the help we will look into it and see what results we can achieve.

---

<div class="post-metadata">

**Author:** ![alan.sketches](https://sea3.discourse-cdn.com/mcneel/user_avatar/discourse.mcneel.com/alan.sketches/32/474303_2.png) [@alan.sketches](https://discourse.mcneel.com/u/alan.sketches)\
**Post date:** [June 9, 2023, 2:09am UTC](https://discourse.mcneel.com/t/normal-map/113313/8 "2023-06-09T02:09:56Z")

</div>

Hi Pavol,

Is it possible to do the mapping directly from the API instead of doing it from grasshopper? Thanks!

---

<div class="post-metadata">

**Author:** ![snabela](https://sea3.discourse-cdn.com/mcneel/user_avatar/discourse.mcneel.com/snabela/32/502261_2.png) [@snabela](https://discourse.mcneel.com/u/snabela)\
**Post date:** [June 9, 2023, 6:23am UTC](https://discourse.mcneel.com/t/normal-map/113313/9 "2023-06-09T06:23:14Z")

</div>

@alan.sketches not yet sure what you are referring to exactly, but a good place to start reading is here: [Materials](https://help.shapediver.com/doc/materials)

---

<div class="post-metadata">

**Author:** ![Gilberto\_Rodriguez](https://sea3.discourse-cdn.com/mcneel/user_avatar/discourse.mcneel.com/gilberto_rodriguez/32/474519_2.png) [@Gilberto\_Rodriguez](https://discourse.mcneel.com/u/Gilberto_Rodriguez)\
**Post date:** [June 9, 2023, 6:35pm UTC](https://discourse.mcneel.com/t/normal-map/113313/10 "2023-06-09T18:35:59Z")

</div>

Hi, I’m trying to map using the shapediver API, but the mapping property is not found at [https://viewer.shapediver.com/v3/latest/api/enums/TEXTURE\_WRAPPING.html](https://viewer.shapediver.com/v3/latest/api/enums/TEXTURE_WRAPPING.html).  
I need to use another mapping modes found at [https://threejs.org/docs/index.html#api/en/constants/Textures](https://threejs.org/docs/index.html#api/en/constants/Textures).  
Thanks!

---

<div class="post-metadata">

**Author:** ![snabela](https://sea3.discourse-cdn.com/mcneel/user_avatar/discourse.mcneel.com/snabela/32/502261_2.png) [@snabela](https://discourse.mcneel.com/u/snabela)\
**Post date:** [June 11, 2023, 7:24pm UTC](https://discourse.mcneel.com/t/normal-map/113313/11 "2023-06-11T19:24:43Z")

</div>

Did I understand correctly that you want to compute texture coordinates (UV coordinates) for your objects in the browser? This is not going to be straightforward. Actually it will be **very** involved. Are you prepared to learn threejs in depth, and also about the principles of texture mapping in general? If so, you can directly access the [threejs](https://viewer.shapediver.com/v3/latest/api/interfaces/ITreeNode.html#threeJsObject) objects.
