Bu sayfa, Cloud Translation API ile çevrilmiştir.

Genel bakış

Maps JavaScript API'nin WebGL destekli özellikleri sayesinde eğme ve döndürme işlemlerini kontrol edebilir, doğrudan haritaya 3 boyutlu nesneler ekleyebilir ve daha fazlasını yapabilirsiniz. Aşağıdaki özellikler dahildir:

WebGL yer paylaşımlı görünümü haritalarınıza özel 2D ve 3D grafikler ile animasyonlu içerikler eklemenize olanak tanır.
Eğme ve başlık artık programatik olarak ve fare ile klavye hareketleri kullanılarak ayarlanabilir.
map.moveCamera() aynı anda birden fazla kamera özelliğini değiştirmenize olanak tanır.
Zoom artık kesirli değerleri destekliyor.

Başlayın

Yeni WebGL özelliklerini kullanmak için vektör harita kullanmanız gerekir. Bu bölümde nasıl yapılacağı açıklanmaktadır.

`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):

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

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

Haritayı başlatırken renderingType veya RenderingType.RASTER'ı belirtmek için RenderingType.VECTOR seçeneğini kullanın:

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

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.

Eğme ve döndürmeyi etkinleştirmek için tiltInteractionEnabled harita seçeneğini true olarak ayarlayın veya map.setTiltInteractionEnabled işlevini çağırın.
Kaydırmayı etkinleştirmek için headingInteractionEnabled harita seçeneğini true olarak ayarlayın veya map.setHeadingInteractionEnabled işlevini çağırı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 Vektör seçeneğini belirlediğinizden emin olun. Haritada eğme ve döndürme özelliklerini etkinleştirmek için Eğme veya 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 haritada ayarlamasına olanak tanıyabilirsiniz. Eğme veya yön kullanımının uygulamanızı olumsuz etkileyeceğini düşünüyorsanız kullanıcıların eğme ve döndürme ayarlarını yapamaması için Eğme ve Döndürme 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 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'
});

`<gmp-map>` öğesini kullanın

<gmp-map> öğesi kullanılırken varsayılan olarak vektör haritalar, eğme ve başlık etkinleştirilir. Bu öğe, HTML kullanarak sayfanıza harita eklemenize olanak tanır. Daha fazla bilgi edinin.

Örnekler

Bu özellikleri göstermek için örnekler verilmiştir: