Azure Haritalar Web SDK'sı en iyi yöntemleri

Bu belge, Azure Haritalar Web SDK'sı için en iyi yöntemlere odaklanır, ancak ana hatlarıyla açıklanan en iyi yöntemlerin ve iyileştirmelerin çoğu diğer tüm Azure Haritalar SDK'lara uygulanabilir.

Azure Haritalar Web SDK'sı, büyük uzamsal veri kümelerini birçok farklı yolla işlemek için güçlü bir tuval sağlar. Bazı durumlarda, verileri aynı şekilde işlemenin birden çok yolu vardır, ancak veri kümesinin boyutuna ve istenen işlevselliğe bağlı olarak, bir yöntem diğerlerinden daha iyi performans gösterebilir. Bu makalede performansı en üst düzeye çıkarmak ve sorunsuz bir kullanıcı deneyimi oluşturmak için en iyi yöntemler ve ipuçları ve püf noktaları vurgulanır.

Genel olarak, haritanın performansını geliştirmek için katman ve kaynak sayısını azaltmanın yollarını ve kullanılan veri kümelerinin ve işleme stillerinin karmaşıklığını arayın.

En iyi güvenlik uygulamaları

En iyi güvenlik yöntemleri hakkında daha fazla bilgi için bkz . Kimlik doğrulaması ve yetkilendirme en iyi yöntemleri.

Azure Haritalar'nin en son sürümlerini kullanma

Azure Haritalar SDK'ları, SDK'lar tarafından kullanılan dış bağımlılık kitaplıklarıyla birlikte düzenli güvenlik testlerinden geçer. Bilinen tüm güvenlik sorunu zamanında düzeltilir ve üretime gönderilir. Uygulamanız Azure Haritalar Web SDK'sının barındırılan sürümünün en son ana sürümünü işaret ederse, güvenlikle ilgili düzeltmeleri içeren tüm ikincil sürüm güncelleştirmelerini otomatik olarak alır.

npm modülü aracılığıyla Azure Haritalar Web SDK'sını kendi kendine barındırılıyorsa, dosyanızdaki package.json Azure Haritalar npm paketi sürüm numarasıyla birlikte kullanmak için şapka işareti (^) simgesini kullandığınızdan emin olun; böylece en son ikincil sürüme işaret eder.

"dependencies": {
  "azure-maps-control": "^3.0.0"
}

Bahşiş

Her zaman npm Azure Haritalar Denetiminin en son sürümünü kullanın. Daha fazla bilgi için npm belgelerinde azure-maps-control bölümüne bakın.

İlk harita yükünü iyileştirme

Bir web sayfası yüklenirken, yapmak istediğiniz ilk şeylerden biri, kullanıcının boş bir ekrana bakmaması için bir şeyi mümkün olan en kısa sürede işlemeye başlamaktır.

Haritalara hazır etkinliği izleyin

Benzer şekilde, harita başlangıçta sık sık yüklendiğinde, kullanıcının boş bir haritaya bakmaması için haritaya mümkün olan en kısa sürede veri yüklemek istenir. Harita kaynakları zaman uyumsuz olarak yüklediğinden, kendi verilerinizi işlemeye çalışmadan önce haritayla etkileşim kurulmaya hazır olana kadar beklemeniz gerekir. Bekleyebileceğiniz iki olay vardır: bir load olay ve bir ready olay. Harita ilk harita görünümünü tamamen yükledikten ve her harita kutucuğu yüklendikten sonra yük olayı tetiklenir. "Stil yüklenmedi" hatası görürseniz, olayı kullanmanız load ve stilin tamamen yüklenmesini beklemeniz gerekir.

Hazır olay, haritayla etkileşim kurmaya başlamak için gereken en düşük harita kaynakları olduğunda tetikler. Daha kesin olarak, ready harita stil verilerini ilk kez yüklerken olay tetikleniyor. Hazır olay genellikle yük olayının yarısında tetiklenebilir ve bu nedenle verilerinizi haritaya daha erken yüklemeye başlamanıza olanak tanır. Şu anda haritanın stilinde veya dilinde değişiklik yapmaktan kaçının. Bunun yapılması, stilin yeniden yüklenmesini tetikleyebilir.

Azure Haritalar Web SDK'sını yavaş yükleme

Haritaya hemen gerek yoksa, Azure Haritalar Web SDK'sını gerekene kadar yavaş yükleyin. Bu, Azure Haritalar Web SDK'sı tarafından kullanılan JavaScript ve CSS dosyalarının yüklenmesini gerekene kadar geciktirmektedir. Bunun oluştuğu yaygın senaryolardan biri, haritanın sayfa yüklemesinde görüntülenmemiş bir sekmeye veya açılır panele yüklenmesidir.

Eşleme kodunu yavaş yükleme örneği, bir düğmeye basılana kadar Azure Haritalar Web SDK'sının yüklenmesinin nasıl geciktirilmiş olduğunu gösterir. Kaynak kodu için bkz . Eşleme örnek kodunu gecikmeli yükleme.

Harita için yer tutucu ekleme

Uygulamanızdaki ağ sınırlamaları veya diğer öncelikler nedeniyle haritanın yüklenmesi biraz zaman alıyorsa haritaya harita div için yer tutucu olarak küçük bir arka plan görüntüsü eklemeyi göz önünde bulundurun. Bu, yüklenirken haritanın div boşluğunu doldurur.

Başlatmada ilk harita stilini ve kamera seçeneklerini ayarlama

Genellikle uygulamalar haritayı belirli bir konuma veya stile yüklemek ister. Bazen geliştiriciler harita yüklenene kadar bekler (veya olayı bekler ready ) ve ardından haritanın setCamera veya setStyle işlevlerini kullanır. İstenen harita görünümü için gereken kaynaklar yüklenmeden önce varsayılan olarak birçok kaynak yüklendiğinden, bu işlemin istenen ilk harita görünümüne gelmesi genellikle daha uzun sürer. daha iyi bir yaklaşım, istenen harita kamerasını ve stil seçeneklerini başlatırken haritaya geçirmektir.

Veri kaynaklarını iyileştirme

Web SDK'sının iki veri kaynağı vardır:

  • GeoJSON kaynağı: Sınıfı, DataSource ham konum verilerini GeoJSON biçiminde yerel olarak yönetir. Küçük ve orta ölçekli veri kümeleri (yüz binlerce özellik) için iyidir.
  • Vektör kutucuğu kaynağı: Sınıfı, VectorTileSource geçerli harita görünümü için vektör kutucukları olarak biçimlendirilmiş verileri haritalar döşeme sistemine göre yükler. Büyük ve çok büyük veri kümeleri (milyonlarca veya milyarlarca özellik) için idealdir.

Büyük veri kümeleri için kutucuk tabanlı çözümleri kullanma

Milyonlarca özellik içeren daha büyük veri kümeleriyle çalışıyorsanız, en iyi performansı elde etmenin önerilen yolu verileri vektör veya raster görüntü kutucuğu hizmeti gibi bir sunucu tarafı çözümü kullanarak kullanıma sunmadır.
Vektör kutucukları, yalnızca geometrilerin kutucuğun odak alanına kırpıldığı ve kutucuğun yakınlaştırma düzeyi için haritanın çözünürlüğüyle eşleşecek şekilde genelleştirilmiş görünümdeki verileri yükleyebilecek şekilde iyileştirilmiştir.

Azure Haritalar Oluşturucu platformu verileri vektör kutucuğu biçiminde alır. Diğer veri biçimleri Tippecanoe gibi araçlar kullanıyor olabilir. Vektör kutucuklarıyla çalışma hakkında daha fazla bilgi için GitHub'daki Mapbox awesome-vector-tiles readme bölümüne bakın.

Ayrıca veri kümelerini sunucu tarafında raster görüntü kutucukları olarak işleyen ve harita SDK'sında TileLayer sınıfını kullanarak verileri yükleyen özel bir hizmet oluşturmak da mümkündür. Haritanın en fazla birkaç düzine görüntü yüklemesi ve yönetmesi gerektiğinden bu olağanüstü performans sağlar. Ancak ham veriler yerel olarak kullanılamadığından raster kutucuklarını kullanmayla ilgili bazı sınırlamalar vardır. Her tür etkileşim deneyimini desteklemek için genellikle ikincil bir hizmet gerekir; örneğin, bir kullanıcının hangi şekle tıklamış olduğunu öğrenme. Ayrıca, bir raster kutucuğunun dosya boyutu genellikle genelleştirilmiş ve yakınlaştırma düzeyi için iyileştirilmiş geometriler içeren sıkıştırılmış vektör kutucuğundan daha büyüktür.

Veri kaynakları hakkında daha fazla bilgi için bkz . Veri kaynağı oluşturma.

Birden çok veri kümesini tek bir vektör kutucuğu kaynağında birleştirme

Haritanın yönetmesi gereken veri kaynakları ne kadar az olursa, görüntülenecek tüm özellikleri o kadar hızlı işleyebilir. Özellikle, kutucuk kaynakları söz konusu olduğunda, iki vektör kutucuğu kaynağını bir araya getirmek, kutucukları almak için HTTP isteklerinin sayısını ikiye böler ve yalnızca bir dosya üst bilgisi olduğundan toplam veri miktarı biraz daha küçük olur.

Tek bir vektör kutucuğu kaynağında birden çok veri kümesinin birleştirilmesi Tippecanoe gibi bir araç kullanılarak elde edilebilir. Veri kümeleri tek bir özellik koleksiyonunda birleştirilebilir veya kaynak katmanları olarak bilinen vektör kutucuğu içinde ayrı katmanlara ayrılabilir. Bir vektör kutucuğu kaynağını işleme katmanına bağlarken, katmanla birlikte işlemek istediğiniz verileri içeren kaynak katmanını belirtirsiniz.

Veri güncelleştirmeleri nedeniyle tuval yenileme sayısını azaltın

