🔌 QGIS Plugins

QGIS Plugins: QGIS2Web Nedir?

📅 5 Temmuz 2026 ⏱️ 25 dk okuma 🔌 QGIS Plugins

QGIS2Web, masaüstünde hazırladığınız bir CBS projesini tek bir sihirbaz penceresiyle tarayıcıda çalışan interaktif bir web haritasına dönüştürür — hiç JavaScript yazmadan. Ancak "kod yazmadan" ifadesi, çıktının nasıl çalıştığını anlamanıza gerek olmadığı anlamına gelmez: hangi sembolojinin aktarıldığını, dosya yapısını, performans sınırlarını ve yayınlama seçeneklerini bilmek, üretilen haritanın profesyonel görünmesi ile bozuk/yavaş bir sayfa arasındaki farkı belirler. Bu rehber tüm bu katmanları ayrıntılı biçimde ele alır.

1. QGIS2Web Nedir?

QGIS2Web, Tom Chadwin tarafından geliştirilen ve QGIS projelerini Leaflet.js veya OpenLayers tabanlı bağımsız web haritalarına dönüştüren bir eklentidir. Sonuç, sunucu tarafı bir uygulama değil — tamamen statik HTML, CSS, JavaScript ve GeoJSON/TopoJSON dosyalarından oluşan, herhangi bir web sunucusuna kopyalanıp doğrudan çalıştırılabilen bir pakettir.

Bu yaklaşımın gücü, QGIS'te zaten yaptığınız sembolojik ve öznitelik çalışmasını (renk skalaları, kategorize/dereceli görselleştirme, popup için gösterilecek alanlar) neredeyse hiç ek efor olmadan web'e taşımasıdır. Zayıf noktası ise tamamen istemci tarafı (client-side) çalışmasıdır: büyük veri setlerinde performans sınırlarına takılır (bkz. Bölüm 10).

Bakım durumu notu: Orijinal QGIS2Web deposu zaman zaman yavaş güncellenmiştir; QGIS'in yeni sürümleriyle uyumsuzluk yaşanırsa topluluk çatalları (fork) veya eklenti deposundaki güncel sürüm kontrol edilmelidir. Kurulum öncesi Eklenti Yöneticisi'nde sürüm notlarını okuyun.

2. Leaflet vs OpenLayers: Hangi Çıktı Motorunu Seçmeli?

QGIS2Web, dışa aktarma sırasında iki JavaScript kütüphanesinden birini üretim motoru olarak kullanmanıza izin verir. Bu seçim, üretilen sayfanın dosya boyutunu, hızını ve özellik setini doğrudan belirler.

ÖzellikLeafletOpenLayers
Kütüphane boyutuKüçük (~40 KB gzip)Daha büyük (~150+ KB gzip)
Mobil performansÇok iyiİyi, ama daha ağır
Projeksiyon desteğiTemelde Web Mercator odaklıGelişmiş, çoklu projeksiyon desteği
WMS/WMTS entegrasyonuTemel destekDaha kapsamlı OGC servis desteği
Öğrenme eğrisi (özelleştirme için)Düşük — API sadeOrta-yüksek — daha fazla yapılandırma seçeneği
Topluluk/eklenti ekosistemiÇok geniş (marker cluster, heatmap eklentileri)Geniş ama daha kurumsal odaklı

Genel öneri: Basit nokta/çizgi/poligon haritaları için Leaflet — daha hızlı yüklenir ve mobilde daha iyi çalışır. Özel bir projeksiyonda çalışıyorsanız veya gelişmiş WMS/WMTS entegrasyonu gerekiyorsa OpenLayers'ı tercih edin.

3. Kurulum

Eklentiler → Eklentileri Yönet ve Yükle…
Arama kutusuna: qgis2web
→ Eklentiyi Yükle

Kurulum sonrası üst menüde Web → QGIS2Web → Create web map girişi belirir.

