Anda di halaman 1dari 2

untuk membuat kurva hati menggunakan persamaan matematika (𝑥^2+ 𝑦^2−1)^3−𝑥^2 𝑦^3=0, kita

dapat menggunakan HTML Canvas dan JavaScript.

Pertama-tama, tambahkan elemen canvas ke dalam dokumen HTML, dan beri id "myCanvas":

<canvas id="myCanvas" width="500" height="500"></canvas>

Kemudian, dalam script JavaScript, inisialisasikan canvas dan konteksnya dengan cara berikut:

const canvas = document.getElementById("myCanvas");

const ctx = canvas.getContext("2d");

Selanjutnya, kita dapat menggunakan loop untuk menggambar titik-titik pada canvas dan
menghitung nilai persamaan lingkaran pada setiap titik. Jika nilai persamaan mendekati 0, gambar
titik tersebut sebagai bagian dari kurva hati.

Berikut adalah script lengkap untuk membuat kurva hati menggunakan persamaan matematika
(𝑥^2+ 𝑦^2−1)^3−𝑥^2 𝑦^3=0:

const canvas = document.getElementById("myCanvas");

Mendapatkan elemen HTML dengan id "myCanvas" yang nantinya akan digunakan sebagai objek
canvas.

const ctx = canvas.getContext("2d");

Mendapatkan context 2D pada objek canvas yang telah didefinisikan sebelumnya.

for (let x = -2; x <= 2; x += 0.01) {

Melakukan perulangan pada nilai x dengan menginisialisasikan x sebagai -2 dan melakukan


penambahan nilai x sebesar 0.01 hingga mencapai nilai 2.

for (let y = -2; y <= 2; y += 0.01) {

Melakukan perulangan pada nilai y dengan menginisialisasikan y sebagai -2 dan melakukan


penambahan nilai y sebesar 0.01 hingga mencapai nilai 2.
const result = Math.pow(Math.pow(x, 2) + Math.pow(y, 2) - 1, 3) - Math.pow(x, 2) * Math.pow(y, 3);

Menghitung nilai persamaan lingkaran berdasarkan nilai x dan y pada setiap iterasi.

if (Math.abs(result) < 0.01) {

Jika nilai hasil persamaan lingkaran mendekati 0, maka dilakukan penggambaran titik pada koordinat
x dan y.

ctx.beginPath();

Memulai path baru untuk digambar pada canvas.

ctx.arc((x + 2) * 100, (2 - y) * 100, 2, 0, 2 * Math.PI);

Menggambar lingkaran pada koordinat (x + 2) * 100 dan (2 - y) * 100 dengan radius 2.

ctx.fillStyle = "black";

Mengatur warna isi untuk menggambar lingkaran dengan warna hitam.

ctx.fill();

Menggambar isi dari lingkaran pada koordinat yang telah ditentukan sebelumnya.

Dalam script ini, saya menggunakan loop for untuk menggambar titik-titik pada canvas. Loop ini
berjalan sebanyak empat kali, dari -2 hingga 2 dengan inkrementasi 0,01. Ini berarti setiap titik pada
kurva hati akan digambar menggunakan 10.000 titik.

Saya menghitung nilai persamaan lingkaran pada setiap titik menggunakan persamaan matematika
(𝑥^2+ 𝑦^2−1)^3−𝑥^2 𝑦^3=0. Jika hasil persamaan mendekati 0, itu berarti titik tersebut berada di
dalam kurva hati dan harus digambar.

Terakhir, kita gambar setiap titik dengan menggunakan fungsi arc() pada konteks canvas. Setiap titik
digambar sebagai lingkaran kecil dengan diameter 2 piksel dan warna merah.

Dengan demikian, kurva hati dapat dibuat menggunakan HTML Canvas dan persamaan matematika
(𝑥^2+ 𝑦^2−1)^3−𝑥^2 𝑦^3=0.

Anda mungkin juga menyukai