Assignment 11

by austinmillett

HTML

<!-- Heading 1 -->
<h2> Austin Millett </h2>

<!-- Heading 2 -->
<h3> Assignment 11 - Interpolation </h3>

<!-- Textbox -->
Which hour would you like to view (0hr - 6hrs) <input type = "textbox" id = "whichHour" /> <br/>

<!-- "Submit" Button -->
<input type = "button" id = "submit" value = "Submit" onClick = "getTheValue();" /> <br/> <br/>

<!-- Output 1 -->
Here is the hour you chose:
<div id = "output1"> </div> <br/>

<!-- Output 2 -->
Total rainfall at this hour:
<div id = "output2"> </div> <br/>

CSS

/* Design for "Submit" button */
#submit {
background-color: black; 
border: 2px solid; 
color: white;
padding: 4px 8px; 
text-align: center; 
font-size: 15px; 
}

JavaScript

// Retrieving hour inputted by user
function getTheValue() {
var value = document.getElementById('whichHour').value;

// Linear interpolation function 
linearInterpolation(value);}
function linearInterpolation(value){
if(value < 0 | value > 6){

// If invaild value alert undefined
alert("Undefined");
return null;
}

// Defining given array for function 
var array = new Array("0.00", "0.04", "0.11", "0.60","0.87", "0.95", "1.00");

// If valid value display output if invalid alert "Undefined"
if(value >= 0 | value <= 6){
var rain = array[value];
if(rain === undefined){ 
var x1 = Math.floor(value);
var x2 = Math.ceil(value);
var x = value;
var y1 = array[x1];
var y2 = array[x2];
var eq1 = ((x-x1)/(x2-x1)).toFixed(2)
var eq2 = (eq1*(y2-y1)).toFixed(2);
var eq3 = (+eq2 + +y1).toFixed(2);
rain = eq3;
}
}
  
// Displays output's 1 & 2
document.getElementById("output1").innerHTML = value;
document.getElementById("output2").innerHTML = rain;
}