Bir DataSource sınıftaki verilerin eklenebileceği veya güncelleştirilebileceği çeşitli yollar vardır. Aşağıdaki listede, iyi performans sağlamak için farklı yöntemler ve dikkat edilmesi gereken bazı noktalar gösterilmektedir.

  • Veri kaynakları add işlevi, bir veri kaynağına bir veya daha fazla özellik eklemek için kullanılabilir. Bu işlev her çağrıldığında bir harita tuval yenilemesi tetikler. Birçok özellik ekliyorsanız, bunları bir dizi veya özellik koleksiyonunda birleştirin ve bir veri kümesi üzerinde döngü yapmak ve her özellik için bu işlevi çağırmak yerine bir kez bu işleve geçirin.
  • Veri kaynakları setShapes işlevi, bir veri kaynağındaki tüm şekillerin üzerine yazmak için kullanılabilir. Arka planda, veri kaynaklarını clear ve add işlevleri bir araya getirir ve iki yerine tek bir harita tuvali yenilemesi yapar ve bu daha hızlıdır. Bir veri kaynağındaki tüm verileri güncelleştirmek istediğinizde bu işlevi kullandığınızdan emin olun.
  • Veri kaynakları importDataFromUrl işlevi, bir URL aracılığıyla bir GeoJSON dosyasını bir veri kaynağına yüklemek için kullanılabilir. Veriler indirildikten sonra veri kaynakları add işlevine geçirilir. GeoJSON dosyası farklı bir etki alanında barındırılıyorsa, diğer etki alanının etki alanları arası istekleri (COR) desteklediğinden emin olun. Verileri etki alanınızdaki yerel bir dosyaya kopyalamayı veya COR'leri etkinleştirilmiş bir ara sunucu hizmeti oluşturmayı dikkate almazsa. Dosya büyükse, bir vektör kutucuğu kaynağına dönüştürmeyi göz önünde bulundurun.
  • Özellikler sınıfıyla Shape sarmalanmışsa, şeklin addProperty, setCoordinatesve setProperties işlevlerinin tümü veri kaynağında bir güncelleştirme ve bir harita tuval yenilemesi tetikler. Veri kaynakları getShapes ve getShapeById işlevleri tarafından döndürülen tüm özellikler otomatik olarak sınıfıyla Shape sarmalanmıştır. Birkaç şekli güncelleştirmek istiyorsanız, veri kaynakları toJson işlevini kullanarak bunları JSON'a dönüştürmek, GeoJSON'ı düzenlemek ve ardından bu verileri veri kaynakları işlevine geçirmek daha hızlıdır setShapes .

Veri kaynaklarının clear işlevini gereksiz yere çağırmaktan kaçının

sınıfının clear işlevini çağırmak DataSource , bir harita tuvali yenilemesine neden olur. clear İşlev bir satırda birden çok kez çağrılırsa, eşleme her yenilemenin gerçekleşmesini beklerken bir gecikme oluşabilir.

Bu, veri kaynağını temizleyen, yeni verileri indiren, veri kaynağını yeniden temizleyen ve ardından yeni verileri veri kaynağına ekleyen uygulamalarda yaygın bir senaryodur. İstenen kullanıcı deneyimine bağlı olarak aşağıdaki alternatifler daha iyi olacaktır.

  • Yeni verileri indirmeden önce verileri temizleyin, ardından yeni verileri veri kaynaklarına add veya setShapes işlevine geçirin. Haritadaki tek veri kümesi buysa, yeni veriler indirilirken harita boş olur.
  • Yeni verileri indirin ve veri kaynakları setShapes işlevine geçirin. Bu, haritadaki tüm verilerin yerini alır.

Kullanılmayan özellikleri ve özellikleri kaldırma

Veri kümeniz uygulamanızda kullanılmayacak özellikler içeriyorsa bunları kaldırın. Benzer şekilde, gerekli olmayan özelliklerdeki özellikleri kaldırın. Bunun çeşitli avantajları vardır:

  • İndirilmesi gereken veri miktarını azaltır.
  • Verileri işlenirken döngüye alınması gereken özellik sayısını azaltır.
  • Bazen veri temelli ifadeleri ve filtreleri basitleştirmeye veya kaldırmaya yardımcı olabilir; bu da işleme zamanında daha az işlem gerektiği anlamına gelir.

Özelliklerin çok sayıda özelliği veya içeriği olduğunda, veri kaynağına eklenenleri yalnızca işleme için gerekenlerle sınırlamak ve gerektiğinde diğer özelliği veya içeriği almak için ayrı bir yönteme veya hizmete sahip olmak çok daha yüksek performans gösterir. Örneğin, harita üzerinde konumları görüntüleyen basit bir haritanız varsa, bir dizi ayrıntılı içerik görüntülenir. Konumların haritada nasıl işlendiğini özelleştirmek için veri odaklı stil kullanmak istiyorsanız, yalnızca veri kaynağına gereken özellikleri yükleyin. Ayrıntılı içeriği görüntülemek istediğinizde, diğer içeriği ayrı ayrı almak için özelliğin kimliğini kullanın. İçerik sunucuda depolanıyorsa, zaman uyumsuz olarak almak için bir hizmet kullanarak harita ilk yüklendiğinde indirilmesi gereken veri miktarını azaltabilirsiniz.

Ayrıca, özelliklerin koordinatlarındaki önemli basamak sayısını azaltmak da veri boyutunu önemli ölçüde azaltabilir. Koordinatların 12 veya daha fazla ondalık basamak içermesi yaygın değildir; ancak altı ondalık basamak, koordinatın temsil ettiği konumdan daha kesin olan yaklaşık 0,1 metre doğruluk değerine sahiptir (iç mekan bina düzenleri gibi küçük konum verileriyle çalışırken altı ondalık basamak önerilir). Altıdan fazla ondalık basameğe sahip olmak, verilerin nasıl işlendiği konusunda büyük olasılıkla bir fark yaratmayacak ve kullanıcının ek fayda sağlamadan daha fazla veri indirmesini gerektirir.

GeoJSON verileriyle çalışmaya yönelik yararlı araçların listesi aşağıdadır.

Verileri hızla değiştirmek için ayrı bir veri kaynağı kullanma

Bazen akış verilerinin canlı güncelleştirmelerini gösterme veya özellikleri animasyonlama gibi işlemler için haritadaki verileri hızla güncelleştirmeye ihtiyaç duyuluyor. Bir veri kaynağı güncelleştirildiğinde, işleme altyapısı döngüye geçer ve veri kaynağındaki tüm özellikleri işler. Statik verileri hızla değişen veri kaynaklarına ayırarak genel performansı geliştirin ve her güncelleştirme sırasında yeniden işlenen özelliklerin sayısını azaltın.

