Uzunluk Ölçüleri Dönüştürücü
| Birim | Sembol | Değer |
|---|
Günlük hayatta, mühendislik projelerinde veya akademik çalışmalarda farklı uzunluk birimleri arasında hızlıca geçiş yapma ihtiyacı duyabilirsiniz. Uzunluk ölçüleri dönüştürme aracımız; metrik sistemin temel taşları olan metre, kilometre, santimetre ve milimetrenin yanı sıra endüstriyel standartlarda sıkça kullanılan inç, ayak (feet) ve yarda gibi İngiliz/Amerikan birimlerini de anlık olarak birbirine çevirir.
Bilimsel aramalar ve büyük ölçekli hesaplamalar için mikrometre, nanometre ve ışık yılı gibi gelişmiş birimleri de içeren bu dönüştürücü, okumayı kolaylaştıran binlik ayraç mimarisi ve projelere tam uyum sağlayan üstlü sayı gösterimleriyle (10⁻⁴ formatında) en hassas sonuçları verir. Tamamen duyarlı (responsive) yapısı sayesinde hem mobil cihazlarda hem de masaüstü bilgisayarlarda, sitenizin gece veya gündüz modu temasına bozmadan doğal bir şekilde uyum sağlayarak çalışır.
HTML KODU
<div class="birim-cevirici-konteyner">
<h2>Uzunluk Ölçüleri Dönüştürücü</h2>
<div class="girdi-alani">
<div class="girdi-grup">
<label for="uzunlukDeger">Değer</label>
<input type="number" id="uzunlukDeger" value="1" step="any">
</div>
<div class="girdi-grup">
<label for="kaynakBirim">Kaynak Birim</label>
<select id="kaynakBirim">
<option value="m" selected>Metre (m)</option>
<option value="km">Kilometre (km)</option>
<option value="cm">Santimetre (cm)</option>
<option value="mm">Milimetre (mm)</option>
<option value="dm">Desimetre (dm)</option>
<option value="um">Mikrometre (µm)</option>
<option value="nm">Nanometre (nm)</option>
<option value="in">İnç (in)</option>
<option value="ft">Ayak / Feet (ft)</option>
<option value="yd">Yarda (Yd)</option>
<option value="mi">Kara Mili (mi)</option>
<option value="nmi">Deniz Mili (nmi)</option>
<option value="ly">Işık Yılı (ly)</option>
</select>
</div>
</div>
<table class="sonuc-tablosu">
<thead>
<tr>
<th>Birim</th>
<th>Sembol</th>
<th>Değer</th>
</tr>
</thead>
<tbody id="sonucGövde">
<!-- Sonuçlar JS ile buraya dolacak -->
</tbody>
</table>
<!-- Kaynak Link Alanı -->
<div style="margin-top: 15px; font-size: 0.75rem; opacity: 0.5; text-align: right;">
Araç Sağlayıcı: <a href="https://bilgincin.com" target="_blank" style="color: inherit; text-decoration: underline;">bilgincin.com</a>
</div>
</div>
<style>
.birim-cevirici-konteyner {
font-family: inherit;
max-width: 100%;
margin: 20px 0;
padding: 15px;
border: 1px solid rgba(128, 128, 128, 0.2);
border-radius: 8px;
background: transparent;
}
.birim-cevirici-konteyner h2 {
margin-top: 0;
margin-bottom: 20px;
font-size: 1.5rem;
}
.girdi-alani {
display: flex;
gap: 15px;
margin-bottom: 25px;
flex-wrap: wrap;
}
.girdi-grup {
flex: 1;
min-width: 200px;
display: flex;
flex-direction: column;
}
.girdi-grup label {
font-weight: bold;
margin-bottom: 5px;
font-size: 0.9rem;
}
.girdi-grup input, .girdi-grup select {
padding: 10px;
font-size: 1rem;
border: 1px solid rgba(128, 128, 128, 0.4);
border-radius: 4px;
background: transparent;
color: inherit;
outline: none;
}
.girdi-grup input:focus, .girdi-grup select:focus {
border-color: rgba(128, 128, 128, 0.8);
}
.sonuc-tablosu {
width: 100%;
border-collapse: collapse;
margin-top: 10px;
}
.sonuc-tablosu th, .sonuc-tablosu td {
padding: 10px 12px;
text-align: left;
border-bottom: 1px solid rgba(128, 128, 128, 0.2);
}
.sonuc-tablosu th {
font-weight: bold;
background-color: rgba(128, 128, 128, 0.05);
}
.sonuc-tablosu tr:hover {
background-color: rgba(128, 128, 128, 0.02);
}
</style>
<script>
(function() {
const birimler = {
m: { ad: "Metre", sembol: "m", oran: 1 },
km: { ad: "Kilometre", sembol: "km", oran: 0.001 },
cm: { ad: "Santimetre", sembol: "cm", oran: 100 },
mm: { ad: "Milimetre", sembol: "mm", oran: 1000 },
dm: { ad: "Desimetre", sembol: "dm", oran: 10 },
um: { ad: "Mikrometre", sembol: "µm", oran: 1000000 },
nm: { ad: "Nanometre", sembol: "nm", oran: 1000000000 },
in: { ad: "İnç (inches)", sembol: "in", oran: 39.37007874015748 },
ft: { ad: "Ayak (feet)", sembol: "ft", oran: 3.2808398950131235 },
yd: { ad: "Yarda", sembol: "Yd", oran: 1.0936132983377078 },
mi: { ad: "Mil (statute)", sembol: "mi", oran: 0.000621371192237334 },
nmi: { ad: "Deniz mili", sembol: "nmi", oran: 0.0005399568034557235 },
ly: { ad: "Işık yılı", sembol: "ly", oran: 1.0570008340246154e-16 }
};
const degerGirdi = document.getElementById('uzunlukDeger');
const kaynakSecim = document.getElementById('kaynakBirim');
const sonucGövde = document.getElementById('sonucGövde');
function binlikAyir(sayiStr) {
let parcalar = sayiStr.split('.');
let tamKisim = parcalar[0];
let ondalikKisim = parcalar[1] ? ',' + parcalar[1] : '';
tamKisim = tamKisim.replace(/\B(?=(\d{3})+(?!\d))/g, ".");
return tamKisim + ondalikKisim;
}
function formatla(sayi) {
if (sayi === 0) return "0";
let str = sayi.toString();
if (str.includes('e')) {
let [taban, us] = str.split('e');
let isaret = us.startsWith('-') ? '-' : '';
let derece = us.replace(/^[+-]/, '');
const ustSimgeler = {
'0': '⁰', '1': '¹', '2': '²', '3': '³', '4': '⁴',
'5': '⁵', '6': '⁶', '7': '⁷', '8': '⁸', '9': '⁹', '-': '⁻'
};
let formatliUs = (isaret === '-' ? '⁻' : '') + derece.split('').map(k => ustSimgeler[k] || k).join('');
let temizTaban = parseFloat(parseFloat(taban).toFixed(4)).toString();
return binlikAyir(temizTaban) + ' × 10' + formatliUs;
}
let sabitli = parseFloat(sayi.toFixed(10)).toString();
return binlikAyir(sabitli);
}
function hesapla() {
const deger = parseFloat(degerGirdi.value);
const kaynak = kaynakSecim.value;
if (isNaN(deger)) {
sonucGövde.innerHTML = '<tr><td colspan="3" style="text-align:center;">Lütfen geçerli bir sayı girin.</td></tr>';
return;
}
const metreKarsiligi = deger / birimler[kaynak].oran;
let html = '';
for (let anahtar in birimler) {
const hedefDeger = metreKarsiligi * birimler[anahtar].oran;
html += `<tr>
<td>${birimler[anahtar].ad}</td>
<td><code>${birimler[anahtar].sembol}</code></td>
<td>${formatla(hedefDeger)}</td>
</tr>`;
}
sonucGövde.innerHTML = html;
}
degerGirdi.addEventListener('input', hesapla);
kaynakSecim.addEventListener('change', hesapla);
hesapla();
})();
</script>