Menghitung Nilai Pi dengan Pixel di HTML5 Canvas

Oleh -

Salah satu metode yang dapat dilakukan untuk menghitung nilai pi (π) adalah dengan menggunakan dot atau pixel.

Konsep ini mengacu pada persamaan matematis untuk menghitung luas lingkaran:

Area=πR2

Dengan mengasumsikan pixel yang berada pada posisi lebih kecil dengan jari-jari lingkaran, sebagai nilai dari Area, maka dengan membaginya dengan nilai jari-jari yang dikuadratkan, maka akan didapatkan nilai pi.

π=Area/R2

Kode di bawah ini adalah contoh perhitungan nilai pi dengan ide pixel yang berada lebih kurang dari nilai R (jari-jari lingkaran) sebagai penambah nilai Area: 

<html> 
<head> 
<title>Cari Nilai Pi</title> 
</head> 
<body> 
<div id="hasil" style="padding-left:200px;"></div> 
<canvas id="myCanvas" width="800" height="600"> 
</canvas> 
<script> 

var canvas = document.getElementById("myCanvas"); 
var ctx = canvas.getContext("2d"); 
 
var R=300; 
 
ctx.strokeStyle="black"; 
ctx.lineWidth=5; 
ctx.beginPath(); 
ctx.arc(400,300,R, 0, 2 * Math.PI); 
ctx.stroke(); 
ctx.closePath(); 
 
var Area=0,d=100; 
 
var x=[],y=[]; 
for(i=0;i<d;i++){ 
 x[i]=-R-i*5; 
 y[i]=-R+i; 
} 

function Menggambar() 
{ 
 for(i=0;i<d;i++){ 
  var r=Math.sqrt(x[i]*x[i]+y[i]*y[i]); 
  if(r<R){ 
   ctx.fillStyle="red"; 
   Area++; 
   var pi=Area/(R*R); 
   document.getElementById("hasil").innerHTML="π = "+pi; 
  }else ctx.fillStyle="green"; 

  if(x[i]>=-R && y[i]>=-R && x[i]<=R && y[i]<=R){ 
   ctx.beginPath(); 
   ctx.fillRect(0.5*canvas.width+x[i],0.5*canvas.height+y[i],2,2); 
   ctx.closePath(); 
  } 

  x[i]++; 
  if(x[i]==R){ 
   x[i]=-R; 
   y[i]+=d; 
  } 
 } 
 if(x[d-1]<=R && y[d-1]<=R)window.requestAnimationFrame(Menggambar); 
} 
 
Menggambar(); 
</script> 
</body> 
</html>

Komentar

Posting Komentar



Postingan populer dari blog ini

Apps Script untuk Cetak Sertifikat