Canlı verilerle vektör kutucukları kullanıyorsanız, güncelleştirmeleri desteklemenin kolay bir yolu yanıt üst bilgisini kullanmaktır expires . Varsayılan olarak, herhangi bir vektör kutucuğu kaynağı veya raster kutucuğu katmanı, tarihe göre expires kutucukları otomatik olarak yeniden yükler. Haritadaki trafik akışı ve olay kutucukları, haritada yeni gerçek zamanlı trafik verilerinin görüntülendiğinden emin olmak için bu özelliği kullanır. Bu özellik, haritalar refreshExpiredTiles hizmeti seçeneği falseolarak ayarlanarak devre dışı bırakılabilir.

GeoJSON veri kaynaklarında arabellek ve tolerans seçeneklerini ayarlama

sınıfı, DataSource ham konum verilerini anında işleme için yerel vektör kutucuklarına dönüştürür. Bu yerel vektör kutucukları, kutucuklar arasında sorunsuz işleme sağlamak için ham verileri bir arabelleğe sahip kutucuk alanının sınırlarına kırpır. Seçenek ne kadar buffer küçük olursa, çakışan veriler yerel vektör kutucuklarında o kadar az depolanır ve daha iyi performans elde edilir, ancak işleme yapıtlarının değişimi o kadar büyük olur. Minimum işleme yapıtlarıyla performansın doğru karışımını elde etmek için bu seçeneği ayarlamayı deneyin.

sınıfı, DataSource işleme amacıyla geometrilerin çözünürlüğünü azaltırken Douglas-Peucker basitleştirme algoritmasıyla birlikte kullanılan bir tolerance seçeneğe de sahiptir. Bu tolerans değerinin artırılması geometrilerin çözünürlüğünü azaltır ve bu sayede performansı artırır. Veri kümeniz için geometri çözünürlüğü ve performansın doğru karışımını elde etmek için bu seçeneği değiştirin.

GeoJSON veri kaynaklarının en yüksek yakınlaştırma seçeneğini ayarlama

sınıfı, DataSource ham konum verilerini anında işleme için yerel vektör kutucuklarına dönüştürür. Varsayılan olarak, yakınlaştırma düzeyi 18'e kadar bunu yapar; bu noktada, yakınlaştırma düzeyi 18 için oluşturulan kutucuklardan verileri örnekler. Bu, bu düzeylerde yakınlaştırıldığında yüksek çözünürlüğe sahip olması gereken çoğu veri kümesi için iyi sonuç verir. Ancak, durum veya bölge çokgenlerini görüntülerken olduğu gibi, uzaklaştırıldığında daha fazla görüntülenme olasılığı daha yüksek olan veri kümeleriyle çalışırken, veri kaynağının seçeneğinin daha küçük bir değere 12 ayarlanmasıminZoom, işlem miktarını, gerçekleşen yerel kutucuk oluşturmayı ve veri kaynağı tarafından kullanılan belleği azaltır ve performansı artırır.

GeoJSON yanıtlarını simge durumuna küçültme

GeoJSON verilerini bir hizmet aracılığıyla veya düz bir dosya yükleyerek bir sunucudan yüklerken, indirme boyutunu gerekenden daha büyük hale getiren gereksiz boşluk karakterlerini kaldırmak için verilerin simge durumuna küçültülmüş olduğundan emin olun.

URL kullanarak ham GeoJSON'a erişme

GeoJSON nesnelerini JavaScript'in içinde satır içinde depolamak mümkündür, ancak kopyaları bu nesne için oluşturduğunuz değişkende ve ayrı bir web çalışanı içinde yöneten veri kaynağı örneğinde depolandığından daha fazla bellek kullanır. Bunun yerine bir URL kullanarak GeoJSON'ı uygulamanızda kullanıma sunun ve veri kaynağı verilerin tek bir kopyasını doğrudan veri kaynakları web çalışanına yükler.

İşleme katmanlarını iyileştirme

Azure haritalar, bir haritadaki verileri işlemek için birkaç farklı katman sağlar. Bu katmanları senaryonuza göre uyarlamak için performansları ve genel kullanıcı deneyimini artırmak için yararlanabileceğiniz birçok iyileştirme vardır.

Katmanları bir kez oluşturma ve yeniden kullanma

Azure Haritalar Web SDK'sı veri temellidir. Veriler, daha sonra işleme katmanlarına bağlanan veri kaynaklarına gider. Haritadaki verileri değiştirmek istiyorsanız, veri kaynağındaki verileri güncelleştirin veya katmandaki stil seçeneklerini değiştirin. Bu genellikle her değişiklikle katmanları yeniden oluşturarak kaldırmaktan daha hızlıdır.

Simge katmanı üzerinde kabarcık katmanını düşünün

Kabarcık katmanı, noktaları harita üzerinde daire olarak işler ve veri temelli bir ifade kullanarak yarıçaplarını ve renklerini kolayca şekillendirebilir. Daire, WebGL'nin çizebileceği basit bir şekil olduğundan, işleme altyapısı bunları bir simge katmanından daha hızlı işleyip görüntü yükleyip işlemesi gerekir. Bu iki işleme katmanının performans farkı, on binlerce nokta işlenirken fark edilir.

HTML işaretçilerini ve Açılan pencereleri tedbirli kullanma

Azure Haritalar Web denetiminde işleme için WebGL kullanan çoğu katmanın aksine, HTML İşaretçileri ve Açılan Pencereleri işleme için geleneksel DOM öğelerini kullanır. Bu nedenle, sayfayı ne kadar çok HTML işaretçisi ve Açılır Pencere eklerse, o kadar çok DOM öğesi vardır. Birkaç yüz HTML işaretçisi veya açılır pencere ekledikten sonra performans düşebilir. Daha büyük veri kümeleri için verilerinizi kümeleme veya bir sembol ya da kabarcık katmanı kullanmayı göz önünde bulundurun.

