# Reaction Diffusion : add an image

**URL:** <https://discourse.processing.org/t/reaction-diffusion-add-an-image/12552>\
**Category:** Coding Questions\
**Created:** [July 7, 2019, 10:56am UTC](https://discourse.processing.org/t/reaction-diffusion-add-an-image/12552 "2019-07-07T10:56:35Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![alice](https://avatars.discourse-cdn.com/v4/letter/a/779978/32.png) [@alice](https://discourse.processing.org/u/alice)\
**Post date:** [July 7, 2019, 10:56am UTC](https://discourse.processing.org/t/reaction-diffusion-add-an-image/12552/1 "2019-07-07T10:56:35Z")

</div>

Hi Everybody, I hope someone can help :  
I have the reaction diffusion code based on points, what I’m trying to do is to add a black and white image inside the code and say in the condition loop that I want to apply the reaction diffusion only where the color is black.  
I tried several times but no results yet, hope someone that is more expert can help to figure out, I’ll leave the code where I’m working in, is in processing 3, and I’m leaving an image to show you what I’m looking for ![PNG](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/2/2c0ce576e7674e059a7bf19dfe04e32e15c54ebd.jpeg)

```auto
import java.awt.Color;

Cell[][] grid;
Cell[][] prev;

void setup() {
  size(300, 300);
  grid = new Cell[width][height];
  prev = new Cell[width][height];

  for (int i = 0; i < width; i++) {
    for (int j = 0; j < height; j ++) {
      float a = 1;
      float b = 0;
      grid[i][j] = new Cell(a, b);
      prev[i][j] = new Cell(a, b);
    }
  }

  for (int n = 0; n < 50; n++) {
    int startx = int(random(20, width-20));
    int starty = int(random(20, height-20));

    for (int i = startx; i < startx+10; i++) {
      for (int j = starty; j < starty+10; j ++) {
        float a = 5;
        float b = 5;
        grid[i][j] = new Cell(a, b);
        prev[i][j] = new Cell(a, b);
      }
    }
  }
}

float dA = 1.0;
float dB = 0.5;
float feed = 0.08;  
float k = 0.06;

class Cell {
  float a;
  float b;

  Cell(float a_, float b_) {
    a = a_;
    b = b_;
  }
}

void update() {
  for (int i = 1; i < width-1; i++) {
    for (int j = 1; j < height-1; j ++) {

      Cell spot = prev[i][j];
      Cell newspot = grid[i][j];

      float a = spot.a;
      float b = spot.b;

      float laplaceA = 0;     
      laplaceA += a*-1;
      laplaceA += prev[i+1][j].a*0.2;
      laplaceA += prev[i-1][j].a*0.2;
      laplaceA += prev[i][j+1].a*0.2;
      laplaceA += prev[i][j-1].a*0.2;
      laplaceA += prev[i-1][j-1].a*0.05;
      laplaceA += prev[i+1][j-1].a*0.05;
      laplaceA += prev[i-1][j+1].a*0.05;
      laplaceA += prev[i+1][j+1].a*0.05;

      float laplaceB = 0;
      laplaceB += b*-1;
      laplaceB += prev[i+1][j].b*0.2;
      laplaceB += prev[i-1][j].b*0.2;
      laplaceB += prev[i][j+1].b*0.2;
      laplaceB += prev[i][j-1].b*0.2;
      laplaceB += prev[i-1][j-1].b*0.05;
      laplaceB += prev[i+1][j-1].b*0.05;
      laplaceB += prev[i-1][j+1].b*0.05;
      laplaceB += prev[i+1][j+1].b*0.05;

      newspot.a = a + (dA*laplaceA - a*b*b + feed*(1-a))*1;
      newspot.b = b + (dB*laplaceB + a*b*b - (k+feed)*b)*1;

      newspot.a = constrain(newspot.a, 0, 1);
      newspot.b = constrain(newspot.b, 0, 1);
    }
  }
}  

void swap() {
  Cell[][] temp = prev;
  prev = grid;
  grid = temp;
}  

void draw() {
  //println(frameRate);

  for (int i = 0; i < 1; i++) {
    update();
    swap();
  }

  loadPixels();
  for (int i = 1; i < width-1; i++) {
    for (int j = 1; j < height-1; j ++) {
      Cell spot = grid[i][j];
      float a = spot.a;
      float b = spot.b;
      int pos = i + j * width;
      //pixels[pos] = color((a-b)*255);

      color aColor = color (0, 0, 0);
      color bColor = color (255, 255, 255);
      pixels[pos] = lerpColor(aColor, bColor, (a-b));
    }
  }
  updatePixels();

 }

```

Thanks for your help!

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [July 9, 2019, 2:54pm UTC](https://discourse.processing.org/t/reaction-diffusion-add-an-image/12552/2 "2019-07-09T14:54:49Z")

</div>

Hi @alice – was this answered here?

> [@Import Image and apply pattern](https://discourse.processing.org/t/import-image-and-apply-pattern/12229/9):
>
> I’m trying to follow some tutorials online to undertstand how to do It, If you have any tricks please share ! slight_smile Thanks!

---

<div class="post-metadata">

**Author:** ![Stanlepunk](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/stanlepunk/32/11509_2.png) [@Stanlepunk](https://discourse.processing.org/u/Stanlepunk)\
**Post date:** [July 9, 2019, 4:50pm UTC](https://discourse.processing.org/t/reaction-diffusion-add-an-image/12552/3 "2019-07-09T16:50:58Z")

</div>

You can try to pass by shader :  
[https://code.google.com/archive/p/rdex-fluxus/source/default/source](https://code.google.com/archive/p/rdex-fluxus/source/default/source)

I work on it too, but is not finish  
[https://github.com/StanLepunK/Shader](https://github.com/StanLepunK/Shader) you can find the shader in the folder `fx_post`and the code in the tab `Z_R_FX_post_rendering.pde` line 1596… I don’t if that’s help you…

---

<div class="post-metadata">

**Author:** ![alice](https://avatars.discourse-cdn.com/v4/letter/a/779978/32.png) [@alice](https://discourse.processing.org/u/alice)\
**Post date:** [July 11, 2019, 7:51pm UTC](https://discourse.processing.org/t/reaction-diffusion-add-an-image/12552/4 "2019-07-11T19:51:38Z")

</div>

Hi @jeremydouglass , yes was answered in the other topic !  
Thanks again 🙂

---

<div class="post-metadata">

**Author:** ![alice](https://avatars.discourse-cdn.com/v4/letter/a/779978/32.png) [@alice](https://discourse.processing.org/u/alice)\
**Post date:** [July 11, 2019, 7:52pm UTC](https://discourse.processing.org/t/reaction-diffusion-add-an-image/12552/5 "2019-07-11T19:52:21Z")

</div>

Thanks @Stanlepunk, Will try !