Final Project- COVID-19 cases in America – [OLD FALL 2020] 15-104 • Introduction to Computing for Creative Practice

My final project is an infographic of America with the number of COVID-19 cases in each state. Based on the number of cases in America, and how high the number is, the color of each state varies from a medium pink to a very dark red.
My process and code is very long because I planned out my steps wrong and had the wrong approach. I thought if I separated each state, I would be able to let mouseX and mouseY detect each state. However, because the pngs are the same size, my approach did not work out.
sketch
//Chris Han
//Final Project
//15-104 Section C

var California;
var Alabama;
var Arizona;
var Arkansas;
var Colorado;
var Connecticut;
var Delaware;
var Florida;
var Georgia;
var Idaho;
var Illinois;
var Indiana;
var Iowa;
var Kansas;
var Kentucky;
var Louisiana;
var Maine;
var Maryland;
var Massachussets;
var Michigan;
var Mississippi;
var Minnesota;
var Montana;
var Nebraska;
var Nevada;
var NewJersey;
var NewMexico;
var NewYork;
var NorthCarolina;
var Ohio;
var NorthDakota;
var Oklahoma;
var Oregon;
var Pennsylvania;
var Virginia;
var Washington;
var WestVirginia;
var RhodeIsland;
var SouthCarolina;
var SouthDakota; 
var Tennessee;
var Texas;
var Vermont;
var Utah;
var Wisconsin;
var Wyoming;
var Missouri;
var NewHampshire;

function preload(){
	California = loadImage("https://i.imgur.com/M90B6i6.png");
	Alabama = loadImage("https://i.imgur.com/A0rMfn9.png");
	Arizona = loadImage("https://i.imgur.com/FZgFQXG.png");
	Arkansas = loadImage("https://i.imgur.com/mady7aS.png");
	Colorado = loadImage("https://i.imgur.com/Cm0XtJk.png");
	Connecticut = loadImage("https://i.imgur.com/Kgbe7x6.png");
	Delaware = loadImage("https://i.imgur.com/gPJn6me.png");
	Florida = loadImage("https://i.imgur.com/hH4ByDe.png");
	Georgia = loadImage("https://i.imgur.com/QqS08V1.png");
	Idaho = loadImage("https://i.imgur.com/IAWMdLX.png");
	Illinois = loadImage("https://i.imgur.com/dFEAfM3.png");
	Indiana = loadImage("https://i.imgur.com/yINwRlF.png");
	Iowa = loadImage("https://i.imgur.com/bDpW2F1.png");
	Kansas = loadImage("https://i.imgur.com/viHxihJ.png");
	Kentucky = loadImage("https://i.imgur.com/dYri9KS.png");
	Louisiana = loadImage("https://i.imgur.com/fmCBz3P.png");
	Maine = loadImage("https://i.imgur.com/MLwg0xh.png");
	Maryland = loadImage("https://i.imgur.com/GR8e2uJ.png");
	Massachussets = loadImage("https://i.imgur.com/llu4pfW.png");
	Michigan = loadImage("https://i.imgur.com/Dzu9Anc.png");
	Mississippi = loadImage("https://i.imgur.com/HRFksTw.png");
	Minnesota = loadImage("https://i.imgur.com/PQ2rbnn.png");
	Montana = loadImage("https://i.imgur.com/FFZVEDr.png");
	Nebraska = loadImage("https://i.imgur.com/pjSdpc4.png");
	Nevada = loadImage("https://i.imgur.com/gKE4OD7.png");
	NewJersey = loadImage("https://i.imgur.com/pLxSZQ6.png");
	NewMexico = loadImage("https://i.imgur.com/ZxZ5TGy.png");
	NewYork = loadImage("https://i.imgur.com/fOMfdss.png");
	NorthCarolina = loadImage("https://i.imgur.com/ml7w2CO.png");
	Ohio = loadImage("https://i.imgur.com/P6npxwO.png");
	NorthDakota = loadImage("https://i.imgur.com/IHceHrO.png");
	Oklahoma = loadImage("https://i.imgur.com/YUe8N4U.png");
	Oregon = loadImage("https://i.imgur.com/lKD2lzT.png");
	Pennsylvania = loadImage("https://i.imgur.com/q8BZJJY.png");
	Virginia = loadImage("https://i.imgur.com/xXbl27h.png");
	Washington = loadImage("https://i.imgur.com/iYUxkXx.png");
	WestVirginia = loadImage("https://i.imgur.com/opvQBQx.png");
	RhodeIsland = loadImage("https://i.imgur.com/Eqyjeyw.png");
	SouthCarolina = loadImage("https://i.imgur.com/n7mnprl.png");
	SouthDakota = loadImage("https://i.imgur.com/0dnuWnc.png");
	Tennessee = loadImage("https://i.imgur.com/fA9Ey2X.png");
	Texas = loadImage("https://i.imgur.com/N3H2oM5.png");
	Vermont = loadImage("https://i.imgur.com/VKAgM5K.png");
	Utah = loadImage("https://i.imgur.com/HsGInYv.png");
	Wisconsin = loadImage("https://i.imgur.com/1706iC4.png");
	Wyoming = loadImage("https://i.imgur.com/P2FMqfi.png");
	NewHampshire = loadImage("https://i.imgur.com/JUHRFya.png");
	Missouri = loadImage("https://i.imgur.com/KtNPgmC.png");


}

