# How to find the coordinates of a bitmap shape

**URL:** <https://discourse.processing.org/t/how-to-find-the-coordinates-of-a-bitmap-shape/44699>\
**Category:** Beginners\
**Created:** [July 3, 2024, 9:17pm UTC](https://discourse.processing.org/t/how-to-find-the-coordinates-of-a-bitmap-shape/44699 "2024-07-03T21:17:36Z")\
**Posts on this page:** 1\
**Showing post:** 2

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [July 3, 2024, 10:30pm UTC](https://discourse.processing.org/t/how-to-find-the-coordinates-of-a-bitmap-shape/44699/2 "2024-07-03T22:30:45Z")

</div>

Hello @paulstgeorge,

> [@paulstgeorge](#):
>
> I want to know the xy coordinates of the start and end of each border/edge

I would start here:

> **[Images and Pixels](https://processing.org/tutorials/pixels/)**
>
> How to load and display images as well as access their pixels.

This example (in tutorial) may be a good place to start:  
[http://learningprocessing.com/examples/chp15/example-15-13-Convolution](http://learningprocessing.com/examples/chp15/example-15-13-Convolution)

You could modify the _convolution_ function to check the pixels in a matrix for colors and if they are different you will have a point (these will be adjacent pixels and not an exact point).

You may have to consider ranges in your checks if the colors are not homogenous. You can also check for brightness, saturation and hue and ranges for those.

Maybe zoom in to see what a transition looks like and then consider what to check for:

> [@Issue when rendering small rectangles](https://discourse.processing.org/t/issue-when-rendering-small-rectangles/38217/5):
>
> Hello, A very simple pixel viewer that I use to zoom in on sketch. Try different renderers, smooth() values, etc. I even tried odd and even. No pun intended! Some code for you to experiment with: // Pixel Viewer // v1.0.0 // GLV 2022-08-06 PImage img; boolean toggle; int oddeven, count, choice; void setup() { //size(650, 600); size(650, 600, P2D); //size(650, 600, P3D); background(255); //smooth(4); // Default is 2 noSmooth(); //strokeWeight(1); } …

An example with mouse movement:

```auto
PImage img;
int count;

void setup()
  {
  size(651, 477); //Image size
  img = loadImage( "c5d59a8653f86bbf9bf8daa834e885ae4e998ba5.png" );
  println(img.width, img.height);
  mouseX = 1;
  mouseY = 1;
  }

void draw() 
  {
  image(img, 0, 0);

  //loadPixels();

  // Each pixel location (x,y) gets passed into a function called convolution()
  // The convolution() function returns true if adjacent pixels different.
  boolean b = convolution(mouseX, mouseY); 
  if (b)
    println(b);

  //updatePixels();
  }

boolean convolution(int x, int y) 
  {
  int xc, yc, loc;
  boolean b;
  //println(x, y);
  
  xc = x;
  yc = y;
  loc = xc + img.width*yc;
  int c0 = img.pixels[loc];
 
  xc = x+10; // Adjacent steps not detected well with coarse mouse movements! Made it 10 for testing with mouse!
  yc = y+0;
  loc = xc + img.width*yc;
  int c1 = img.pixels[loc];
  
  // Only checking c0 and c1, 2 adjacent pixels as mouse moves left to right
  if (c0 != c1)
    {
    println(count, hex(c0), hex(c1));
    b = true;
    count++;
    }
  else 
    b = false;      
  return b; 
  }

```

That above was just my first pass at this; move mouse slowly left to right along x-axis.

I did something similar scanning the pixel array without mouse.  
Borders are simple.  
Finding that middle point a bit more challenging.

> [@paulstgeorge](#):
>
> I have a sketch that divides a rectangle into three cells

Since you are generating this you should have the information available to get these points. Just a thought.

`:)`

---

_[View the full topic](https://discourse.processing.org/t/how-to-find-the-coordinates-of-a-bitmap-shape/44699)._