Tensorflow COCO-Ssd ile Nesne Tespiti ve Takibi

4 min readOct 17, 2024

Giriş

Günümüzde nesne tespiti ve takibi, yapay zeka ve derin öğrenme alanlarının en heyecan verici konularından biri haline gelmiştir. Özellikle web tabanlı uygulamaların artmasıyla birlikte, bu teknolojilerin frontend tarafında, yani tarayıcı üzerinde JavaScript kullanarak uygulanması büyük önem kazanmıştır. Bu makalede, JavaScript kullanarak nasıl nesne tespiti ve takibi yapabileceğinizi ve bu teknolojinin hangi alanlarda kullanıldığını detaylı bir şekilde inceleyeceğiz.

Nesne Tespiti ve Takibi Nedir?

Nesne tespiti, bir görüntü veya video akışı içinde belirli nesnelerin varlığını ve konumlarını belirleme işlemidir. Nesne takibi ise tespit edilen nesnelerin hareketlerinin zaman içinde izlenmesini içerir. Bu teknolojiler, otonom araçlardan güvenlik sistemlerine, sağlık hizmetlerinden perakende sektörüne kadar geniş bir yelpazede uygulama alanına sahiptir.

Neden JavaScript ve Frontend?

JavaScript, web teknolojilerinin temel taşlarından biridir ve tarayıcı üzerinde çalışabilmesi sayesinde gerçek zamanlı uygulamalar geliştirmeye olanak tanır. Frontend tarafında nesne tespiti ve takibi yapmanın avantajları şunlardır:

Anında Geri Bildirim: Kullanıcılar, uygulamanın sonuçlarını gerçek zamanlı olarak görebilir.
Platform Bağımsızlık: Tarayıcı tabanlı olduğu için herhangi bir ek yazılım yüklemeye gerek kalmaz.
Geliştirici Topluluğu: JavaScript’in geniş bir geliştirici topluluğu ve birçok kütüphanesi vardır.

Gerekli Kütüphaneler ve Araçlar

TensorFlow.js

https://tr.m.wikipedia.org/wiki/Dosya:TensorFlow_logo.svg

TensorFlow.js, TensorFlow’un JavaScript sürümüdür ve tarayıcı üzerinde derin öğrenme modelleri çalıştırmanıza olanak tanır. Hem önceden eğitilmiş modelleri kullanabilir hem de kendi modellerinizi eğitebilirsiniz.

Diğer Kütüphaneler

WebGL: Grafik işlemleri hızlandırmak için kullanılır.
Three.js: 3D grafikler ve görselleştirme için kullanılabilir.
OpenCV.js: Bilgisayarlı görü işlemleri için popüler bir kütüphanenin JavaScript sürümü.

Nasıl Yapılır?

Adım 1: Proje Ortamının Hazırlanması

Öncelikle bir HTML dosyası oluşturun ve gerekli kütüphaneleri dahil edin.

<!DOCTYPE html>
<html>
<head>
  <title>Nesne Tespiti ve Takibi</title>
  <script src="<https://cdn.jsdelivr.net/npm/@tensorflow/tfjs>"></script>
  <script src="<https://cdn.jsdelivr.net/npm/@tensorflow-models/coco-ssd>"></script>
</head>
<body>
  <video id="video" width="600" height="400" autoplay></video>
  <canvas id="canvas" width="600" height="400"></canvas>
  <script src="app.js"></script>
</body>
</html>

Adım 2: Video Akışının Alınması

Kullanıcının kamerasından video akışı almak için aşağıdaki kodu app.js dosyasına ekleyin.

const video = document.getElementById('video');

navigator.mediaDevices.getUserMedia({ video: true })
  .then(stream => {
    video.srcObject = stream;
  });

Adım 3: Modelin Yüklenmesi

TensorFlow.js ile COCO-SSD modelini yükleyin.

let model;
cocoSsd.load().then(loadedModel => {
  model = loadedModel;
  detectFrame();
});

Adım 4: Nesne Tespiti İşlevinin Yazılması

Her bir karede nesne tespiti yapmak için bir fonksiyon oluşturun.

function detectFrame() {
  model.detect(video).then(predictions => {
    renderPredictions(predictions);
    requestAnimationFrame(detectFrame);
  });
}

Adım 5: Sonuçların Görselleştirilmesi

Tespit edilen nesneleri ekrana çizmek için renderPredictions fonksiyonunu yazın.

