ESRI Arcgis Javascript API with Knockout JS MVVM

4 Nis

Yazıya başlamadan önce, yazının başlığında belirtilen kavramları daha önce duymamış olanlar için kısaca açıklamaya çalışayım. Arcgis Javascript API, ESRI firmasının harita tabanlı javascript uygulamaları geliştirmek için sunduğu bir araçtır. Knockout JS ise javascript tarafında MVVM(Model-View-View Model ) tasarım deseninin uygulanabilmesini sağlayan bir kütüphanedir.

Knockout Js Model

Knockout Js Model

Kısaca söylemek gerekirse Javascript kodu ile HTML kodunun arasında aktarım yapabilen, iki taraf arasında köprü vazifesi gören bir kütüphanedir.

Bu yazının konusu, Arcgis Javascript API ve Knockout JS kütüphanesinin bir arada kullanıldığı bir harita uygulamasını göstermektir. GitHub hesabımda oluşturduğum esri-knockout-mvvm repository içerisinde uygulama kodlarını bulabilirsiniz.

Neden Arcgis JS API ile birlikte Knockout JS kullanma ihtiyacı duydum?

Arcgis Javascript API ile uyglamalar geliştirirken Javascript kodu içerisinde HTML elemanlarının kullanılması noktasına takıldım. Örneğin bir butona tıkladığımızda, butonun olay yakalayıcı metodunda bir HTML tablosunu oluşturur ve sayfanın bir yerine yerleştirir. Burada farklı konuların birbirinden ayrılması (Separation of Concerns) prensibini Javascript programlama dilinde ihlal etmiş oluyoruz. Oysa programlama prensipleri genel kavramlar olup uygulama alanına göre değişmez. Bu sebepten dolayı Knockout JS kullanarak HTML ve Javascript kodunu birbiriden ayırdım.

Uygulama Araç Kutusu:

  • Arcgis Javascript API
  • Knockout JS
  • Bootstrap
  • JQuery
  • Dojo

Uygulama Özeti:

Uygulama, harita üzerindeki bir noktaya tıklandığında, tıklanan yerin yakınlarındaki sosyal aktiviteleri, olayları göstermektedir. Bu bilgileri seatgeek.com API üzerinden çekmektedir.

Uygulamanın çalışan halini buradan inceleyebilrsiniz.

Uygulama Görseli

Uygulama Görseli