Academic Integrity: tutoring, explanations, and feedback — we don’t complete graded work or submit on a student’s behalf.

Project Using JavaScript to interact with a user and the Function Calls 125 mark

ID: 3811969 • Letter: P

Question

Project Using JavaScript to interact with a user and the Function Calls 125 mark 4 Using a pl ain test editor (example: Backets or Notepad or Brackets.create a web page that contains JavaScript code by typing in the ITML tags and JavaScript commands as showninthe lecture notes. You will ask the user if they wish to draw the Mandelbrot Set lfthey do you must prompt for the number ofiterations how fine of detail they want Then you will render the Mandelbror set on your webpage. lfthey emeravalue less than 100, or greater than 5,000or decline, you will displaythe factthe user declined on totho webpage The rendered webpage must look like this You MUST use these words and spacingl Header This is a computer rendering orthe Mandelbrot set. Mandelbrot set Author DYourNam Required Text Replace with your actual Everything above and below the horizontal lines are plain HTMLcode. Everything between the two lines is J The JavaScript for the Mandelbro Serisina supplied file named Mandelbrot js You must setup the connection inside your webpage to this file sotheinkladed function can be called from your JavaScript code Ido NOT copy the code in to your webpagel The function is: 450, 300 Num terations

Explanation / Answer

Since you have given the image of your code, I could not copy it.

Please find the working solution to your problem below.

<!DOCTYPE html>
<html>
<head>
   <title>Javascript Project 2</title>
</head>
<body >
       <h5>This is computer rendering of Mandelbrot Set</h5>
       <hr>
       <p id="demo"></p>
       <br>      
       <canvas id="myCanvas" width="500" height="500"></canvas>
  
       <hr>
<p id="countOfIteratns"></p>
       <p id="authorName"> </p>
      
<script>
           var numOfIterations;
           window.onload = function () {
               if (confirm('Do you wish to draw Mandelbrot Set ?')) {
                  
                   numOfIterations = prompt("How many iterations you want [100-5000] ?");
                   if (numOfIterations < 100 || numOfIterations > 5000){
                       document.getElementById("demo").innerHTML = "You have declined to draw Mandelbrot Set";
                       return;
                   }
                                      
               } else {
                   document.getElementById("demo").innerHTML = "You have declined to draw Mandelbrot Set";
                   return;
               }
              
               var x,y,i,xt;
               var cx,cy;
               var color;
               var canvas = document.getElementById('myCanvas');
               var context = canvas.getContext('2d');

               for(x=0;x<numOfIterations;x++)
               {
                       for(y=0;y<numOfIterations;y++)
                       {
                               i=0;
                               cx=-2+x/50;
                               cy=-2+y/50;
                               zx=0;
                               zy=0;

                               do
                               {
                                       xt=zx*zy;
                                       zx=zx*zx-zy*zy+cx;
                                       zy=2*xt+cy;
                                       i++;
                               }
                               while(i<255&&(zx*zx+zy*zy)<4);

                               color=i.toString(16);
                               context.beginPath();
                               context.rect(x*4, y*4, 4, 4);
                               context.fillStyle ='#'+color+color+color;
                               context.fill();
                       }
               }              
               document.getElementById("countOfIteratns").innerHTML = "Mandelbrot Set using: " + numOfIterations;
               document.getElementById("authorName").innerHTML = "Author [Name]";              
           }          
</script>
</body>
</html>