function renderPredictions(predictions) {
  const canvas = document.getElementById('canvas');
  const ctx = canvas.getContext('2d');

  ctx.clearRect(0, 0, canvas.width, canvas.height);
  ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
  predictions.forEach(prediction => {
    ctx.beginPath();
    ctx.rect(...prediction.bbox);
    ctx.lineWidth = 2;
    ctx.strokeStyle = 'red';
    ctx.fillStyle = 'red';
    ctx.stroke();
    ctx.fillText(
      prediction.class + ': ' + Math.round(prediction.score * 100) + '%',
      prediction.bbox[0],
      prediction.bbox[1] > 10 ? prediction.bbox[1] - 5 : 10
    );
  });
}

Adım 6: Nesne Takibi

Nesne takibi için ek kütüphaneler veya algoritmalar kullanabilirsiniz. Örneğin, SORT veya Kalman Filtresi uygulayabilirsiniz. Ancak, bu algoritmaların JavaScript uyarlamalarını kendiniz yazmanız veya mevcut kütüphaneleri kullanmanız gerekebilir.

Hangi Alanlarda Kullanılır?

E-Ticaret ve Perakende

Sanal Deneme Kabinleri: Kullanıcılar kıyafetleri veya aksesuarları sanal olarak deneyebilir.
Ürün Tanıma: Müşteriler, kameralarını kullanarak ürünler hakkında bilgi alabilir.

Sağlık Hizmetleri

Hasta Takibi: Hastaların hareketleri ve aktiviteleri izlenebilir.
Teşhis Araçları: Görüntü işleme ile hastalık teşhisi kolaylaştırılabilir.

Güvenlik ve Gözetim

Yüz Tanıma: Güvenlik sistemlerinde kimlik doğrulama için kullanılabilir.
Davranış Analizi: Şüpheli davranışların tespiti için kullanılabilir.

Oyun ve Eğlence

Artırılmış Gerçeklik (AR): Gerçek dünya ile sanal objelerin etkileşimi sağlanabilir.
Hareket Yakalama: Oyunlarda ve uygulamalarda kullanıcı hareketleri izlenebilir.

Eğitim

Eğitsel Uygulamalar: Nesne tanıma ile interaktif öğrenme deneyimleri oluşturulabilir.
Uzaktan Eğitim: Öğretmen ve öğrenciler arasındaki etkileşim artırılabilir.

Performans ve Optimizasyon

Tarayıcı üzerinde derin öğrenme modelleri çalıştırmak performans açısından zorlayıcı olabilir. Bu nedenle aşağıdaki optimizasyon tekniklerini kullanabilirsiniz:

Modeli Optimize Etme: Daha hafif modeller veya kuantize edilmiş modeller kullanabilirsiniz.
Web Workers: İşlemci yoğun işlemleri ana iş parçacığından ayırabilirsiniz.
GPU Desteği: WebGL ile GPU hızlandırması sağlayabilirsiniz.

Güvenlik ve Gizlilik

Kullanıcı verilerinin güvenliği ve gizliliği büyük önem taşır. Tarayıcı tabanlı uygulamalarda verilerin yerel olarak işlenmesi, sunucuya gönderilmemesi anlamına gelir, bu da gizlilik açısından avantajlıdır. Ancak, kullanıcı izni ve verilerin nasıl kullanılacağı konusunda şeffaf olmak önemlidir.

Sonuç ve İleri Okuma

JavaScript ve frontend teknolojileri kullanarak nesne tespiti ve takibi yapmak, modern web uygulamalarının gücünü artıran bir yaklaşımdır. Bu teknolojiler, kullanıcı deneyimini zenginleştirmenin yanı sıra çeşitli sektörlerde yenilikçi çözümler sunar.

Daha fazla bilgi ve ileri düzey uygulamalar için aşağıdaki kaynakları inceleyebilirsiniz:

TensorFlow.js Resmi Dokümantasyonu
Mozilla Developer Network (MDN) Web API’leri
OpenCV.js Kılavuzları
GitHub’da Açık Kaynak Projeler ve Örnekler

Kaynaklar

Bu makalede, JavaScript ve frontend teknolojileri kullanarak nasıl nesne tespiti ve takibi yapabileceğinizi detaylı bir şekilde ele aldık. Umarız bu bilgiler, kendi projelerinizi geliştirirken size yardımcı olur.