Metode Numerik dengan metode Biseksi dan codingannya dengan javascript

Salah satu metode numerik sederhana untuk pencarian akar persamaan yang telah
banyak dikenal adalah Metode Bagi-Dua (Bisection)

Algoritma Metode Bagi-Dua (Biseksi):
- Masukan : f (x) , a, b dan epsilon (nilai toleransi)
- Keluaran : akar

Langkah-langkah :

1. Periksa apakah f (a). f(b) < 0 , jika tidak pilih a dan b yang baru sehingga f (a). f (b) < 0

2. Hitung:
c = (a + b)/2

3.
i. Jika f (a). f(c) < 0 maka b = c, lanjutkan ke langkah 4
ii. Jika f (a). f(c) > 0 maka a = c, lanjutkan ke langkah ke langkah 4
iii. Jika f (a). f(c) = 0 maka akar persamaan adalah c, hitungan selesai

4. Hitung pada baris baru dengan perkiraan baru dari akar sesuai ketentuan batas bawah (a) dan batas atas (b) dari syarat pada langkah 3.

5. Jika abs|b−a| ≤ epsilon maka akar persamaan = c dan hitungan selesai. Sebaliknya, jika lebih besar dari nilai toleransi maka ulangi langkah 4.

Dari langkah-langkah tersebut didapatkan bahwa ada dua syarat untuk mendapatkan akar persamaan dari metode tertutup ini yaitu Jika  f (a). f(c) = 0 atau abs|b−a| ≤ epsilon . Oleh karena itu, kami mencoba untuk membuat codingan sederhana dengan bahasa pemrograman Javascript agar bisa langsung digunakan di halaman ini juga

 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
 <div>
  <h3 style="text-align:center;">Perhitungan Biseksi / Bagi Dua</h3>
 </div>
 <div>
    <table>
     <colgroup style="width:50%;"></colgroup>
     <colgroup style="width:50%;"></colgroup>
     <tr>
      <td>
       <label>Fungsi</label>
      </td>
      <td>
       <input id="fungsi" placeholder="(x*x)-(2*x)" />
      </td>
     </tr>
     <tr>
      <td>
       <label>a</label>
      </td>
      <td>
       <input id="selang1" placeholder="-1" />
      </td>
     </tr>
     <tr>
      <td>
       <label>b</label>
      </td>
      <td>
       <input id="selang2" placeholder="2" />
      </td>
     </tr>
     <tr>
      <td>
       <label>Limit</label>      
      </td>
      <td>
       <input id="limit" placeholder="0.01" />
      </td>
     </tr>
     <tr>
      <td colspan="2">
       <button id="calculate">Submit</button>
      </td>
     </tr>
    </table>
 </div>
 <div id="result"></div>
 <script type="text/javascript">
 function calcFn(fx, x) {
  var e = 2.71;
  var math = Math;
  var evaluated = eval(fx);
  var calcFx =  evaluated;
  return calcFx;
 };
 function cariSelang(fa,fb,fc) {
  if (fa*fc<0) {
   var selangBaru = "[a, c]<br/>c->b";
  } else {
   var selangBaru = "[c, b]<br/>c->a";
  }
  return selangBaru;
 };
 function cariLebar(a, b, c, fa,fb,fc) {
  if (fa*fc<0) {
   var Lebar = c - b;
  } else {
   var Lebar = c - a;
  }
  return Lebar;
 };
 jQuery('#calculate').click(function(){
  var no = 1;
  var a = eval($('#selang1').val());
  var b = eval($('#selang2').val());
  var c = (a+b)/2;
  var fx = $('#fungsi').val();
  var lim = $('#limit').val();
  var fa = calcFn(fx, a);
  var fb = calcFn(fx, b);
  var fc = calcFn(fx, c);
  var Selang = cariSelang(fa,fb,fc);
  var Lebar = cariLebar(a,b,c,fa,fb,fc);
  if (fa*fb>0) {
   document.getElementById("result").innerHTML = "<div><h3 style='text-align:center;'>f(a)*f(b)>0, proses dihentikan karena tidak ada akar!!!</h3></div>";
  } else {
  var result1 = "<div><h3 style='text-align:center;'>Tabel Perhitungan</h3></div>" +
   "<div>" +
   "<table style='width: max-content;'>" +
    "<tr>" +
     "<th>i</th>" +
     "<th>a</th>" +
     "<th>b</th>" +
     "<th>c</th>" +
     "<th>f(a)</th>" +
     "<th>f(b)</th>" +
     "<th>f(c)</th>" +
     "<th style='color: red;'>Selang <br/>Baru</th>" +
     "<th style='color: red;'>Lebar <br/>abs(b-a)</th>" +
    "</tr>";
  var result2 = "";
  //for(i = Lebar; i > lim; i=Lebar) {
  while(Math.abs(b-a)>lim) {
   result2 += "<tr>" +
     "<td>" + no + "</td>" +
     "<td>" + a + "</td>" +
     "<td>" + b + "</td>" +
     "<td><b>" + c + "</b></td>" +
     "<td>" + fa + "</td>" +
     "<td>" + fb + "</td>" +
     "<td>" + fc + "</td>";     
   if ((fa*fc == 0) || (Math.abs(Lebar) < lim)) {
    result2 +=  "<td style='color: red;'><b>selesai</b></td>" +
       "<td style='color: red;'>" + Lebar + "</td>" +
      "</tr>";
    break;
   } else {
    result2 +=  "<td style='color: red;'><b>" + Selang + "</b></td>" +
       "<td style='color: red;'>" + Lebar + "</td>" +
      "</tr>";
   }
   if (fa*fc<0) {
    var a = eval(a);
    var b = eval(c);
   } else {
    var a = eval(c);
    var b = eval(b);
   }
   no++;
   var c = (a+b)/2;
   var fa = calcFn(fx, a);
   var fb = calcFn(fx, b);
   var fc = calcFn(fx, c);
   var Selang = cariSelang(fa,fb,fc);
   var Lebar = cariLebar(a,b,c,fa,fb,fc);
   
  };
   var result3 = "</table></div>" +
    "<span>Akar persamaan dari f(x) = " + fx + " adalah <br/><b>" + c + "</b><br/> dengan nilai f(x) = <b>" + fc + "</b> dan total iterasi = " + no + "</span><br/>" +
    "Note: <span style='color: red;'>Warna merah hanya informasi saja untuk interval selanjutnya</span></div>" +
    "<footer style='background-color:#000;color:#fff;margin-top:30px;padding:10px 0px;'><div><span>Designed by: Web IoT</span></footer>";
  document.getElementById("result").innerHTML = result1 + result2 + result3;
  }
 });
 </script>
 

Berikut tampilannya:

Perhitungan Biseksi / Bagi Dua

Fungsi
a
b
Limit

Untuk melihat hasil grafik agar lebih berwarna silahkan kunjungi https://ahmadroihan.ilearning.me/metode-numerik/