Birden Çok Pin ile Yeniden Kullanma Açılır Penceresi kod örneği, tek bir açılır pencere oluşturmayı ve içeriğini ve konumunu güncelleştirerek yeniden kullanmayı gösterir. Kaynak kodu için bkz . Birden Çok Pin ile Açılan Pencere Yeniden Kullanma örnek kodu.

A screenshot of a map of Seattle with three blue pins, demonstrating how to Reuse Popups with Multiple Pins.

Bu, haritada işlenecek yalnızca birkaç noktanız varsa, HTML işaretçilerinin basitliği tercih edilebilir. Ayrıca, GEREKIRSE HTML işaretçileri kolayca sürüklenebilir hale getirilebilir.

Katmanları birleştirme

Harita yüzlerce katmanı işleme yeteneğine sahiptir, ancak ne kadar çok katman varsa, bir sahneyi işlemek için o kadar fazla zaman alır. Katman sayısını azaltmaya yönelik stratejilerden biri, benzer stiller içeren veya veri temelli stiller kullanılarak stillendirilebilen katmanları birleştirmektir.

Örneğin, tüm özelliklerin veya falsedeğerine true sahip olabilecek bir isHealthy özelliğe sahip olduğu bir veri kümesi düşünün. Bu özelliği temel alarak farklı renkli kabarcıklar işleyen bir kabarcık katmanı oluşturuyorsanız, bunu aşağıdaki listede gösterildiği gibi yapmanın en düşük performanstan en yüksek performansa kadar çeşitli yolları vardır.

  • Verileri değere göre isHealthy iki veri kaynağına bölün ve her veri kaynağına sabit kodlanmış renk seçeneğine sahip bir kabarcık katmanı ekleyin.
  • Tüm verileri tek bir veri kaynağına yerleştirin ve sabit kodlanmış renk seçeneği ve özelliğine dayalı isHealthy bir filtre ile iki kabarcık katmanı oluşturun.
  • Tüm verileri tek bir veri kaynağına yerleştirin, özelliğine göre isHealthy renk seçeneği için bir stil ifadesiyle tek bir case kabarcık katmanı oluşturun. Bunu gösteren bir kod örneği aşağıda verilmiştir.
var layer = new atlas.layer.BubbleLayer(source, null, {
    color: [
        'case',

        //Get the 'isHealthy' property from the feature.
        ['get', 'isHealthy'],

        //If true, make the color 'green'. 
        'green',

        //If false, make the color red.
        'red'
    ]
});

Düz simge katmanı animasyonları oluşturma

Sembol katmanlarında varsayılan olarak çarpışma algılama etkindir. Bu çarpışma algılama, iki simgenin çakışmamasını sağlamayı amaçlar. Simge katmanının simge ve metin seçenekleri iki seçeneğe sahiptir:

  • allowOverlap - simgenin diğer simgelerle çakıldığında görünür olup olmadığını belirtir.
  • ignorePlacement - diğer simgelerin simgeyle çarpışmasına izin verilip verilmediğini belirtir.

Bu seçeneklerin her ikisi de varsayılan olarak olarak ayarlanır false . Bir simgeyi canlandırırken, çarpışma algılama hesaplamaları animasyonun her karesinde çalıştırılır ve bu da animasyonu yavaşlatabilir ve daha az akıcı görünmesini sağlayabilir. Animasyonu düzeltmek için bu seçenekleri olarak trueayarlayın.

Basit Sembol Animasyonu kod örneği, sembol katmanına animasyon eklemenin basit bir yolunu gösterir. Bu örneğin kaynak kodu için bkz . Basit Sembol Animasyonu örnek kodu.

A screenshot of a map of the world with a symbol going in a circle, demonstrating how to animate the position of a symbol on the map by updating the coordinates.

Yakınlaştırma düzeyi aralığını belirtme

Verileriniz aşağıdaki ölçütlerden birini karşılıyorsa, işleme altyapısının yakınlaştırma düzeyi aralığının dışındayken bunu atlayabilmesi için katmanın en düşük ve en yüksek yakınlaştırma düzeyini belirttiğinizden emin olun.

  • Veriler bir vektör kutucuğu kaynağından geliyorsa, genellikle farklı veri türleri için kaynak katmanlar yalnızca bir dizi yakınlaştırma düzeyi aracılığıyla kullanılabilir.
  • 0 ile 24 arasında tüm yakınlaştırma düzeyleri için kutucuk içermeyen bir kutucuk katmanı kullanıyorsanız ve bunun yalnızca kutucuklara sahip olduğu düzeylerde işlenmesini ve eksik kutucukları diğer yakınlaştırma düzeylerindeki kutucuklarla doldurmayı denememesini istiyorsanız.
  • Bir katmanı yalnızca belirli yakınlaştırma düzeylerinde işlemek istiyorsanız. Tüm katmanların, bu mantığı maxZoom > zoom >= minZoomtemel alan bu yakınlaştırma düzeyleri arasında katmanın işlendiği bir minZoom ve maxZoom seçeneği vardır.

Örnek

//Only render this layer between zoom levels 1 and 9. 
var layer = new atlas.layer.BubbleLayer(dataSource, null, {
    minZoom: 1,
    maxZoom: 10
});

Kutucuk katmanı sınırlarını ve kaynak yakınlaştırma aralığını belirtme

