# 2D displacement mapping for water effect

**URL:** <https://discourse.processing.org/t/2d-displacement-mapping-for-water-effect/3191>\
**Category:** Processing.py\
**Created:** [September 2, 2018, 12:01pm UTC](https://discourse.processing.org/t/2d-displacement-mapping-for-water-effect/3191 "2018-09-02T12:01:34Z")\
**Posts on this page:** 1\
**Showing post:** 6

<div class="post-metadata">

**Author:** ![solub](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/solub/32/333_2.png) [@solub](https://discourse.processing.org/u/solub)\
**Post date:** [September 2, 2018, 7:03pm UTC](https://discourse.processing.org/t/2d-displacement-mapping-for-water-effect/3191/6 "2018-09-02T19:03:39Z")

</div>

We’re getting closer.

It seems @TheWizardBear’s intuition was correct: the **displacement happens in the color’s indexing** , not in the pixels’s coordinates.

 ![](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/1/1bf68a69f69a1eee1bb8f43c5ae957970cc0ef43.jpeg)  
 ![](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/c/c3c07c4c087603694b31b2e7132f85bc253107c4.jpeg)

_playing with different `factor` and `n_range` values_

```auto
def setup():
    size(1476, 969, P2D) #width and height should be similar to the picture's dimensions
    
    img = loadImage("test_painting.jpg")
    loadPixels()
    for y in range(img.height):
        for x in range(img.width):
            i = x + y * img.width
            n = warp(x, y, .003, 615)
            c = img.pixels[i-int(n)] #selecting a color's index accordingly with the noise value 
            pixels[i] = color(c)
    updatePixels()
    
            
def warp(_x, _y, factor, n_range):
    n1 = noise((_x+0.0) * factor, (_y+0.0) * factor) * n_range
    n2 = noise((_x+5.2) * factor, (_y+1.3) * factor) * n_range
    q = PVector(n1, n2)
            
    n3 = noise(((_x + q.x * 4) + 1.7) * factor, ((_y + q.y * 4) + 9.2) * factor) * n_range
    n4 = noise(((_x + q.x * 4) + 8.3) * factor, ((_y + q.y * 4) + 2.8) * factor) * n_range
    r = PVector(n3, n4)
                
    return noise((_x + r.x * 4) * factor, (_y + r.y * 4) * factor) * n_range

```

Thank you.

---

_[View the full topic](https://discourse.processing.org/t/2d-displacement-mapping-for-water-effect/3191)._