Oleh -
Gambar
Tutorial pembuatan sertifikat menggunakan Google Docs, Sheets dan Apps Script teleh penulias buat dalam video di bawah ini: Sedangkan berikut ini adalah kode Apps Script yang penulis gunakan di dalam tutorial di atas: function onOpen() { const ui = SpreadsheetApp.getUi(); const menu = ui.createMenu("Cetak Sertifikat"); menu.addItem("Cetak Sertifikat", "generateMode"); menu.addToUi(); } function generateMode() { var idtemplate="1qseLMkdYIzmx0rhkKELF0xxlsD13CS1eCk0MlcTKt_g"; var idtarget="1ZLNksdiilEc0mQ88WOfAuU8_JcMVcO6ewXuJes-UU9I"; var ss = SpreadsheetApp.openById("1j1TArXYzRlVGvB9q7ly7NdyF-nsJcCH6RT3rOQik0yQ"); var so=ss.getSheetByName("Source"); var data=so.getRange("A1:C").getValues().map(function(row){return (row[0]!="")?row:null}).filter(function(cellData){return cellData != null;}); const docTemplate=DocumentApp.openById(idtemplate); var docTarget=DocumentApp.open...
Baca selengkapnya

Jalan-jalan ke Taman Nasional Baluran

Oleh -
Gambar
Berikut ini adalah pengalaman penulis bersepeda motor ke Taman Nasional Baluran. Yang berada di Jalan Raya Situbondo Banyuwangi km 35, Banyuputih, Situbondo, Jawa Timur. Pada tanggal 17 Februari 2018. Profile Taman Taman Baluran merupakan salah satu dari lima taman tertua Indonesia yang memiliki luas sekitar 25.000 hektar. Taman ini memiliki berbagai macam flora dan fauna. Dengan 444 spesies flora, termasuk 265 macam tanaman obat.  Untuk fauna, Taman baluran memiliki 2 macam primata yaitu long tail macaca dan black monkey, 233 spesies burung, kerbau, banteng, rusa, terumbu karang, ikan dan lain sebagainya. Sedangkan untuk object wisata sendiri, Taman Baluran memiliki Gua Jepang, padang Savanna Bekol, dan pantai Bama. Selain sebagai tempat rekreasi, taman ini cocok juga digunakan sebagai tempat untuk penelitian kalangan akademisi seperti mahasiswa, dosen, atau pihak peneliti lainnya. Dan dapat juga digunakan sebagai tempat pengambilan foto pre-wedding, s...
Baca selengkapnya

Kumpulan Source Code Greenfoot

Oleh -
Gambar
Overview Greenfoot adalah aplikasi berbasis Java yang cocok untuk pemula yang sedang belajar OOP Java. Dukungan image processing 2D dapat menjadi satu daya tarik utama penggunaan aplikasi ini. Sehingga selain gratis, dengan Greenfoot anda akan dapat belajar membuat algorithma pembuatan game, terutama yang berbasis game 2D. Greenfoot Sourcecode Collection adalah kumpulan source code Greenfoot yang terdiri dari 36 skenario. Beberapa scenario menunjukkan tentang bagaimana cara memvisualisasikan contoh-contoh bidang kefisikaan, seperti revolusi bulan, gravitasi, pendulum dan sebagainya. Selain itu beberapa contoh juga mengambil tujuan bagaimana cara membuat animasi 2D dengan lebih banyak menulis program, dibanding pengolahan gambar menggunakan software image processing seperti Corel Draw atau Photoshop. Dengan mempelajari source code ini diharapkan anda dapat menguasai dasar bagaimana melakukan atau menerapkan algorithma dalam bentuk kode program untuk pembuatan game 2D ...
Baca selengkapnya

Menghapus Baris di Google Sheets yang Memiliki Sel Kosong dengan Apps Script

Oleh -
Gambar
Pastinya, input data yang dilakukan oleh pengguna, terdapat data yang kosong pada salah satu sel-nya. Hal ini biasanya karena salah input, atau memang sengaja di-input-kan oleh pengguna. Untuk mengurangi proses pengolahan, dapat dilakukan penghapusan data tersebut, dengan Apps Script yang dapat di download dengan kode seperti di bawah ini: Kode function deleteKosong() { var target = SpreadsheetApp.openById("--id Google Sheets file--"); var ss=target.getSheetByName("Data"); var data=ss.getRange("A2:G").getValues().map(function(row,index){return (row[0]!="" && row[3]=="")?index:null;}).filter(function(cellData){return cellData != null;}); for(var i=data.length-1;i>=0;i--){ ss.deleteRow(2+data[i]); } } Demo
Baca selengkapnya

Pengalaman Full Approved Google Adsense

Oleh -
Gambar
Setelah hampir 2 tahun lebih, akhirnya pada tanggal 2 November 2017, datang email dari Google Adsense yang menyatakan bahwa website penulis telah diterima secara penuh (full approved) seperti gambar dibawah ini: Email tersebut datang, setelah berulang kali penulis melalukan pendaftaran website dan juga melalui blog. Bagi pembaca yang belum mengetahui cara pendaftaran website tersebut adalah pendaftaran melalui menu Google Adsense->My Ads->Other Product, dan dengan memasukkan alamat website pada textfield yang disediakan. Cara ini tidak ketika ditolak penulis langsung mengirimkan ulang pengajuan, namun penulis juga memperbaiki dulu tampilan web sebelum diajukan kembali. Awal Mula Penulis telah mencoba program afiliasi Adsense semenjak tahun 2014. Saat itu penulis membuat blog, dengan content tulisan yang terkait dengan penelitian penulis. Namun karena kesibukan pekerjaan penulis saat itu, hasilnya penulis hanya dapat menelorkan beberapa tulisan saja. Dan dengan topik ...
Baca selengkapnya

Kaidah Baku untuk Konsistensi Data (PT, Tbk, Pty., & Ltd.)

Oleh -
Sebagai database engineer, penulis sempat kaget ketika mendapati banyaknya data masuk, khususnya dari mahasiswa yang mengajukan nama instansi, yang secara berulang kali menulis PT tanpa menggunakan tanda titik, untuk pengajuan suratnya. Penulis yang terbiasa dengan pemahaman lama (EYD) bahwa 'PT' harus ditulis 'PT.' akhirnya mencoba memeriksa ulang. Setelah penulis check dan berdiskusi ke salah satu AI, ternyata memang terdapat pembaharuan dan penulisan tanpa titik adalah kaidah baku modern. Konsistensi ini krusial untuk integritas database.  Konflik Aturan Bahasa dan Kebutuhan Sistem Pertama banyak yang sudah terbiasa (termasuk penulis) menambahkan titik setelah singkatan seperti 'PT.' karena dahulu aturan Ejaan Yang Disempurnakan (EYD) mengamanatkan titik pada singkatan tertentu. Namun, untuk menjaga  integritas data  dan  standardisasi  dalam sistem informasi dan dokumen hukum, kita harus berpegangan pada kaidah penulisan nama entitas yang resmi. 1. Penulisan...
Baca selengkapnya

Menyikapi Ucapan AI Pejabat

Oleh -
Beberapa tahun belakangan, ketika tulisan ini ditulis, topik Kecerdasan Buatan (AI) memang sedang naik daun di Indonesia. Dari obrolan rekan kerja, hingga diskusi di ruang rapat, AI menjadi perbincangan hangat. Bahkan, tidak ketinggalan, para pejabat publik pun semakin sering melontarkan wacana seputar teknologi canggih ini. Fenomena ini tentu menarik untuk disimak. Di satu sisi, kita patut mengapresiasi bahwa AI, dengan segala potensinya, memang layak mendapatkan perhatian serius dari pemerintah. Yang konon katanya, AI digadang-gadang mampu mendongkrak pertumbuhan ekonomi, meningkatkan efisiensi, dan bahkan menciptakan inovasi di berbagai sektor. Padahal kalau kita telaah lagi, di sisi lain, AI justru akan berpotensi mengambil banyak lapangan pekerjaan. Lalu apakah kita harus terpukau dengan jargon-jargon AI yang dilontarkan, terutama oleh pejabat? Pemahaman Ketertarikan para pejabat terhadap AI bisa jadi hanya merupakan respon terhadap tren global atau bahkan upaya untuk menunjukkan ...
Baca selengkapnya

Jasa Penjadwalan Semester, UTS dan UAS Perguruan Tinggi menggunakan Google Sheet

Oleh -
Gambar
  I. Pendahuluan Sebagai tenaga administrasi di perguruan tinggi, pengelolaan jadwal semester yang efektif adalah kunci untuk memastikan bahwa proses akademik berjalan lancar dan efisien. Dengan banyaknya mata kuliah, dosen, mahasiswa dan ruang yang harus diatur, yang berpatokan pada pohon kurikulum, akan membutuhkan ketelitian yang tinggi dalam mengatur jadwal, agar masing-masing variabel tidak saling tumpang tindih. Dengan menggunakan tool yang tepat, pengelolaan jadwal akan lebih efisien dan dapat meningkatkan produktivitas bagi semua Sumber Daya Manusia (SDM) yang terlibat. Oleh karena itu, dalam tulisan ini penulis menawarkan jasa penjadwalan semester perguruan tinggi menggunakan Google Sheet, sebuah tool yang mudah digunakan dan dapat diakses dari mana saja. Dengan menggunakan jasa penjadwalan ini, penulis berharap perencanaan jadwal perguruan tinggi dapat dilakukan lebih cepat dan efektif. II. Kelebihan Berikut ini kelebihan penggunaan Google Sheet sebagai aplikasi penjadwal...
Baca selengkapnya

Menambahkan Konfirmasi Email di Google Form

Oleh -
Gambar
Suatu hari penulis membantu dosen penulis menyiapkan form registrasi Pengabdian Kepada Masyarakat (PKM). Dan ternyata kebutuhannya adalah ketika seorang pendaftar melakukan registrasi dengan input data, dibutuhkan konfirmasi email yang terkirim secara otomatis. Setelah berselancar di internet, penulis menemukan salah satu caranya adalah dengan menggunakan Google Sheets dan Script. Caranya penulis tunjukkan dalam video di bawah ini: Sedangkan Google Script yang penulis gunakan dalam video di atas, dapat di download dilink di bawah ini: https://drive.google.com/file/d/1elg78BQFaKlhq9e0UuGmHhY0NS3BtfEp/view?usp=sharing Referensi: aniav. 2015. send_email.gs. https://gist.github.com/aniav/926f4667911ba1d138b8. Diakses tanggal 17 Juni 2020.
Baca selengkapnya

Bingung Membedakan Petugas atau Calo

Oleh -
Gambar
Ada yang lucu, ketika penulis melakukan permohonan perbaikan data KTP Agustus 2019. Di Mall Pelayanan Publik Banyuwangi, di tempat pengambilan Surat Keterangan Pengganti KTP, Loket Pengambilan, tampak ada seorang Bapak-bapak berpakaian serba hitam, yang berada di depan anak-anak tingkat SMA yang sedang Praktek Pengalaman Lapangan (PPL). Penulis bingung, apakah orang tersebut petugas atau tidak? Namun melihat cara berpakaiannya, penulis tentu saja berprasangka-buruk kepada Bapak-bapak tersebut, dan mencurigainya sebagai calo. Pertama, dengan memakai kaos. Meskipun berkerah, penulis rasa hari itu yang hari Selasa, 13 Agustus 2019 dan dalam waktu sekitar jam 10 pagi, setiap petugas harusnya memakai seragam. Kedua, beliau tidak memakai name-tag, sehingga semakin membuat penulis curiga, bahwa beliau pasti bukan petugas. Apalagi ketiga, beliau memakai topi. Penulis yakin, jika dia memang petugas, seharusnya beliau tahu bahwa ada aturan kesopanan untuk tidak memakai topi dala...
Baca selengkapnya