I am building an algorithm which takes a bitmap image as input and render the image as an embroidery design.
The different steps are :
- Vectorize the image, I keep only 5 colors (Done)
- Generate stitches lines (Done)
- Apply wire embroidery texture to the lines, add lights and show a realistic rendering ( It's this step that I am having trouble with)
Let's take an example. The original image is :
From there, I vectorize the image and obtain an SVG file.
After that, I generate stitches lines automatically which you can find here (svg file): https://www.dropbox.com/s/jmi6rz1ixgkjjpb/flowers_fill_0.7_vLongShort_space_randomLength.svg?dl=0
When you zoom in, it looks like this :
If I export the svg as png, I get :
As you can see; having this result is not enough to render realistically the embroidery design.
I am looking to have a texture more like this :
I tried generating a normal map and the use it adds some depth, but again, the result looks very plastic ... :
I don't know what I should do now to have a realistic rendering ... At first, it wasn't supposed to be a computer graphic problem so I am not a specialist in the area, but I think using webgl or opengl is the best choice.
However, I don't know how to give the rights textures to the lines ...