Update and bug fix

Fix more layering issues related to Azure Maps base style changes. Updated to version 3 of the Azure Maps Web SDK.
microsoft · Oct 4, 2023 · bceabd1 · bceabd1
1 parent bed0879
commit bceabd1
Show file tree

Hide file tree

Showing 5 changed files with 17 additions and 19 deletions.
diff --git a/src/labeler.html b/src/labeler.html
@@ -8,7 +8,7 @@
 	<title>Spatial imagery labeler tool</title>
 
 	<!-- Add Azure Maps CSS files. -->
-	<link rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/mapcontrol/2/atlas.min.css"/>
+	<link rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.css"/>
 	<link rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/drawing/1/atlas-drawing.min.css" />
 
 	<!-- Add fonts CSS files. -->
@@ -244,7 +244,7 @@ <h1 id="appTitle"></h1>
 	</div>
 
 	<!-- Add Azure Maps libraries -->
-	<script src="https://atlas.microsoft.com/sdk/javascript/mapcontrol/2/atlas.min.js"></script>
+	<script src="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.js"></script>
     	<script src="https://atlas.microsoft.com/sdk/javascript/drawing/1/atlas-drawing.min.js"></script>
     	<script src="https://atlas.microsoft.com/sdk/javascript/spatial/0/atlas-spatial.min.js"></script>
 

diff --git a/src/modules/projectBuilder.js b/src/modules/projectBuilder.js
@@ -170,12 +170,7 @@ export class ProjectBuilderApp {
         map.map.getSource(gridSource.getId()).promoteId = '_azureMapsShapeId';
 
         //Create a layer to display the area of a grid cell.
-        const gridLayer = new atlas.layer.PolygonLayer(gridSource, null, {
-            //Color based on the availability of layers in each cell. 
-            fill: [
-
-            ]
-        });
+        const gridLayer = new atlas.layer.PolygonLayer(gridSource);
 
         //Create a layer to display the outline of a grid cell.
         const gridOutlineLayer = new atlas.layer.LineLayer(gridSource, null, {

diff --git a/src/modules/utils.js b/src/modules/utils.js
@@ -402,6 +402,15 @@ export class Utils {
                 })
         });
     }
+    static setBaseTransitLayer(map) {
+        if(map && Utils.#BaseTranistLayer === null) {
+            app.map.layers.layerIndex.forEach((l) => {
+                if(Utils.#BaseTranistLayer === null && ((l.options && l.options.lineCap) || l.id === 'transit' || l.id === 'roads' || l.id.startsWith('microsoft.bing.maps.roadDetails.road'))) {
+                    Utils.#BaseTranistLayer = l.id ;
+                } 
+            });
+        }
+    }
 
     /**
      * Inflates a layer from a config file and adds it to the map. 
@@ -417,13 +426,7 @@ export class Utils {
             //Ensure layer doesn't already exist in the map.
             layer = map.layers.getLayerById(name);
 
-            if(Utils.#BaseTranistLayer === null) {
-                app.map.layers.layerIndex.forEach((l) => {
-                    if(Utils.#BaseTranistLayer === null && (l.id === 'transit' || l.id === 'roads' || l.id.startsWith('microsoft.bing.maps.roadDetails.road'))) {
-                        Utils.#BaseTranistLayer = l.id ;
-                    } 
-                });
-            }
+            Utils.setBaseTransitLayer(map);
 
             if (!layer) {
                 switch (options.type) {

diff --git a/src/projectBuilder.html b/src/projectBuilder.html
@@ -8,7 +8,7 @@
 	<title>Spatial imagery labeling project builder</title>
 
 	<!-- Add Azure Maps CSS files. -->
-	<link rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/mapcontrol/2/atlas.min.css"/>
+	<link rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.css"/>
 	<link rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/drawing/1/atlas-drawing.min.css" />
 
 	<!-- Add fonts CSS files. -->
@@ -179,7 +179,7 @@ <h2>Step 5: Complete</h2>
 	</div>
 
 	<!-- Add Azure Maps libraries -->
-	<script src="https://atlas.microsoft.com/sdk/javascript/mapcontrol/2/atlas.min.js"></script>
+	<script src="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.js"></script>
     <script src="https://atlas.microsoft.com/sdk/javascript/drawing/1/atlas-drawing.min.js"></script>
     <script src="https://atlas.microsoft.com/sdk/javascript/spatial/0/atlas-spatial.js"></script>
 

diff --git a/src/projectViewer.html b/src/projectViewer.html
@@ -8,7 +8,7 @@
 	<title>Spatial imagery labeling project viewer</title>
 
 	<!-- Add Azure Maps CSS files. -->
-	<link rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/mapcontrol/2/atlas.min.css"/>
+	<link rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.css"/>
 	<link rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/drawing/1/atlas-drawing.min.css" />
 
 	<!-- Add fonts CSS files. -->
@@ -55,7 +55,7 @@ <h1 id="appTitle">Spatial imagery labeling project viewer</h1>
 	</div>
 
 	<!-- Add Azure Maps libraries -->
-	<script src="https://atlas.microsoft.com/sdk/javascript/mapcontrol/2/atlas.min.js"></script>
+	<script src="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.js"></script>
     <script src="https://atlas.microsoft.com/sdk/javascript/drawing/1/atlas-drawing.min.js"></script>
     <script src="https://atlas.microsoft.com/sdk/javascript/spatial/0/atlas-spatial.js"></script>