let chk2;

let chk3;

​

function setup() {

    createCanvas(400, 400);

  // get the checkboxes by their id

  // .elt means get the html element 

    chk1 = select("#box1").elt;

    chk2 = select("#box2").elt;

    chk3 = select("#box3").elt;

​

  // this function will be called whenever the box changes

    chk1.onchange = function() {

    // we only want to change things if the box was turned on

    // so we check like this

        if (chk1.checked) {

            chk2.checked = false;

            chk3.checked = false;

        }

    }

​

    chk2.onchange = function() {

        if (chk2.checked) {

            chk1.checked = false;

            chk3.checked = false;

        }

    }

​

    chk3.onchange = function() {

        if (chk3.checked) {

            chk1.checked = false;

            chk2.checked = false;

        }

    }

}

​

function draw() {

    background(220);

  // do some drawing if the boxes are checked

  if(chk1.checked){

   rect(150,150,100,100); 

  }

  if(chk2.checked){

   ellipse(200,200,200,200); 

  }

  if(chk3.checked){

   line(100,100,300,300); 

  }

}