Veri kümelerinin veriye dayalı stilini ayarlamak için aşağıdaki adımları uygulayın.
API anahtarı alma ve API'leri etkinleştirme
Veri kümeleri için veriye dayalı stilleri kullanmadan önce şunlara ihtiyacınız vardır: Cloud bir faturalandırma hesabı olan bir proje ve hem Maps JavaScript API ve Maps Datasets API'nin etkinleştirilmesi gerekir. Daha fazla bilgi için Google Cloud projenizi oluşturma başlıklı makaleye göz atın.
Haritalar JavaScript API'yi etkinleştirme
Haritalar Veri Kümeleri API'sini etkinleştirme
Harita kimliği oluşturma
Yeni bir harita kimliği oluşturmak için şu adımları uygulayın: Bulutta özelleştirme. Harita türünü JavaScript olarak ayarlayın ve Vektör seçeneğini belirleyin.
Haritayı örneklendirirken mapId
özelliğini kullanarak bir harita kimliği sağlayın .
Harita kimliği, veri kümesiyle ilişkilendirilen harita stiline karşılık gelmelidir
tıklayın.
const position = new google.maps.LatLng(40.75, -74.05); const map = new google.maps.Map(document.getElementById('map'), { zoom: 11, center: position, mapId: 'YOUR_MAP_ID', });
Yeni harita stili oluşturma
Yeni bir harita stili oluşturmak için Harita stillerini yönetme başlıklı makaledeki talimatları uygulayın. tıklayın ve stili az önce oluşturduğunuz harita kimliğiyle ilişkilendirin.
Harita başlatma kodunuzu güncelleme
Veri kümeleri için veriye dayalı stili kullanmak istiyorsanız önce Maps JavaScript API'yi yükleyin.
Burada gösterildiği gibi, uygulama kodunuza satır içi önyükleme yükleyicisini ekleyerek
(API script
etiketinizde v=beta
kullanın):
<script> (g=>{var h,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=>h||(h=new Promise(async(f,n)=>{await (a=m.createElement("script"));e.set("libraries",[...r]+"");for(k in g)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=>h=n(Error(p+" could not load."));a.nonce=m.querySelector("script[nonce]")?.nonce||"";m.head.append(a)}));d[l]?console.warn(p+" only loads once. Ignoring:",g):d[l]=(f,...n)=>r.add(f)&&u().then(()=>d[l](f,...n))})({ key: "YOUR_API_KEY", v: "weekly", // Use the 'v' parameter to indicate the version to use (weekly, beta, alpha, etc.). // Add other bootstrap parameters as needed, using camel case. }); </script>
Harita özelliklerini kontrol edin (isteğe bağlı)
Veri kümeleri için veriye dayalı stil için harita kimliği gerekir. Harita kimliği eksikse
veya geçersiz bir harita kimliği iletildiğinde, veri özellikleri yüklenemez. Kullanıcı
bir mapcapabilities_changed
işleyicisi ekleyebilirsiniz.
harita özelliği değişikliklerine abone olma Bu, aşağıdakilerin
karşılandığına dikkat edin:
- Geçerli bir harita kimliği kullanılıyor.
- Harita kimliği bir vektör haritasıyla ilişkilendirilir.
Harita Özellikleri'ni kullanmak isteğe bağlıdır ve yalnızca test ve sorun giderme amacıyla veya çalışma zamanında istenen yedek amacıyla kullanılabilir.
// Optional: subscribe to map capability changes. map.addListener('mapcapabilities_changed', () => { const mapCapabilities = map.getMapCapabilities(); if (!mapCapabilities.isDataDrivenStylingAvailable) { // Data-driven styling is *not* available, add a fallback. // Existing feature layers are also unavailable. } });