using JS Modify this program so that the annual interest rate is not based on users input, but based on users credit score Below is the logic Credit Score 400 400 500 500 600 600 700 700 800 800 Interest Rate 10 0 8 0 6 0 4 0 3 5 3 0 JavaScript Loan Calculator This is a CSS style sheet it adds style to the program output output font weight bold Calculated values in bold payment text decoration underline For element with id payment graph border solid black 1px Chart has a simple border th, td vertical align top Don't center table cells Enter Loan Data Loan Balance, Cumulative Equity, and Interest Payments Amount of the loan ($) Credit Score Repayment period (years) Zipcode (to find lenders) Approximate Payments Calculate Monthly payment $ Total payment $ Total interest $ use strict Use ECMAScript 5 strict mode in browsers that support it This script defines the calculate() function called by the event handlers in HTML above The function reads values from elements, calculates loan payment information, displays the results in elements It also saves the user's data, displays links to lenders, and draws a chart function calculate() Look up the input and output elements in the document var amount document getElementById( amount ) var apr document getElementById( apr ) var years document getElementById( years ) var zipcode document getElementById( zipcode ) var payment document getElementById( payment ) var total document getElementById( total ) var totalinterest document getElementById( totalinterest ) Get the user's input from the input elements Assume it is all valid Convert interest from a percentage to a decimal, and convert from an annual rate to a monthly rate Convert payment period in years to the number of monthly payments var principal parseFloat(amount value) var interest parseFloat(apr value) 100 12 var payments parseFloat(years value) 12 Now compute the monthly payment figure var x Math pow(1 interest, payments) Math pow() computes powers var monthly (principal x interest) (x 1) If the result is a finite number, the user's input was good and we have meaningful results to display if (isFinite(monthly)) Fill in the output fields, rounding to 2 decimal places payment innerHTML monthly toFixed(2) total innerHTML (monthly payments) toFixed(2) totalinterest innerHTML ((monthly payments) principal) toFixed(2) Save the user's input so we can restore it the next time they visit save(amount value, apr value, years value, zipcode value) Finally, chart loan balance, and interest and equity payments chart(principal, interest, monthly, payments) else Result was Not a Number or infinite, which means the input was incomplete or invalid Clear any previously displayed output payment innerHTML Erase the content of these elements total innerHTML totalinterest innerHTML chart() With no arguments, clears the chart Save the user's input as properties of the localStorage object Those properties will still be there when the user visits in the future function save(amount, apr, years, zipcode) if (window localStorage) Only do this if the browser supports it localStorage loan amount amount localStorage loan apr apr localStorage loan years years localStorage loan zipcode zipcode Automatically attempt to restore input fields when the document first loads window onload function() If the browser supports localStorage and we have some stored data if (window localStorage localStorage loan amount) document getElementById( amount ) value localStorage loan amount document getElementById( apr ) value localStorage loan apr document getElementById( years ) value localStorage loan years document getElementById( zipcode ) value localStorage loan zipcode Chart monthly loan balance, interest and equity in an HTML element If called with no arguments then just erase any previously drawn chart function chart(principal, interest, monthly, payments) var graph document getElementById( graph ) Get the tag graph width graph width Magic to clear and reset the canvas element If we're called with no arguments, or if this browser does not support graphics in a element, then just return now if (arguments length 0 graph getContext) return Get the context object for the that defines the drawing API var g graph getContext( 2d ) All drawing is done with this object var width graph width, height graph height Get canvas size These functions convert payment numbers and dollar amounts to pixels function paymentToX(n) return n width payments function amountToY(a) return height (a height (monthly payments 1 05)) Payments are a straight line from (0,0) to (payments, monthly payments) g moveTo(paymentToX(0), amountToY(0)) Start at lower left g lineTo(paymentToX(payments), Draw to upper right amountToY(monthly payments)) g lineTo(paymentToX(payments), amountToY(0)) Down to lower right g closePath() And back to start g fillStyle f88 Light red g fill() Fill the triangle g font bold 12px sans serif Define a font g fillText( Total Interest Payments , 20,20) Draw text in legend Cumulative equity is non linear and trickier to chart var equity 0 g beginPath() Begin a new shape g moveTo(paymentToX(0), amountToY(0)) starting at lower left for(var p 1 p

The Answer is in the image, click to view ...

Answered step by step

Verified Expert Solution

Link Copied!

Question

1 Approved Answer

Posted on Sep 22, 2024

using JS

Modify this program so that the annual interest rate is not based on users input, but based on users credit score. Below is the logic:

Credit Score

< 400

>=400

< 500

>=500

< 600

>=600

< 700

>=700

< 800

>=800

Interest Rate

10.0

8.0

6.0

4.0

3.5

3.0

JavaScript Loan Calculator

Enter Loan Data:		Loan Balance, Cumulative Equity, and Interest Payments
Amount of the loan ($):
Credit Score:
Repayment period (years):
Zipcode (to find lenders):
Approximate Payments:
Monthly payment:	$
Total payment:	$
Total interest:	$

JavaScript Loan Calculator

Enter Loan Data:		Loan Balance, Cumulative Equity, and Interest Payments
Amount of the loan ($):
Credit Score:
Repayment period (years):
Zipcode (to find lenders):
Approximate Payments:
Monthly payment:	$
Total payment:	$
Total interest:	$