QGIS Projesi Katman + Semboloji QGIS2Web Dışa Aktarma Sihirbazı HTML/CSS/JS + GeoJSON verisi Statik Hosting GH Pages / Netlify Sunucu tarafı kod gerektirmez — tamamen statik dosya akışı
Şekil 1. QGIS2Web iş akışı: QGIS projesi, dışa aktarma sihirbazından geçerek bağımsız statik web dosyalarına dönüşür ve herhangi bir statik barındırma servisine yüklenebilir.

4. Adım Adım Web Haritası Oluşturma

  1. QGIS projenizde yayınlamak istediğiniz katmanları hazırlayın ve istediğiniz sembolojiyi (kategorize, dereceli renk skalası vb.) uygulayın.
  2. Web → QGIS2Web → Create web map menüsünü açın.
  3. Sol panelde dışa aktarılacak katmanları işaretleyin; her katman için ayrı sekmede popup, kümeleme ve görünürlük ayarlarını yapılandırın (bkz. Bölüm 5).
  4. Sağ panelde harita motorunu seçin: Leaflet veya OpenLayers.
  5. Başlangıç yakınlaştırma seviyesi, minimum/maksimum zoom ve genel harita başlığı gibi ayarları yapılandırın.
  6. Export düğmesine tıklayın ve çıktı klasörünü seçin.
  7. Eklenti otomatik olarak sonucu varsayılan tarayıcınızda önizleme olarak açar.

5. Katman Ayarları: Popup, Kümeleme, Hassasiyet

  • Popup içeriği: Her katman için hangi öznitelik sütunlarının tıklandığında popup penceresinde gösterileceğini seçebilirsiniz; HTML açıklama şablonları (Popup açık kalsın/kapanır vb.) da desteklenir.
  • Kümeleme (Cluster): Yoğun nokta verilerinde (binlerce nokta), yakın noktalar zoom seviyesine göre otomatik gruplanıp bir sayı rozetiyle gösterilir; performansı ciddi ölçüde iyileştirir.
  • Hassasiyet (Precision): GeoJSON'a yazılan koordinatların ondalık basamak sayısını sınırlamak, dosya boyutunu önemli ölçüde küçültür (6 ondalık basamak ~11 cm hassasiyet sağlar; çoğu web haritası için fazlasıyla yeterlidir).
  • Encode to JSON/PBF: Bazı sürümlerde vektör verinin daha sıkı bir ikili formatta (protobuf) kodlanması seçeneği bulunur; büyük katmanlarda dosya boyutunu azaltır.
  • Görünürlük ölçeği: Katmanın hangi zoom aralığında görünür olacağı QGIS'teki ölçeğe bağlı görünürlük ayarlarından miras alınır.

6. Sembolojinin Aktarımı: Neler Desteklenir?

QGIS Semboloji TürüWeb Haritasına Aktarım
Tekli sembol (Single Symbol)Tam destekli
Kategorize (Categorized)Tam destekli
Dereceli (Graduated)Tam destekli
Kural tabanlı (Rule-based)Kısmi destekli — karmaşık kurallar bazen basitleştirilir
Etiketleme (Labeling)Desteklenir, ancak gelişmiş yerleştirme (placement) kuralları web'de farklı görünebilir
2.5D / Yükseklik tabanlı renderDesteklenmez
Isı haritası (Heatmap render)Desteklenmez — ayrı bir web kütüphanesi (Leaflet.heat) gerekir
Desen dolgu (SVG dolgu, dokular)Kısmi destekli — bazı özel SVG desenleri web'de düzgün render edilmeyebilir

Export öncesi kontrol: Eklentinin ürettiği tarayıcı önizlemesini, dışa aktarmadan önce mutlaka QGIS'teki orijinal görünümle karşılaştırın; özellikle kural tabanlı semboloji ve etiketlerde farklılık olabilir.

