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

Maps JavaScript API, haritanın iki farklı uygulamasını sunar: raster ve vektör. Rastır harita varsayılan olarak yüklenir ve haritayı, Google Haritalar Platformu tarafından sunucu tarafında oluşturulup web uygulamanıza sunulan piksel tabanlı raster resim karolarından oluşan bir ızgara olarak yükler. Vektör harita, 2D ve 3D grafikleri oluşturmak için tarayıcının kullanıcının cihazındaki GPU'ya erişmesine olanak tanıyan bir web teknolojisi olan WebGL kullanılarak istemci tarafında yükleme sırasında çizilen vektör tabanlı karolardan oluşur. En iyi kullanıcı deneyimi için vektör harita türü önerilir. Bu tür, haritadaki eğimi ve yönü kontrol etme olanağının yanı sıra daha iyi görsel doğruluk sağlar. Vektör haritası özellikleri hakkında daha fazla bilgi edinin.

renderingType harita seçeneğini belirterek veya ilişkili bir harita kimliğinde seçeneği ayarlayarak bir haritanın oluşturma türünü ayarlayın. renderingType seçeneği, bir 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'dur. renderingType seçeneğini ayarlamak için aşağıdaki adımları uygulayın:

  1. RenderingType kitaplığını yükleyin. Bunu Haritalar kitaplığı yüklenirken yapabilirsiniz:

    const { Map, RenderingType } = await google.maps.importLibrary("maps");
    
  2. Haritayı başlatırken RenderingType.VECTOR veya RenderingType.RASTER'yi belirtmek için renderingType seçeneğini kullanın:

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

Vektör harita oluşturma türü ayarlandığında, gerekli özellikler için seçenekleri ayarlamanız gerekir.

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

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

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

Harita kimliği kullanarak da oluşturma türünü belirtebilirsiniz. Yeni bir harita kimliği oluşturmak için Bulut tabanlı harita stilini kullanma - Harita kimliği alma başlıklı makaledeki 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. Haritayı yatırma ve döndürme özelliğini etkinleştirmek için Yatırma ve Döndürme'yi işaretleyin. Bu sayede bu değerleri programatik olarak ayarlayabilir ve kullanıcıların eğimi ve yönünü doğrudan haritada ayarlayabilmesini sağlayabilirsiniz. Eğim veya yön kullanımı uygulamanızı olumsuz yönde etkileyecekse kullanıcıların eğimi ve yönü ayarlayamaması için Eğim ve Dönme seçeneklerini işaretlemeyin.

Vektör Harita Kimliği Oluşturma

Ardından, harita başlatma kodunuzu oluşturduğunuz harita kimliğiyle güncelleyin. Harita kimliklerinizi Haritalar Yönetimi sayfasında bulabilirsiniz. Haritayı burada gösterildiği gibi mapId mülkünü kullanarak örneklendirirken 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'
});