Kutucuk katmanları varsayılan olarak tüm dünya genelinde kutucukları yükler. Ancak, kutucuk hizmetinde yalnızca belirli bir alan için kutucuklar varsa, harita bu alanın dışındayken kutucukları yüklemeye çalışır. Bu durumda, her kutucuk için bir istek yapılır ve harita tarafından yapılan diğer istekleri engelleyebilecek ve böylece diğer katmanların işlenmesini yavaşlatabilecek bir yanıt bekler. Bir kutucuk katmanının sınırlarının belirtilmesi, haritanın yalnızca bu sınırlayıcı kutunun içindeki kutucukları istemesine neden olur. Ayrıca, kutucuk katmanı yalnızca belirli yakınlaştırma düzeyleri arasında kullanılabiliyorsa, aynı nedenle en düşük ve en fazla kaynak yakınlaştırmasını belirtin.

Örnek

var tileLayer = new atlas.layer.TileLayer({
    tileUrl: 'myTileServer/{z}/{y}/{x}.png',
    bounds: [-101.065, 14.01, -80.538, 35.176],
    minSourceZoom: 1,
    maxSourceZoom: 10
});

Temel harita görünür olmadığında boş harita stili kullanma

Harita üzerinde temel haritayı tamamen kapsayan bir katman varsa, temel haritanın işlenmemesi için blank harita stilini olarak veya blank_accessible olarak ayarlamayı göz önünde bulundurun. Bunu yapmak için yaygın bir senaryo, üzerinde tam küre kutucuğunun yer paylaşımının temel haritanın üzerinde opaklık veya saydam alan olmamasıdır.

Görüntü veya kutucuk katmanlarına sorunsuz animasyon ekleme

Haritadaki bir dizi resim veya kutucuk katmanında animasyon eklemek istiyorsanız. Her resim veya kutucuk katmanı için katman oluşturmak ve opaklığı değiştirmek, her animasyon karesinde tek bir katmanın kaynağını güncelleştirmekten daha hızlıdır. Opaklığı sıfıra ayarlayarak ve opaklığını sıfırdan büyük bir değere ayarlayarak yeni bir katman göstererek katmanı gizlemek, katmandaki kaynağı güncelleştirmekten daha hızlıdır. Alternatif olarak, katmanların görünürlüğü değiştirilebilir, ancak katmanın solma süresini sıfır olarak ayarladığınızdan emin olun; aksi takdirde, katman görüntülenirken katmana animasyon ekler ve bu da önceki katman yeni katman görünmeden önce gizleneceğinden titreme etkisine neden olur.

Tweak Symbol katmanı çarpışma algılama mantığı

Simge katmanında hem simge hem de ve adlı allowOverlapignorePlacementmetin için iki seçenek vardır. Bu iki seçenek, simgenin veya simge metninin çakışabileceğini veya çakışabileceğini belirtir. Bunlar olarak falseayarlandığında, simge katmanı, katmanda önceden işlenmiş başka bir simgeyle çakışıp çakışmadığını görmek için her noktayı işlerken hesaplamalar yapar ve varsa, çarpışma simgesini işlemez. Bu, haritadaki dağınıklığı azaltmak ve işlenen nesne sayısını azaltmak için iyidir. Bu seçenekler olarak falseayarlanarak, bu çakışma algılama mantığı atlanır ve tüm simgeler haritada işlenir. Performans ve kullanıcı deneyiminin en iyi birleşimini elde etmek için bu seçeneği değiştirin.

Küme büyük nokta veri kümeleri

Büyük veri noktası kümeleriyle çalışırken, belirli yakınlaştırma düzeylerinde işlendiğinde noktaların çoğunun çakıştığını ve kısmen görünür olduğunu fark edebilirsiniz. Kümeleme, birbirine yakın olan ve bunları tek bir kümelenmiş nokta olarak temsil eden noktaları gruplandırma işlemidir. Kullanıcı haritayı yakınlaştırdıkça, kümeler kendi noktalarına ayrılır. Bu, işlenmesi gereken veri miktarını önemli ölçüde azaltabilir, haritanın daha az dağınık hissetmesini sağlayabilir ve performansı artırabilir. sınıfı, DataSource verileri yerel olarak kümeleme seçeneklerine sahiptir. Ayrıca, vektör kutucukları oluşturan birçok araçta kümeleme seçenekleri de vardır.

Ayrıca, performansı artırmak için küme yarıçapının boyutunu artırın. Küme yarıçapı ne kadar büyükse, izlenmesi ve işlenmesi gereken kümelenmiş noktalar o kadar az olur. Daha fazla bilgi için bkz . Web SDK'sında kümeleme noktası verileri.

Ağırlıklı kümelenmiş ısı haritalarını kullanma

Isı haritası katmanı, on binlerce veri noktası kolayca işleyebilir. Daha büyük veri kümeleri için, veri kaynağında kümelemayı etkinleştirmeyi ve küçük bir küme yarıçapı kullanmayı göz önünde bulundurun ve kümeler point_count özelliğini yükseklik haritası için ağırlık olarak kullanın. Küme yarıçapı boyutu yalnızca birkaç piksel olduğunda, işlenen ısı haritasında çok az görsel fark vardır. Daha büyük bir küme yarıçapı kullanmak performansı daha iyi hale getirir ancak işlenen ısı haritasının çözünürlüğünü azaltabilir.

var layer = new atlas.layer.HeatMapLayer(source, null, {
   weight: ['get', 'point_count']
});

Daha fazla bilgi için bkz . Kümeleme ve ısı haritaları katmanı.

Görüntü kaynaklarını küçük tutma