7. Dışa Aktarılan Dosya Yapısı

Export tamamlandığında seçtiğiniz klasörde tipik olarak şu yapı oluşur:

proje_web_haritasi/ ├── index.html # Ana sayfa; Leaflet/OpenLayers CDN veya yerel kütüphane referansları ├── css/ │ └── qgis2web.css # Harita konteyner, popup ve legend stilleri ├── js/ │ ├── leaflet.js # (veya openlayers.js) kütüphane dosyası │ └── qgis2web.js # Katman yükleme, popup bağlama, kümeleme mantığı ├── data/ │ ├── katman1_1.js # GeoJSON verisi (genelde bir JS değişkenine gömülü) │ └── katman2_2.js └── legend/ └── katman1.png # Semboloji lejant görselleri

Veri dosyalarının doğrudan .geojson yerine bir JS değişkenine (var json_katman1 = {...}) gömülü .js dosyası olarak üretilmesi, tarayıcıların yerel dosya sisteminden CORS kısıtlaması olmadan (bir web sunucusu olmadan bile) veriyi <script> etiketiyle yüklemesini sağlar — bu, çift tıklayarak index.html'i doğrudan açabilmenizin nedenidir.

8. Yayınlama: GitHub Pages, Netlify, Firebase Hosting

Çıktı tamamen statik olduğu için sunucu tarafı çalışma zamanı (Node.js, PHP vb.) gerekmez. Üç yaygın ücretsiz yayınlama seçeneği:

GitHub Pages
# Dışa aktarılan klasörü bir GitHub deposuna push edin git init git add . git commit -m "web haritasi" git remote add origin https://github.com/kullanici/proje-web-haritasi.git git push -u origin main # Ardından: Repo → Settings → Pages → Branch: main → Kaydet
Netlify (Sürükle-Bırak)

app.netlify.com üzerinde "Deploys" sekmesine dışa aktarılan klasörü doğrudan sürükleyip bırakmak, saniyeler içinde bir URL üretir — hesap açmadan da hızlı bir deneme için kullanılabilir.

Firebase Hosting
firebase init hosting # public dizini olarak QGIS2Web'in çıktı klasörünü gösterin firebase deploy --only hosting

9. Dışa Aktarılan Kodu Özelleştirme

Üretilen dosyalar düz HTML/CSS/JS olduğu için herhangi bir metin editörüyle özelleştirilebilir. Örneğin popup penceresine özel bir buton eklemek:

// qgis2web.js içinde, bindPopup çağrısına ek davranış eklemek için function pop_katman1(feature, layer) { var popupContent = '<table>' + /* ... mevcut alan listesi ... */ '</table>'; popupContent += '<br><button onclick="alert(\'Detay sayfasina git\')">Detaylar</button>'; layer.bindPopup(popupContent, {maxHeight: 400}); }

Benzer şekilde css/qgis2web.css dosyasında yazı tipi, popup arka plan rengi veya harita konteyner boyutu değiştirilebilir; index.html'e Google Analytics kodu, ek marka logosu veya navigasyon çubuğu eklemek de mümkündür.

10. Performans: Büyük Veri Setlerinde Sınırlar

QGIS2Web'in en büyük kısıtı, tüm vektör verinin tarayıcıya tek seferde ve tamamen istemci tarafında yüklenmesidir — bir tile sunucusu veya vektör tile hizmeti kullanılmaz. Bu, veri boyutu büyüdükçe doğrudan performans sorununa dönüşür.

Veri BüyüklüğüBeklenen DavranışÖnerilen Çözüm
< 1.000 nesneSorunsuz, hızlı yüklemeDoğrudan dışa aktarın
1.000–10.000 nesneYükleme gecikmesi hissedilirKümeleme (nokta) veya geometri sadeleştirme (poligon)
10.000+ nesneTarayıcı yavaşlar/kilitlenebilirVeriyi bölgesel olarak parçalayın veya vektör tile tabanlı alternatife geçin