function setup() {
    createCanvas(600,400);
    //background('white');
    background('white');
}


function draw() {
	textSize(10);
    fill('black');
    text('COVID-19 cases in America', 250, 70);
    textSize(7);
    text('click on any state to start',270, 85);

	California.resize( 400,400);
	image(California, 0,0);

	Alabama.resize( 400,400);
	image(Alabama, 0, 0);

	Arizona.resize( 400,400);
	image(Arizona, 0, 0);

	Arkansas.resize( 400, 400);
	image(Arkansas, 0 , 0);

	Colorado.resize( 400, 400);
	image(Colorado, 0, 0);

	Connecticut.resize( 400, 400);
	image(Connecticut, 0, 0);

	Delaware.resize(400, 400);
	image(Delaware, 0,0);

	Florida.resize(400, 400);
	image(Florida, 0, 0);

	Georgia.resize(400, 400);
	image(Georgia, 0, 0);

	Idaho.resize(400, 400);
	image(Idaho, 0, 0);

	Illinois.resize(400, 400);
	image(Illinois, 0, 0);

	Indiana.resize(400, 400);
	image(Indiana, 0, 0);

	Iowa.resize(400, 400);
	image(Iowa, 0, 0);

	Kansas.resize(400,400);
	image(Kansas, 0, 0);

	Kentucky.resize(400,400);
	image(Kentucky, 0, 0);

	Louisiana.resize(400,400);
	image(Louisiana, 0, 0);

	Maine.resize(400,400);
	image(Maine, 0, 0);

	Maryland.resize(400,400);
	image(Maryland, 0, 0);

	Massachussets.resize(400,400);
	image(Massachussets, 0, 0);

	Michigan.resize(400,400);
	image(Michigan, 0, 0);

	Mississippi.resize(400,400);
	image(Mississippi, 0, 0);

	Minnesota.resize(400,400);
	image(Minnesota, 0, 0);

	Montana.resize(400,400);
	image(Montana, 0, 0);

	Nebraska.resize(400,400);
	image(Nebraska, 0, 0);

	Nevada.resize(400,400);
	image(Nevada, 0, 0);

	NewJersey.resize(400,400);
	image(NewJersey, 0, 0);

	NewMexico.resize(400,400);
	image(NewMexico, 0, 0);

	NewYork.resize(400,400);
	image(NewYork, 0, 0);

	NorthCarolina.resize(400,400);
	image(NorthCarolina, 0, 0);

	Ohio.resize(400,400);
	image(Ohio, 0, 0);

	NorthDakota.resize(400,400);
	image(NorthDakota, 0, 0);

	Oklahoma.resize(400,400);
	image(Oklahoma, 0, 0);

	Oregon.resize(400,400);
	image(Oregon, 0, 0);

	Pennsylvania.resize(400,400);
	image(Pennsylvania, 0, 0);

	Virginia.resize(400,400);
	image(Virginia, 0, 0);

	Washington.resize(400,400);
	image(Washington, 0, 0);

	WestVirginia.resize(400,400);
	image(WestVirginia, 0, 0);

	RhodeIsland.resize(400,400);
	image(RhodeIsland, 0, 0);

	SouthCarolina.resize(400,400);
	image(SouthCarolina, 0, 0);

	Tennessee.resize(400,400);
	image(Tennessee, 0, 0);

	Texas.resize(400,400);
	image(Texas, 0, 0);

	Vermont.resize(400,400);
	image(Vermont, 0, 0);

	Utah.resize(400,400);
	image(Utah, 0, 0);

	Wisconsin.resize(400,400);
	image(Wisconsin, 0, 0);

	Wyoming.resize(400,400);
	image(Wyoming, 0, 0);

	SouthDakota.resize(400,400);
	image(SouthDakota, 0, 0);

	NewHampshire.resize(400,400);
	image(NewHampshire, 0, 0);

	Missouri.resize(400,400);
	image(Missouri, 0, 0);

	mouseClicked();

}