Simgeler bir sembol katmanında veya çokgen bir katmandaki desenlerde işlemek için haritalar görüntüsü spritesine resimler eklenebilir. İndirilmesi gereken veri miktarını ve harita görüntüsü spritesinde kapladıkları alan miktarını en aza indirmek için bu görüntüleri küçük tutun. seçeneğini kullanarak size simgeyi ölçeklendirin bir simge katmanı kullanırken, planınızın haritada görüntüleneceği boyut üst sınırı olan ve daha büyük olmayan bir görüntü kullanın. Bu, simgenin yüksek çözünürlükte işlenmesini sağlarken kullandığı kaynakları en aza indirir. Ayrıca, SVG'ler basit simge görüntüleri için daha küçük bir dosya biçimi olarak da kullanılabilir.

İfadeleri iyileştirme

Veri temelli stil ifadeleri , haritadaki verileri filtrelemek ve şekillendirmek için esneklik ve güç sağlar. İfadelerin iyileştirilebileceği birçok yol vardır. İşte birkaç ipucu.

Filtrelerin karmaşıklığını azaltma

Filtreler bir veri kaynağındaki tüm veriler üzerinde döngü oluşturur ve her filtrenin filtredeki mantıkla eşleşip eşleşmediğini denetler. Filtreler karmaşık hale gelirse bu durum performans sorunlarına neden olabilir. Bu sorunu gidermeye yönelik bazı olası stratejiler şunlardır.

  • Vektör kutucukları kullanıyorsanız verileri farklı kaynak katmanlara bölün.
  • sınıfını DataSource kullanıyorsanız, bu verileri ayrı veri kaynaklarına ayırın. Veri kaynaklarının sayısını filtrenin karmaşıklığıyla dengelemeye çalışın. Çok fazla veri kaynağı da performans sorunlarına neden olabilir, bu nedenle senaryonuz için en uygun olanı bulmak için bazı testler yapmanız gerekebilir.
  • Katmanda karmaşık bir filtre kullanırken, filtrenin karmaşıklığını azaltmak için stil ifadeleriyle birden çok katman kullanmayı göz önünde bulundurun. Stil ifadeleri çok sayıda katman olarak kullanılabildiğinde performans sorunlarına da neden olabileceği durumlarda, sabit kodlanmış stiller içeren bir dizi katman oluşturmaktan kaçının.

İfadelerin hata oluşturmadığından emin olun

İfadeler genellikle işleme zamanında hesaplamalar veya mantıksal işlemler gerçekleştirmek için kod oluşturmak için kullanılır. Uygulamanızın geri kalanındaki kodda olduğu gibi hesaplamaların ve mantıksal değerlerin mantıklı olduğundan ve hataya açık olmadığından emin olun. İfadelerdeki hatalar ifadeyi değerlendirirken sorunlara neden olur ve bu da performansın ve işleme sorunlarının azalmasına neden olabilir.

Dikkat edilmesi gereken yaygın hatalardan biri, tüm özelliklerde mevcut olmayabilecek bir özellik özelliğine dayalı bir ifadeye sahip olmaktır. Örneğin aşağıdaki kod, kabarcık katmanının renk özelliğini özelliğine ayarlamak için myColor bir ifade kullanır.

var layer = new atlas.layer.BubbleLayer(source, null, {
    color: ['get', 'myColor']
});

Yukarıdaki kod, veri kaynağındaki tüm özelliklerin bir myColor özelliği varsa ve bu özelliğin değeri bir renkse sorunsuz çalışır. Veri kaynağındaki verilerin tam denetimine sahipseniz ve bazı özelliklerin bir özellikte myColor geçerli bir renge sahip olduğunu biliyorsanız bu sorun olmayabilir. Bununla birlikte, bu kodu hatalardan güvenli hale getirmek için, özelliğin has özelliğine sahip myColor olup olmadığını denetlemek için ifadeyle birlikte bir case ifade kullanılabilir. Bu durumda tür ifadesi, to-color bu özelliğin değerini bir renge dönüştürmeyi denemek için kullanılabilir. Renk geçersizse, geri dönüş rengi kullanılabilir. Aşağıdaki kod bunun nasıl yapılacağını gösterir ve geri dönüş rengini yeşil olarak ayarlar.

var layer = new atlas.layer.BubbleLayer(source, null, {
    color: [
        'case',

        //Check to see if the feature has a 'myColor' property.
        ['has', 'myColor'],

        //If true, try validating that 'myColor' value is a color, or fallback to 'green'. 
        ['to-color', ['get', 'myColor'], 'green'],

        //If false, return a fallback value.
        'green'
    ]
});

Boole ifadelerini en özelden en az belirliye sırala

Birden çok koşullu test içeren boole ifadelerini kullanırken gereken koşullu testlerin toplam sayısını en fazladan en az belirliye sıralayarak azaltın.

İfadeleri basitleştirme

İfadeler güçlü ve bazen karmaşık olabilir. İfade ne kadar basit olursa, o kadar hızlı değerlendirilir. Örneğin, basit bir karşılaştırma gerekiyorsa, gibi ['==', ['get', 'category'], 'restaurant'] bir ifade gibi ['match', ['get', 'category'], 'restaurant', true, false]bir eşleşme ifadesi kullanmaktan daha iyi olabilir. Bu durumda, denetlenen özellik bir boole değeriyse, bir get ifade daha ['get','isRestaurant']da basit olur.

Web SDK sorunlarını giderme

Aşağıda, Azure Haritalar Web SDK'sı ile geliştirme sırasında karşılaşılan bazı yaygın sorunlarda hata ayıklamaya yönelik bazı ipuçları yer alır.

Web denetimini yüklediğimde harita neden görüntülenmiyor?