Pratik eşik: Deneyimler, karmaşık poligon geometrilerinde (çok köşeli il/ilçe sınırları gibi) birkaç bin nesneden sonra fark edilir yavaşlama olduğunu göstermektedir. Büyük veri setleri için QGIS2Web yerine sunucu tarafı vektör tile üreten bir çözüm (örn. Mapbox GL JS + tippecanoe, veya MapLibre) değerlendirilmelidir.

11. Koordinat Sistemi ve Yaygın Hatalar

  • Harita boş görünüyor: Web haritaları WGS84 (EPSG:4326) veri ile Web Mercator (EPSG:3857) görüntüleme kombinasyonunu bekler; proje CRS'iniz farklıysa dışa aktarmadan önce katmanları yeniden projekte edin.
  • Türkçe karakterler bozuk görünüyor: Kaynak katmanın öznitelik kodlaması UTF-8 olmalıdır; Shapefile kaynaklıysa dışa aktarmadan önce GeoPackage'a dönüştürmek kodlama sorunlarını önler.
  • Popup'ta beklenmedik alanlar görünüyor: QGIS2Web varsayılan olarak tüm öznitelik sütunlarını popup'a dahil edebilir; katman ayarlarından yalnızca gösterilmesi istenen sütunları seçin.

12. QGIS2Web vs Alternatifler

🔷 QGIS2Web kullanın, eğer…

  • Kod yazmadan hızlıca bir QGIS projesini web'e taşımak istiyorsanız
  • Veri boyutu küçük/orta ölçekliyse (~birkaç bin nesne)
  • QGIS'te zaten hazırladığınız sembolojiyi olduğu gibi korumak istiyorsanız

🟩 Alternatif bir araç kullanın, eğer…

  • Python/Folium: Veri işleme ile haritalamayı aynı betikte birleştirmek istiyorsanız — bkz. Python ile Choropleth Harita
  • Mapbox GL JS / MapLibre: Büyük veri, vektör tile ve gelişmiş stil kontrolü gerekiyorsa
  • kepler.gl / deck.gl: Büyük ölçekli, katman animasyonlu veri görselleştirmesi gerekiyorsa

13. Pratik Kullanım Senaryoları

  • Belediye/kurum raporlarında interaktif ek: PDF rapora ek olarak paylaşılan bağlantıda, okuyucunun katmanları açıp kapatabildiği bir harita.
  • Tez/makale ekleri: Statik bir şekil yerine okuyucunun yakınlaştırıp popup ile veri inceleyebildiği bir web haritası bağlantısı.
  • Saha ekibi paylaşımı: Kurulum gerektirmeyen, tarayıcıdan erişilebilen basit bir harita ile saha ekiplerine konum/durum bilgisi paylaşmak.

14. Sık Sorulan Teknik Sorunlar

  • "require is not defined" veya konsol hataları: Genellikle dosyaların yerel dosya sisteminden (file://) değil, bir yerel sunucu (örn. python -m http.server) üzerinden açılması gerektiği durumlarda ortaya çıkar; bazı tarayıcı güvenlik politikaları yerel dosya erişimini kısıtlar.
  • Legend görselleri görünmüyor: Dışa aktarılan klasörün tamamı (alt klasörler dahil) taşınmalı/yüklenmelidir; yalnızca index.html'i kopyalamak legend ve veri dosyalarını eksik bırakır.
  • Katman sırası web'de QGIS'tekinden farklı: Bazı sürümlerde katman render sırası dışa aktarma sırasında değişebilir; katman panelindeki sırayı export öncesi kontrol edin.

Web Haritası ve CBS Projelerinizde Profesyonel Destek

QGIS projelerinizi interaktif web haritalarına dönüştürme ve yayınlama konusunda uzman ekibimizden destek alın.

Ücretsiz Danışmanlık Alın

Kaynaklar