Oluşturma türü (raster ve vektör)

Maps JavaScript API, haritanın iki farklı uygulamasını sunar: raster ve vektör. Raster harita varsayılan olarak yüklenir ve haritayı, Google Haritalar Platformu sunucu tarafında oluşturulan, ardından web uygulamanıza sunulan piksel tabanlı raster görüntü döşemeleri ızgarası olarak yükler. Vektör harita, yükleme sırasında istemci tarafında WebGL kullanılarak çizilen vektör tabanlı döşemelerden oluşur. WebGL, tarayıcının kullanıcının cihazındaki GPU'ya erişerek 2D ve 3D grafikler oluşturmasına olanak tanıyan bir web teknolojisidir. Vektör harita türü, daha iyi görsel doğruluk ve haritada eğimi ve yönü kontrol etme olanağı sağladığı için en iyi kullanıcı deneyimi için önerilir. Vektör harita özellikleri hakkında daha fazla bilgi edinin.

renderingType map seçeneğini belirterek veya seçeneği ilişkili bir harita kimliğinde ayarlayarak haritanın oluşturma türünü ayarlayın. renderingType seçeneği, harita kimliği yapılandırılarak yapılan tüm oluşturma türü ayarlarını geçersiz kılar.

renderingType seçeneğini belirtin.

Haritanız için raster veya vektör oluşturma türünü belirtmek üzere renderingType seçeneğini kullanın (harita kimliği gerekmez). div öğesi ve JavaScript kullanılarak yüklenen haritalar için varsayılan oluşturma türü google.maps.RenderingType.RASTER'dir. renderingType seçeneğini ayarlamak için aşağıdaki adımları uygulayın:

  1. RenderingType kitaplığını yükleyin. Bu işlem, Maps kitaplığı yüklenirken yapılabilir:

    const { Map, RenderingType } = await google.maps.importLibrary("maps");

  2. Haritayı başlatırken renderingType seçeneğini kullanarak RenderingType.VECTOR veya RenderingType.RASTER'yi belirtin:

    map = new Map(
  document.getElementById('map'),
  {
    zoom: 4,
    center: position,
    renderingType: RenderingType.VECTOR,
  }
);

Vektör harita oluşturma türü ayarlandığında, gerekli özelliklerin seçeneklerini ayarlamanız gerekir.

  • Eğme özelliğini etkinleştirmek için tiltInteractionEnabled harita seçeneğini true olarak ayarlayın veya map.setTiltInteractionEnabled(true)'ı arayın.
  • Kaydırmayı etkinleştirmek için headingInteractionEnabled harita seçeneğini true olarak ayarlayın veya map.setHeadingInteractionEnabled(true) işlevini çağırın.

<gmp-map> öğesi kullanılarak yüklenen haritalarda varsayılan oluşturma türü google.maps.RenderingType.VECTOR'dir. Bu türde eğme ve yön kontrolü etkindir. Oluşturma türünü <gmp-map> öğesini kullanarak ayarlamak için rendering-type özelliğini kullanın.

Oluşturma türünü ayarlamak için harita kimliği kullanma

Ayrıca, harita kimliği kullanarak oluşturma türünü de belirtebilirsiniz. Yeni bir harita kimliği oluşturmak için Bulut tabanlı harita stilini kullanma - Harita kimliği edinme bölümündeki adımları uygulayın. Harita türünü JavaScript olarak ayarladığınızdan ve bir seçenek (Vektör veya Raster) belirlediğinizden emin olun. Haritada eğme ve döndürme özelliklerini etkinleştirmek için Eğme ve Döndürme'yi işaretleyin. Bu sayede, bu değerleri programatik olarak ayarlayabilir ve kullanıcıların eğimi ve başlığı doğrudan harita üzerinde ayarlamasına olanak tanıyabilirsiniz. Eğme veya yönün kullanılması uygulamanızı olumsuz etkileyecekse kullanıcıların eğme ve döndürme ayarlarını yapamaması için Eğme ve Döndürme seçeneklerinin işaretini kaldırın.

Vektör Harita Kimliği Oluşturma

Ardından, harita başlatma kodunuzu oluşturduğunuz harita kimliğiyle güncelleyin. Harita kimliklerinizi Harita Yönetimi sayfasında bulabilirsiniz. Haritayı şu şekilde mapId özelliğini kullanarak oluşturduğunuzda bir harita kimliği sağlayın:

map = new google.maps.Map(document.getElementById('map'), {
  center: {lat: -34.397, lng: 150.644},
  zoom: 8,
  mapId: 'MAP_ID'
});