# Variable to read an array of numbers in p5?

**URL:** <https://discourse.processing.org/t/variable-to-read-an-array-of-numbers-in-p5/13377>\
**Category:** Coding Questions\
**Created:** [August 14, 2019, 5:08pm UTC](https://discourse.processing.org/t/variable-to-read-an-array-of-numbers-in-p5/13377 "2019-08-14T17:08:35Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![calornorte](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/calornorte/32/6066_2.png) [@calornorte](https://discourse.processing.org/u/calornorte)\
**Post date:** [August 14, 2019, 5:08pm UTC](https://discourse.processing.org/t/variable-to-read-an-array-of-numbers-in-p5/13377/1 "2019-08-14T17:08:35Z")

</div>

![09%20PM](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/b/b1516af0590ead3b79aff719a44fc534db3b8176.png)

I come from modular programing, (Max/puredata) world, the pic above explains better (at least for me) what I want to do in p5.  
I have a variable that goes in between 0 and 100, I want to use this variable to read from a “map/array/curve” of numbers, so when it reaches 50 it’ll reach the max in the array.

what’s the easiest way of doing this?  
I had a look to the array functions in p5 though I have no idea about how to implement it.

thank you

---

<div class="post-metadata">

**Author:** ![jb4x](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jb4x/32/789_2.png) [@jb4x](https://discourse.processing.org/u/jb4x)\
**Post date:** [August 14, 2019, 7:47pm UTC](https://discourse.processing.org/t/variable-to-read-an-array-of-numbers-in-p5/13377/2 "2019-08-14T19:47:52Z")

</div>

Hi,

Is there a reason why you are not using a formula?

Somthing like:

```auto
if (x <= 50) {
  y = 2 * x;
} else {
  y = - 2 * x + 200
}

```

---

<div class="post-metadata">

**Author:** ![calornorte](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/calornorte/32/6066_2.png) [@calornorte](https://discourse.processing.org/u/calornorte)\
**Post date:** [August 15, 2019, 3:37pm UTC](https://discourse.processing.org/t/variable-to-read-an-array-of-numbers-in-p5/13377/3 "2019-08-15T15:37:14Z")

</div>

just cause of ignorance.  
thank you, this is perfect!

---

<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:** [August 16, 2019, 11:36pm UTC](https://discourse.processing.org/t/variable-to-read-an-array-of-numbers-in-p5/13377/4 "2019-08-16T23:36:32Z")

</div>

Note that you can also build these out of map() if you want them to be sort of like max/msp or pd components.

> **[map() / Reference](https://processing.org/reference/map_.html)**
>
> Re-maps a number from one range to another. In the first example above, the number 25 is converted from a value in the range of 0 to 100 into a value that ranges from the left edge of the w…

So, say instead of a triangle wave you wanted an s-curve (sigmoid function):

- [Sigmoid function - Wikipedia](https://en.wikipedia.org/wiki/Sigmoid_function)

![svg](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/c/cb7033e9ce81bc781ee067006d99e4d603d18377.png)

So you want your component to do this:

> 1/(1 + e^-x)

which is written:

`1/(1 + exp(-x))`

But you need to map ranges of inputs and outputs around it…

Below are some simple examples of wrapping these kinds of things up in a convenient function using map().

```auto
/**
 * map-based waves
 * Processing 3.4 2019-08
 * https://discourse.processing.org/t/variable-to-read-an-array-of-numbers-in-p5/13377
 */

void draw() {
  background(128);
  float y=0;
  for(float x=0; x<width; x=x+0.2){ // loop over screen to draw points
    y = mapSawtooth(x, 0, 10, 100, 70); // period of 1-10, output 100-70
    point(x, y);
    y = mapTriangleWave(x, 0, 50, 35, 65);
    point(x, y);
    y = mapSigmoid(x, 0, width, 30, 5);
    point(x, y);
  }
}

/**
 * call a generic wave / saw / square function.
 * Use map to put x in; use map to get y out.
 **/
float mapSigmoid(float x, float start1, float stop1, float start2, float stop2){
  float nx=map(x, start1, stop1, -TWO_PI, TWO_PI);
  float y = sigmoid(nx);
  float ny = map(y, 0, 1, start2, stop2);
  return ny;
}

/**
 * s-curve: sigmoid generic formula.
 * Over x[-TWO_PI, TWO_PI] its output y ranges [0-1]
 **/
float sigmoid(float x) {
  return 1/(1 + exp(-x));
}

float mapTriangleWave(float x, float start1, float stop1, float start2, float stop2){
  float nx=map(x, start1, stop1, 0, 1);
  float y = triangleWave(nx);
  float ny = map(y, 0, 1, start2, stop2);
  return ny;
}

/**
 * triangle wave generic formula.
 * Over x[0, 1] its output y ranges [0-1-0]
 **/
float triangleWave(float x) {
  return 2 * abs(sawtooth(x)-0.5);
}

float mapSawtooth(float x, float start1, float stop1, float start2, float stop2){
  float nx=map(x, start1, stop1, 0, 1);
  float y = sawtooth(nx);
  float ny = map(y, 0, 1, start2, stop2);
  return ny;
}

/**
 * sawtooth wave
 * Over x[0, 1] its output y ranges [0-1]
 */
float sawtooth(float x){
  return x % 1.0;
}

```

![curves](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/5/5f90910450b1f7e9af3cf488b8898de860bac3ce.png)

The key idea is that you are taking a really simple piece of code – like `x % 1.0` for a sawtooth – and wrapping it in a pretty generic way to turn it into something like a pd component.

---

<div class="post-metadata">

**Author:** ![calornorte](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/calornorte/32/6066_2.png) [@calornorte](https://discourse.processing.org/u/calornorte)\
**Post date:** [November 7, 2019, 10:58pm UTC](https://discourse.processing.org/t/variable-to-read-an-array-of-numbers-in-p5/13377/5 "2019-11-07T22:58:18Z")

</div>

Thanks again Jeremy!  
i had the intuition that map might be able to help me cause in the object oriented world it has been used for this as well though I have no clue about how to implement this.  
the map-based waves example is a bit intimidating to be honest but I think i get its principle.  
thank you lots!