function mouseClicked(){

	//CALIFORNIA

		if (mouseX > 40 & mouseX < 65 && mouseY > 115 && mouseY < 235) {
		textSize(5);
		fill('white');
		text('CA, 1.49M', 45, 170);
	}

	//nevada
	if(mouseX > 59 & mouseX < 102 && mouseY > 126 && mouseY < 211){
		textSize(5);
		fill('white');
		text('NV, 179K', 70, 160);
	}

	//oregon
	if(mouseX > 41 & mouseX < 84 && mouseY < 126 && mouseY > 86){
        textSize(5);
		fill('white');
		text('OR, 89K', 70, 104);
	}
	//washington
	if( mouseY > 49 & mouseY < 94 && mouseX < 95 && mouseX > 62 ){
		textSize(5);
		fill('white');
		text('WA, 201K', 70, 75);
	}

	//idaho
	if (mouseX > 92 & mouseX < 111 && mouseY > 64 && mouseY < 140){
		textSize(5);
		fill('white');
		text('ID, 118K', 95, 123);
	}
	//utah
	if( mouseX > 93 & mouseX < 126 && mouseY > 143 && mouseY < 199){
		textSize(5);
		fill('white');
		text('utah lol', 102, 176);
	}
	//arizona
	if( mouseX > 81 & mouseX < 119 && mouseY > 198 && mouseY < 262){
		textSize(5);
		fill('white');
		text('AZ, 390K', 90, 221);
	}

	//montana
	if ( mouseX > 110 & mouseX < 170 && mouseY > 72 && mouseY < 120){
		textSize(5);
		fill('white');
		text('MT, 71K', 127, 92);

	}

	//wyoming
	if ( mouseX > 121 & mouseX < 165 && mouseY > 119 && mouseY < 164){
		textSize(5);
		fill('white');
		text('WY, 38K', 133, 142);

	}

	//colorado

	if ( mouseX > 129 & mouseX < 173 && mouseY > 166 && mouseY < 209){
		textSize(5);
		fill('white');
		text('CO, 283K ', 136, 187);
	}

	//new mexico
	if (mouseX > 118 & mouseX < 160 && mouseY > 209 && mouseY < 262){
		textSize(5);
		fill('white');
		text('NM, 117K', 127, 235);
	}

	//north dakota
	if (mouseX > 174 & mouseX < 212 && mouseY > 87 && mouseY < 119){
	    textSize(5);
		fill('white');
		text('ND, 87K ', 179, 101);

	}

	//south dakota
	if ( mouseX > 168 & mouseX < 212 && mouseY > 120 && mouseY < 152){
		textSize(5);
		fill('white');
		text('SD, 89K', 176, 134);

	}

	//nebraska
	if ( mouseX > 165 & mouseX < 211 && mouseY > 153 && mouseY < 185){
		textSize(5);
		fill('white');
		text('NE, 147K', 173, 159);
	}

	//kansas
	if ( mouseX > 173 & mouseX < 219 && mouseY > 186 && mouseY < 218){
		textSize(5);
		fill('white');
		text('KS, 188K', 179, 198);
	}

	//oklahoma
	if ( mouseX > 182 & mouseX < 220 && mouseY > 217 && mouseY < 254 ){
		textSize(5);
		fill('white');
		text('OK, 229K', 187, 231);
	}
	//texas
	if ( mouseX > 160 & mouseX < 220 && mouseY > 250 && mouseY < 338){
		textSize(5);
		fill('white');
		text('TX, 1.42M', 174, 274);
	}

	//minnesota
	if (mouseX > 212 & mouseX < 237 && mouseY > 92 && mouseY < 150){
		textSize(5);
		fill('white');
		text('MN, 371K', 220, 112);
	}

	//iowa
	if (mouseX > 213 & mouseX < 243 && mouseY > 150 && mouseY < 181){
		textSize(5);
		fill('white');
		text('IA, 254K ', 220, 164);
	}

	//missouri
	if (mouseX > 220 & mouseX < 246 && mouseY > 183 && mouseY < 226){
		textSize(5);
		fill('white');
		text('MO, 355K ', 226, 207);
	}

	//arkansas
	if (mouseX > 219 & mouseX < 246 && mouseY > 227 && mouseY < 264){
		textSize(5);
		fill('white');
		text('AR, 182K', 226, 244);
	}

	//louisiana
	if( mouseX > 226 & mouseX < 240 && mouseY > 265 && mouseY < 302){
		textSize(5);
		fill('white');
		text('LA, 264K ', 229, 277);
	}

	//wisconin
	if(mouseX > 236 & mouseX < 265 && mouseY > 118 && mouseY < 161){
		textSize(5);
		fill('white');
		text('WI, 461K', 243, 133);
	}
	//illinois
	if(mouseX > 242 & mouseX < 266 && mouseY > 162 && mouseY < 218){
		textSize(5);
		fill('white');
		text('IL, 835K', 249, 188);
	}

	//kentucky
	if( mouseX > 256 & mouseX < 302 && mouseY > 207 && mouseY < 222){
		textSize(5);
		fill('white');
		text('KY, 221K', 272, 215);
	}

	//tennessee
	if(mouseX > 254 & mouseX < 296 && mouseY > 222 && mouseY < 241){
		textSize(5);
		fill('white');
		text('TN, 426K', 261, 233);
	}

	//Mississippi
	if(mouseX > 244 & mouseX < 263 && mouseY > 243 && mouseY < 287){
		textSize(5);
		fill('white');
		text('MS, 175K', 244, 263);
	}

	//michigan
	if(mouseX > 274 & mouseX < 296 && mouseY > 127 && mouseY < 166){
		textSize(5);
		fill('white');
		text('MI, 460K ', 276, 145);
	}

	//indiana
	if( mouseX > 267 & mouseX < 285 && mouseY > 168 && mouseY < 203){
		textSize(5);
		fill('white');
		text('IN, 415K', 270, 185);
	}
	//alabama
	if( mouseX > 263 & mouseX < 286 && mouseY > 243 && mouseY < 285){
		textSize(5);
		fill('white');
		text('AL, 289K', 270, 264);
	}
	//ohio
	if( mouseX > 285 & mouseX < 311 && mouseY > 169 && mouseY < 198){
		textSize(5);
		fill('white');
		text('OH, 542K', 289, 184);
	}

	//georgia
	if( mouseX > 286 & mouseX < 313 && mouseY > 242 && mouseY < 288){
		textSize(5);
		fill('white');
		text('GA, 513K', 293, 266);
	}
	//florida
	if( mouseX > 307 & mouseX < 327 && mouseY > 289 && mouseY < 346){
		textSize(5);
		fill('white');
		text('FL, 1.11M', 309, 311);
	}
	//west virginia
	if (mouseX > 299 & mouseX < 322 && mouseY > 186 && mouseY < 216){
		textSize(5);
		fill('white');
		text('WV, 60K', 303, 200);
	}

	//virginia
	if (mouseX > 299 & mouseX < 343 && mouseY > 196 && mouseY < 219){
		textSize(5);
		fill('white');
		text('VA, 274K', 318, 209);
	}

	//north carolina
	if (mouseX > 299 & mouseX < 347 && mouseY > 220 && mouseY < 241){
		textSize(5);
		fill('white');
		text('NC, 425K', 312, 230);
	}

	//south carolina
	if (mouseX > 303 & mouseX < 334 && mouseY > 239 && mouseY < 265){
		textSize(5);
		fill('white');
		text('SC, 245K', 306, 245);
	}

	//pennylvania
	if (mouseX > 311 & mouseX < 345 && mouseY > 158 && mouseY < 182){
		textSize(5);
		fill('white');
		text('PA, 276K', 319, 169);
	}

	//new jersey
	if (mouseX > 347 & mouseX < 356 && mouseY > 164 && mouseY < 190){
		textSize(5);
		fill('white');
		text('NJ, 392K', 350, 173);
	}
	//maryland
	if (mouseX > 329 & mouseX < 342 && mouseY > 184 && mouseY <200){
		textSize(5);
		fill('white');
		text('MA, 280K', 356, 147);
	}

	//delaware
	if( mouseX > 345 & mouseX < 353 && mouseY > 186 && mouseY < 195){
		textSize(5);
		fill('white');
		text('DE, 476K', 347, 189);
	}

	//newyork
	if( mouseX > 317 & mouseX < 355 && mouseY >123 && mouseY < 156){
		textSize(5);
		fill('white');
		text('NY, 760K', 325, 149);
	}
	//conneticut
	if( mouseX > 356 & mouseX < 365 && mouseY > 152 && mouseY < 163){
		textSize(5);
		fill('white');
		text('CT, 147K', 359, 162);
	}

	//rhode island
	if( mouseX > 365 & mouseX < 370 && mouseY > 150 && mouseY < 158){
		textSize(5);
		fill('white');
		text('RI, 70K ', 371, 158);
	}
	//massachusetts
	if(mouseX > 355 & mouseY < 372 && mouseY > 144 && mouseY < 150){
		textSize(5);
		fill('white');
		text('MA, 280K', 368, 142);
	}

	//vermont
	if( mouseX > 351 & mouseX < 360 && mouseY > 121 && mouseY < 145){
		textSize(5);
		fill('white');
		text('VT, 5K', 351, 125);
	}

	//new hampshire
	if(mouseX > 359 & mouseX < 368 && mouseY > 117 && mouseY < 143){
		textSize(5);
		fill('white');
		text('NH, 29K', 362, 136);
	}
	//maine
	if(mouseX > 364 & mouseX < 388 && mouseY > 91 && mouseY < 128){
		textSize(5);
		fill('white');
		text('ME, 15K', 365, 106);
	}




}
Leave a Reply Cancel reply
