# Mouse x y coordinates (ControlP5)

**URL:** <https://discourse.processing.org/t/mouse-x-y-coordinates-controlp5/24774>\
**Category:** Libraries\
**Created:** [October 20, 2020, 11:53pm UTC](https://discourse.processing.org/t/mouse-x-y-coordinates-controlp5/24774 "2020-10-20T23:53:22Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![pandl](https://avatars.discourse-cdn.com/v4/letter/p/35a633/32.png) [@pandl](https://discourse.processing.org/u/pandl)\
**Post date:** [October 20, 2020, 11:53pm UTC](https://discourse.processing.org/t/mouse-x-y-coordinates-controlp5/24774/1 "2020-10-20T23:53:23Z")

</div>

Thank you for reading this. The following is a summary of the current code.

I have an array of circles that represent LEDs.

I have radio buttons, using the P5 library, to select a colour.

What I’d like to do is click on an LED to select it. From there I can change its status (whether it’s off or on), its on colour or its off colour.

I know the x and y position of the centre of the LEDs and I know its diameter and to avoid calculating the range of x and y values every time a LED is clicked on I could created a look-up table for each LED.

This might be OK for an array of 8 LEDs but it will soon get out of hand if I use the same idea for say 64 LEDS.

What I have created so far seems a bit clumsy. Is there a better way?

I wrote this yesterday and in the meantime I had an idea. I could create an array of P5 buttons instead of LEDs. That would mean, as far as I know, that I would then need a function for each button. Also, how do I create a button without a label?

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [October 21, 2020, 7:17am UTC](https://discourse.processing.org/t/mouse-x-y-coordinates-controlp5/24774/2 "2020-10-21T07:17:40Z")

</div>

Yes set the x y coordinates in an array and use something like code below…  
For a radio button without label, just leave the string empty, like `.addItem("",1)`

```auto
void mousePressed() {
  for (int i = 0; i < 3; i++) {
    if (mouseX > bx_val[i] && mouseX < bx_val[i] +button_width && mouseY > bys && mouseY < bys+button_height) {
      switch(i) {
      case 0:
        if conditional;
        break;
      case 1:
        if conditional;
        break;
      case 2:
         if conditional;
        break;
      }
    }
  }

```

---

<div class="post-metadata">

**Author:** ![pandl](https://avatars.discourse-cdn.com/v4/letter/p/35a633/32.png) [@pandl](https://discourse.processing.org/u/pandl)\
**Post date:** [October 21, 2020, 7:37am UTC](https://discourse.processing.org/t/mouse-x-y-coordinates-controlp5/24774/3 "2020-10-21T07:37:34Z")

</div>

Thank noel you for your reply.

I was thinking that a long switch / case statement would be untidy but so be it.

Also , thank you for your .addItem() answer, I couldn’t see beyond something like the following:

```auto
cp.addRadioButton("radioButton")

void raioButton(int b)

```

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [October 23, 2020, 9:34am UTC](https://discourse.processing.org/t/mouse-x-y-coordinates-controlp5/24774/4 "2020-10-23T09:34:37Z")

</div>

> [@pandl](#):
>
> I was thinking that a long switch / case statement would be untidy but so be it.

when you have the index of the button you can use the index maybe as an index for your LEDs array

---

<div class="post-metadata">

**Author:** ![pandl](https://avatars.discourse-cdn.com/v4/letter/p/35a633/32.png) [@pandl](https://discourse.processing.org/u/pandl)\
**Post date:** [October 24, 2020, 4:08am UTC](https://discourse.processing.org/t/mouse-x-y-coordinates-controlp5/24774/6 "2020-10-24T04:08:30Z")

</div>

Thank you Chrisir,

I’ve made some headway with mouse x y idea. However, as you say, a button index would would select an LED without any calculation. I’ll experiment.

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [October 24, 2020, 2:05pm UTC](https://discourse.processing.org/t/mouse-x-y-coordinates-controlp5/24774/7 "2020-10-24T14:05:19Z")

</div>

For example when the leds are in a array you can convert mouse position to index

Like with division or modulo

Similar problem:

Getting the color of a single pixel with **get(x, y)** is easy, but not as fast as grabbing the data directly from **pixels[]**. The equivalent statement to **get(x, y)** using **pixels[]** is **pixels[y\*width+x]**.

---

<div class="post-metadata">

**Author:** ![pandl](https://avatars.discourse-cdn.com/v4/letter/p/35a633/32.png) [@pandl](https://discourse.processing.org/u/pandl)\
**Post date:** [October 24, 2020, 10:35pm UTC](https://discourse.processing.org/t/mouse-x-y-coordinates-controlp5/24774/8 "2020-10-24T22:35:52Z")

</div>

Thank you again, Chrisir.

I have used get(x,y) to rotate colours through an array of LEDs based on knowing the colour of the pixel at the centre of the LED. I had seen the reference to pixels[] but haven’t tried it. I will have a think about your suggestion regarding mouse position to array index.
