p5.js NumberDict div() Method

The div() method of p5.NumberDict in p5.js divides the value at the given key with the given value and stores the updated result at the same key. A key-value pair is a set of two values that are mapped to each other. These values can be accessed by querying this dictionary using the key portion of the pair. A number dictionary can store multiple key-value pairs that can be accessed using the methods of the dictionary.

Syntax:

div( Key, Amount )

Parameters: This function has two parameters as shown above and discussed below:

Key: This is a number that denotes the key from where the value would be divided.
Amount: This denotes the number to divide the value by,

The example below illustrates the div() method in p5.js:

Example:

JavaScript

let y = 0;

function setup() {
  createCanvas(550, 500);
  textSize(16);

  text("Click on the button to create a new " +
       "dictionary and divide the given value",
       20, 20);

  text("Key:", 20, 260);
  text("Value:", 160, 260);

  key_input = createInput();
  key_input.position(70, 250);
  key_input.size(40);

  val_input = createInput();
  val_input.position(220, 250);
  val_input.size(40);

  setBtn = 
    createButton("Create random dictionary");
  setBtn.position(30, 40);
  setBtn.mouseClicked(createNewDict);

  divBtn =
    createButton("Divide given value at key");
  divBtn.position(30, 300);
  divBtn.mouseClicked(divVal);
}

function createNewDict() {
  clear();

  // Create an object with random values
  let obj = {};
  for (let i = 0; i < 6; i++) {
    let rk = ceil(Math.random() * 100);
    let rn = floor(Math.random() * 100);
    obj[rk] = rn;

    text("Key: " + rk + " : Value: " +
         rn, 40, 120 + 20 * i);
  }

  // Create a number dict using the above values
  numDict = createNumberDict(obj);

  text("New Dictionary created with values",
       20, 80);

  text("Click on the button to create a new " +
       "dictionary and divide the given value",
       20, 20);

  text("Key:", 20, 260);
  text("Value:", 160, 260);
}

function divVal() {
  
  // Get the key and value to be updated
  let keyToChange = int(key_input.value());
  let valToDiv = int(val_input.value());

  // Get the previous value in the dictionary
  let prevVal = numDict.get(keyToChange);

  // If the key exists in the dictionary
  if (prevVal) {
    numDict.div(keyToChange, valToDiv);

    // Get the updated value
    let updatedVal = numDict.get(keyToChange);
  
    text("The value at key: " + keyToChange +
         " was: " + prevVal, 20, 360 + y * 40);
    text("The updated value at key: " +
         keyToChange + " is: " + updatedVal,
         20, 380 + y * 40);
  }
  else {
    text("Please enter a proper key",
         20, 380 + y * 40);
  }

  y = y + 1;

  text("Click on the button to create a new " +
       "dictionary and divide the given value",
       20, 20);
}

Output:

Online editor: https://editor.p5js.org/
Environment Setup: https://www.geeksforgeeks.org/javascript/p5-js-soundfile-object-installation-and-methods/
Reference: https://p5js.org/reference/#/p5.NumberDict/div

p5.js NumberDict div() Method

Explore