Denetlenecek şeyler:

  • Kimlik doğrulama seçeneklerinizi haritada tamamladığınızdan emin olun. Kimlik doğrulaması olmadan, harita boş bir tuval yükler ve tarayıcının geliştirici araçlarının ağ sekmesinde bir 401 hatası döndürür.
  • İnternet bağlantınız olduğundan emin olun.
  • Tarayıcının geliştirici araçlarının hataları için konsolu denetleyin. Bazı hatalar eşlemenin işlenmediğine neden olabilir. Uygulamanızda hata ayıklama.
  • Desteklenen bir tarayıcı kullandığınızdan emin olun.

Tüm verilerim dünyanın diğer ucunda görünüyor, neler oluyor?

konum olarak da adlandırılan koordinatlar, Azure Haritalar SDK'larında jeo-uzamsal endüstri standart biçimiyle [longitude, latitude]uyumludur. Aynı biçim, koordinatların GeoJSON şemasında nasıl tanımlandığıdır; Azure Haritalar SDK'ları içinde kullanılan çekirdek verileri. Verileriniz dünyanın karşı tarafında görünüyorsa, bunun nedeni büyük olasılıkla koordinat/konum bilginizde boylam ve enlem değerlerinin ters çevrilmesidir.

HTML işaretçileri neden web denetiminde yanlış yerde görünüyor?

Denetlenecek şeyler:

  • İşaretçi için özel içerik kullanıyorsanız ve pixelOffset seçeneklerinin anchor doğru olduğundan emin olun. Varsayılan olarak, içeriğin alt ortası haritadaki konumla hizalanır.
  • Azure Haritalar için CSS dosyasının yüklendiğinden emin olun.
  • Uygulamanızdan herhangi bir CSS'nin kendisini işaretçiye ekleyip eklemediğini ve konumunu etkileyip etkilemediğini görmek için HTML işaretçisi DOM öğesini inceleyin.

Simge katmanındaki simgeler veya metinler neden yanlış yerde görünüyor?

ve seçeneklerinin anchoroffset , görüntünüzün veya metninizin haritadaki koordinatla hizalanmasını istediğiniz bölümle uyumlu olacak şekilde doğru yapılandırılıp yapılandırılmadığını denetleyin. Simge yalnızca harita döndürüldüğünde yerinde değilse seçeneği işaretleyin rotationAlignment . Varsayılan olarak, simgeler haritalar görünüm penceresiyle döndürülür ve kullanıcıya doğru görünür. Ancak senaryonuza bağlı olarak, seçeneğini olarak ayarlayarak simgeyi haritanın yönlendirmesine kilitlemek rotationAlignmentmaptercih edilebilir.

Simge yalnızca harita eğimli/eğimli olduğunda yer dışındaysa seçeneği işaretleyin pitchAlignment . Varsayılan olarak, harita eğimli veya eğimli olduğunda simgeler harita görünüm penceresi içinde dik kalır. Ancak senaryonuza bağlı olarak, seçeneğini mapolarak ayarlayarak simgeyi haritanın perdesine kilitlemek pitchAlignment istenebilir.

Verilerimin hiçbiri neden haritada görünmüyor?

Denetlenecek şeyler:

  • Hatalar için tarayıcının geliştirici araçlarında konsolu denetleyin.
  • Bir veri kaynağının oluşturulup haritaya eklendiğinden ve veri kaynağının da haritaya eklenmiş bir işleme katmanına bağlandığından emin olun.
  • Kodunuza kesme noktaları ekleyin ve bu noktada ilerleyin. Verilerin veri kaynağına eklendiğinden ve veri kaynağı ile katmanların haritaya eklendiğinden emin olun.
  • İşleme katmanınızdan veri temelli ifadeleri kaldırmayı deneyin. Bunlardan birinde soruna neden olan bir hata olabilir.

korumalı bir iframe'de Azure Haritalar Web SDK'sını kullanabilir miyim?

Evet.

Destek alma

Aşağıdakiler, sorununuza bağlı olarak Azure Haritalar için destek almanın farklı yollarıdır.

Veri sorununu veya adresle ilgili bir sorunu Nasıl yaparım? bildirin?

Azure Haritalar geri bildirim sitesini kullanarak sorunları bildirin. Veri sorunlarını raporlama hakkında ayrıntılı yönergeler, Azure Haritalar veri geri bildirimi sağlama makalesinde sağlanır.

Dekont

Gönderilen her sorun, bunu izlemek için benzersiz bir URL oluşturur. Çözüm süreleri, sorun türüne ve değişikliğin doğru olduğunu doğrulamak için gereken süreye bağlı olarak değişir. Değişiklikler işleme hizmetleri haftalık güncelleştirmesinde görünürken, coğrafi kodlama ve yönlendirme gibi diğer hizmetler aylık olarak güncelleştirilir.

Nasıl yaparım? hizmette veya API'de hata bildirildi mi?

Destek isteği oluştur düğmesini seçerek Azure'ın Yardım + destek sayfasında sorunları bildirin.

Azure Haritalar için nereden teknik yardım alabilirim?

  • Azure Haritalar Power BI görseli ile ilgili sorular için Power BI desteğine başvurun.

  • Diğer tüm Azure Haritalar hizmetleri için Azure desteği başvurun.

  • Belirli Azure Haritalar Özellikleriyle ilgili sorular veya yorumlar için Azure Haritalar geliştirici forumlarını kullanın.

Sonraki adımlar

Uygulamanızdaki kullanıcı deneyimini iyileştirme hakkında daha fazla ipucu için aşağıdaki makalelere bakın.

Azure Haritalar ve jeo-uzamsal endüstri tarafından kullanılan terminoloji hakkında daha fazla bilgi edinin.