Halo sobat webbiz, kali ini kita akan share kakulator Jarak Titik (kordinat) sekaligus source code yang bisa teman-teman gunakan untuk bahan pembelajaran.
Kalkulator Jarak Titik (Koordinat)
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Kalkulator Jarak Titik</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<style>
body {
margin: 20px;
}
.container {
width: 500px;
background-color: white;
padding: 20px;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
</style>
</head>
<body>
<div class="container">
<h1>Kalkulator Jarak Titik (Koordinat)</h1>
<div class="form-group">
<label for="dimensi">Pilih Dimensi:</label>
<select class="form-control" id="dimensi" onchange="updateInputFields()">
<option value="2">2 Dimensi</option>
<option value="3">3 Dimensi</option>
</select>
</div>
<div id="inputFields">
<div class="form-group">
<label for="x1">Koordinat Titik 1 (X1):</label>
<input type="number" class="form-control" id="x1">
</div>
<div class="form-group">
<label for="y1">Koordinat Titik 1 (Y1):</label>
<input type="number" class="form-control" id="y1">
</div>
<div class="form-group">
<label for="x2">Koordinat Titik 2 (X2):</label>
<input type="number" class="form-control" id="x2">
</div>
<div class="form-group">
<label for="y2">Koordinat Titik 2 (Y2):</label>
<input type="number" class="form-control" id="y2">
</div>
</div>
<div class="form-group" id="zFields" style="display: none;">
<label for="z1">Koordinat Titik 1 (Z1):</label>
<input type="number" class="form-control" id="z1">
<label for="z2">Koordinat Titik 2 (Z2):</label>
<input type="number" class="form-control" id="z2">
</div>
<button class="btn btn-primary" onclick="hitungJarak()">Hitung Jarak</button>
<h3 class="mt-3" id="hasil"></h3>
</div>
<script>
function updateInputFields() {
const dimensi = document.getElementById('dimensi').value;
const zFields = document.getElementById('zFields');
if (dimensi === '3') {
zFields.style.display = 'block';
} else {
zFields.style.display = 'none';
}
}
function hitungJarak() {
const x1 = parseFloat(document.getElementById('x1').value);
const y1 = parseFloat(document.getElementById('y1').value);
const x2 = parseFloat(document.getElementById('x2').value);
const y2 = parseFloat(document.getElementById('y2').value);
let jarak;
if (document.getElementById('dimensi').value === '2') {
jarak = Math.sqrt(Math.pow(x2 - x1, 2) + Math.pow(y2 - y1, 2));
} else {
const z1 = parseFloat(document.getElementById('z1').value);
const z2 = parseFloat(document.getElementById('z2').value);
jarak = Math.sqrt(Math.pow(x2 - x1, 2) + Math.pow(y2 - y1, 2) + Math.pow(z2 - z1, 2));
}
document.getElementById('hasil').innerText = 'Jarak: ' + jarak.toFixed(2);
}
</script>
</body>
</html>Ruang 2 Dimensi
Untuk menghitung jarak antara dua titik dalam ruang 2 dimensi dengan koordinat (x1,y1) dan (x2,y2), kita bisa menggunakan Rumus Jarak Euclidean:
di mana:
- d adalah jarak antara kedua titik.
- (x1,y1) adalah koordinat titik pertama.
- (x2,y2) adalah koordinat titik kedua.
Cara Kerja Rumus
- Hitung selisih antara koordinat x kedua titik: x2−x1.
- Hitung selisih antara koordinat y kedua titik: y2−y1.
- Kuadratkan masing-masing selisih, tambahkan hasilnya, dan ambil akar kuadrat dari jumlah tersebut.
Contoh
Jika kita memiliki dua titik:
- Titik A: (x1,y1)=(3,4)
- Titik B: (x2,y2)=(7,1)
Maka:
Hasilnya, jarak antara titik A dan titik B adalah 5 satuan.
Ruang 3 Dimensi
Untuk menghitung jarak antara dua titik dalam ruang 3 dimensi dengan koordinat (x1,y1,z1) dan (x2,y2,z2), kita dapat menggunakan Rumus Jarak Euclidean 3D:
di mana:
- ddd adalah jarak antara kedua titik.
- (x1,y1,z1) adalah koordinat titik pertama.
- (x2,y2,z2) adalah koordinat titik kedua.
Cara Kerja Rumus
- Hitung selisih koordinat x, y, dan z antara kedua titik:
- x2−x1
- y2−y1
- z2−z1
- Kuadratkan masing-masing selisih, kemudian tambahkan hasil-hasil kuadratnya.
- Ambil akar kuadrat dari jumlah tersebut untuk mendapatkan jarak.
Contoh
Jika kita memiliki dua titik:
- Titik A: (x1,y1,z1)=(1,2,3)
- Titik B: (x2,y2,z2)=(4,6,8)
Maka:
Jadi, jarak antara titik A dan titik B adalah sekitar 7.07 satuan