@basemaps/landing 8.5.0 → 8.6.0

package/dist/docs/user-guide/{how-to-use-and-customize-vector-tiles → working-with-vector-tiles}/index.html

@@ -8,13 +8,13 @@
       
       
       
-        <link rel="canonical" href="http://localhost:8000/docs/user-guide/how-to-use-and-customize-vector-tiles/">
+        <link rel="canonical" href="http://localhost:8000/docs/user-guide/working-with-vector-tiles/">
       
       
-        <link rel="prev" href="../technical-documentation/">
+        <link rel="prev" href="../use-in-esri-software/how-to-add-linz-basemaps-to-arcgis-online-basemaps/">
       
       
-        <link rel="next" href="_How-to-use-vector-tiles/">
+        <link rel="next" href="creation/">
       
       
       <link rel="icon" href="../../assets/images/favicon.png">
@@ -22,7 +22,7 @@
     
     
       
-        <title>About Vector Tiles - LINZ Basemaps</title>
+        <title>Working with Vector Tiles - LINZ Basemaps</title>
       
     
     
@@ -86,7 +86,7 @@
     <div data-md-component="skip">
       
         
-        <a href="#about-vector-tiles" class="md-skip">
+        <a href="#working-with-vector-tiles" class="md-skip">
           Skip to content
         </a>
       
@@ -121,7 +121,7 @@
         <div class="md-header__topic" data-md-component="header-topic">
           <span class="md-ellipsis">
             
-              About Vector Tiles
+              Working with Vector Tiles
             
           </span>
         </div>
@@ -1037,8 +1037,6 @@
                 
   
   
-    
-  
   
   
     
@@ -1047,6 +1045,10 @@
         
           
         
+      
+        
+      
+        
       
         
       
@@ -1055,36 +1057,36 @@
     
     
     
-    <li class="md-nav__item md-nav__item--active md-nav__item--nested">
+    <li class="md-nav__item md-nav__item--nested">
       
         
         
-        <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_8_4" checked>
+        <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_8_4" >
         
           
           
           <div class="md-nav__link md-nav__container">
-            <a href="./" class="md-nav__link md-nav__link--active">
+            <a href="../use-in-esri-software/" class="md-nav__link ">
               
   
   <span class="md-ellipsis">
-    How to use and customize vector tiles
+    Use in Esri software
   </span>
   
 
             </a>
             
               
-              <label class="md-nav__link md-nav__link--active" for="__nav_8_4" id="__nav_8_4_label" tabindex="0">
+              <label class="md-nav__link " for="__nav_8_4" id="__nav_8_4_label" tabindex="0">
                 <span class="md-nav__icon md-icon"></span>
               </label>
             
           </div>
         
-        <nav class="md-nav" data-md-level="2" aria-labelledby="__nav_8_4_label" aria-expanded="true">
+        <nav class="md-nav" data-md-level="2" aria-labelledby="__nav_8_4_label" aria-expanded="false">
           <label class="md-nav__title" for="__nav_8_4">
             <span class="md-nav__icon md-icon"></span>
-            How to use and customize vector tiles
+            Use in Esri software
           </label>
           <ul class="md-nav__list" data-md-scrollfix>
             
@@ -1115,11 +1117,11 @@
           
           
           <div class="md-nav__link md-nav__container">
-            <a href="_How-to-use-vector-tiles/" class="md-nav__link ">
+            <a href="../use-in-esri-software/how-to-add-emergency-imagery-to-arcgis/" class="md-nav__link ">
               
   
   <span class="md-ellipsis">
-     How to use vector tiles
+    How to add emergency imagery in ArcGIS
   </span>
   
 
@@ -1130,7 +1132,7 @@
         <nav class="md-nav" data-md-level="3" aria-labelledby="__nav_8_4_2_label" aria-expanded="false">
           <label class="md-nav__title" for="__nav_8_4_2">
             <span class="md-nav__icon md-icon"></span>
-             How to use vector tiles
+            How to add emergency imagery in ArcGIS
           </label>
           <ul class="md-nav__list" data-md-scrollfix>
             
@@ -1169,11 +1171,11 @@
           
           
           <div class="md-nav__link md-nav__container">
-            <a href="how-to-customize-vector-tiles/" class="md-nav__link ">
+            <a href="../use-in-esri-software/how-to-add-individual-linz-basemaps-layers-to-arcgis/" class="md-nav__link ">
               
   
   <span class="md-ellipsis">
-    How to customize vector tiles
+    How to add individual LINZ Basemap layers to ArcGIS
   </span>
   
 
@@ -1184,7 +1186,7 @@
         <nav class="md-nav" data-md-level="3" aria-labelledby="__nav_8_4_3_label" aria-expanded="false">
           <label class="md-nav__title" for="__nav_8_4_3">
             <span class="md-nav__icon md-icon"></span>
-            How to customize vector tiles
+            How to add individual LINZ Basemap layers to ArcGIS
           </label>
           <ul class="md-nav__list" data-md-scrollfix>
             
@@ -1198,14 +1200,6 @@
 
               
             
-          </ul>
-        </nav>
-      
-    </li>
-  
-
-              
-            
               
                 
   
@@ -1217,14 +1211,6 @@
       
         
           
-        
-      
-        
-      
-        
-      
-        
-      
         
       
     
@@ -1234,37 +1220,40 @@
       
         
         
-        <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_8_5" >
+        <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_8_4_4" >
         
           
           
           <div class="md-nav__link md-nav__container">
-            <a href="../use-in-esri-software/" class="md-nav__link ">
+            <a href="../use-in-esri-software/how-to-add-linz-aerial-imagery-basemaps-to-arcgis-online/" class="md-nav__link ">
               
   
   <span class="md-ellipsis">
-    Use in esri software
+    How to add LINZ aerial imagery Basemaps to ArcGIS Online
   </span>
   
 
             </a>
             
-              
-              <label class="md-nav__link " for="__nav_8_5" id="__nav_8_5_label" tabindex="0">
-                <span class="md-nav__icon md-icon"></span>
-              </label>
-            
           </div>
         
-        <nav class="md-nav" data-md-level="2" aria-labelledby="__nav_8_5_label" aria-expanded="false">
-          <label class="md-nav__title" for="__nav_8_5">
+        <nav class="md-nav" data-md-level="3" aria-labelledby="__nav_8_4_4_label" aria-expanded="false">
+          <label class="md-nav__title" for="__nav_8_4_4">
             <span class="md-nav__icon md-icon"></span>
-            Use in esri software
+            How to add LINZ aerial imagery Basemaps to ArcGIS Online
           </label>
           <ul class="md-nav__list" data-md-scrollfix>
             
               
             
+          </ul>
+        </nav>
+      
+    </li>
+  
+
+              
+            
               
                 
   
@@ -1285,16 +1274,16 @@
       
         
         
-        <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_8_5_2" >
+        <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_8_4_5" >
         
           
           
           <div class="md-nav__link md-nav__container">
-            <a href="../use-in-esri-software/how-to-add-emergency-imagery-to-arcgis/" class="md-nav__link ">
+            <a href="../use-in-esri-software/how-to-add-linz-basemaps-to-arcgis-online-basemaps/" class="md-nav__link ">
               
   
   <span class="md-ellipsis">
-    How to add emergency imagery to arcgis
+    How to add LINZ Basemaps to ArcGIS Online Basemaps
   </span>
   
 
@@ -1302,10 +1291,10 @@
             
           </div>
         
-        <nav class="md-nav" data-md-level="3" aria-labelledby="__nav_8_5_2_label" aria-expanded="false">
-          <label class="md-nav__title" for="__nav_8_5_2">
+        <nav class="md-nav" data-md-level="3" aria-labelledby="__nav_8_4_5_label" aria-expanded="false">
+          <label class="md-nav__title" for="__nav_8_4_5">
             <span class="md-nav__icon md-icon"></span>
-            How to add emergency imagery to arcgis
+            How to add LINZ Basemaps to ArcGIS Online Basemaps
           </label>
           <ul class="md-nav__list" data-md-scrollfix>
             
@@ -1319,9 +1308,19 @@
 
               
             
+          </ul>
+        </nav>
+      
+    </li>
+  
+
+              
+            
               
                 
   
+  
+    
   
   
   
@@ -1330,49 +1329,54 @@
       
         
           
+        
+      
+        
+      
+        
+      
+        
+      
         
       
     
     
     
-    <li class="md-nav__item md-nav__item--nested">
+    <li class="md-nav__item md-nav__item--active md-nav__item--nested">
       
         
         
-        <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_8_5_3" >
+        <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_8_5" checked>
         
           
           
           <div class="md-nav__link md-nav__container">
-            <a href="../use-in-esri-software/how-to-add-individual-linz-basemaps-layers-to-arcgis/" class="md-nav__link ">
+            <a href="./" class="md-nav__link md-nav__link--active">
               
   
   <span class="md-ellipsis">
-    How to add individual linz basemaps layers to arcgis
+    Working with Vector Tiles
   </span>
   
 
             </a>
             
+              
+              <label class="md-nav__link md-nav__link--active" for="__nav_8_5" id="__nav_8_5_label" tabindex="0">
+                <span class="md-nav__icon md-icon"></span>
+              </label>
+            
           </div>
         
-        <nav class="md-nav" data-md-level="3" aria-labelledby="__nav_8_5_3_label" aria-expanded="false">
-          <label class="md-nav__title" for="__nav_8_5_3">
+        <nav class="md-nav" data-md-level="2" aria-labelledby="__nav_8_5_label" aria-expanded="true">
+          <label class="md-nav__title" for="__nav_8_5">
             <span class="md-nav__icon md-icon"></span>
-            How to add individual linz basemaps layers to arcgis
+            Working with Vector Tiles
           </label>
           <ul class="md-nav__list" data-md-scrollfix>
             
               
             
-          </ul>
-        </nav>
-      
-    </li>
-  
-
-              
-            
               
                 
   
@@ -1386,6 +1390,8 @@
           
         
       
+        
+      
     
     
     
@@ -1393,40 +1399,37 @@
       
         
         
-        <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_8_5_4" >
+        <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_8_5_2" >
         
           
           
           <div class="md-nav__link md-nav__container">
-            <a href="../use-in-esri-software/how-to-add-linz-aerial-imagery-basemaps-to-arcgis-online/" class="md-nav__link ">
+            <a href="creation/" class="md-nav__link ">
               
   
   <span class="md-ellipsis">
-    How to add linz aerial imagery basemaps to arcgis online
+    Creation
   </span>
   
 
             </a>
             
+              
+              <label class="md-nav__link " for="__nav_8_5_2" id="__nav_8_5_2_label" tabindex="0">
+                <span class="md-nav__icon md-icon"></span>
+              </label>
+            
           </div>
         
-        <nav class="md-nav" data-md-level="3" aria-labelledby="__nav_8_5_4_label" aria-expanded="false">
-          <label class="md-nav__title" for="__nav_8_5_4">
+        <nav class="md-nav" data-md-level="3" aria-labelledby="__nav_8_5_2_label" aria-expanded="false">
+          <label class="md-nav__title" for="__nav_8_5_2">
             <span class="md-nav__icon md-icon"></span>
-            How to add linz aerial imagery basemaps to arcgis online
+            Creation
           </label>
           <ul class="md-nav__list" data-md-scrollfix>
             
               
             
-          </ul>
-        </nav>
-      
-    </li>
-  
-
-              
-            
               
                 
   
@@ -1437,8 +1440,6 @@
     
       
         
-          
-        
       
     
     
@@ -1447,35 +1448,43 @@
       
         
         
-        <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_8_5_5" >
+        <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_8_5_2_2" >
         
           
-          
-          <div class="md-nav__link md-nav__container">
-            <a href="../use-in-esri-software/how-to-add-linz-basemaps-to-arcgis-online-basemaps/" class="md-nav__link ">
-              
+          <label class="md-nav__link" for="__nav_8_5_2_2" id="__nav_8_5_2_2_label" tabindex="0">
+            
   
   <span class="md-ellipsis">
-    How to add linz basemaps to arcgis online basemaps
+    Inputs
   </span>
   
 
-            </a>
-            
-          </div>
+            <span class="md-nav__icon md-icon"></span>
+          </label>
         
-        <nav class="md-nav" data-md-level="3" aria-labelledby="__nav_8_5_5_label" aria-expanded="false">
-          <label class="md-nav__title" for="__nav_8_5_5">
+        <nav class="md-nav" data-md-level="4" aria-labelledby="__nav_8_5_2_2_label" aria-expanded="false">
+          <label class="md-nav__title" for="__nav_8_5_2_2">
             <span class="md-nav__icon md-icon"></span>
-            How to add linz basemaps to arcgis online basemaps
+            Inputs
           </label>
           <ul class="md-nav__list" data-md-scrollfix>
             
               
-            
-          </ul>
-        </nav>
-      
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="creation/inputs/json-schema-file/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    JSON Schema File
+  </span>
+  
+
+      </a>
     </li>
   
 
@@ -1495,88 +1504,725 @@
     </li>
   
 
-    
-  </ul>
-</nav>
-                  </div>
-                </div>
-              </div>
-            
+              
             
               
-              <div class="md-sidebar md-sidebar--secondary" data-md-component="sidebar" data-md-type="toc" >
-                <div class="md-sidebar__scrollwrap">
-                  <div class="md-sidebar__inner">
-                    
-
-<nav class="md-nav md-nav--secondary" aria-label="Table of contents">
-  
+                
   
   
-    
   
   
-    <label class="md-nav__title" for="__toc">
-      <span class="md-nav__icon md-icon"></span>
-      Table of contents
-    </label>
-    <ul class="md-nav__list" data-md-component="toc" data-md-scrollfix>
+    
+    
       
-        <li class="md-nav__item">
-  <a href="#why-use-vector-tiles" class="md-nav__link">
-    <span class="md-ellipsis">
-      Why Use Vector Tiles?
-    </span>
-  </a>
-  
-</li>
+        
       
-        <li class="md-nav__item">
-  <a href="#which-linz-basemaps-maps-use-vector-tiles" class="md-nav__link">
-    <span class="md-ellipsis">
-      Which LINZ Basemaps Maps Use Vector Tiles?
-    </span>
-  </a>
-  
-</li>
+        
       
-    </ul>
+        
+      
+        
+      
+        
+      
+        
+      
+        
+      
+        
+      
+        
+      
+        
+      
+        
+      
+        
+      
+        
+      
+        
+      
+        
+      
+        
+      
+        
+      
+        
+      
+        
+      
+    
+    
+    
+    <li class="md-nav__item md-nav__item--nested">
+      
+        
+        
+        <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_8_5_3" >
+        
+          
+          <label class="md-nav__link" for="__nav_8_5_3" id="__nav_8_5_3_label" tabindex="0">
+            
   
-</nav>
-                  </div>
-                </div>
-              </div>
+  <span class="md-ellipsis">
+    Schema
+  </span>
+  
+
+            <span class="md-nav__icon md-icon"></span>
+          </label>
+        
+        <nav class="md-nav" data-md-level="3" aria-labelledby="__nav_8_5_3_label" aria-expanded="false">
+          <label class="md-nav__title" for="__nav_8_5_3">
+            <span class="md-nav__icon md-icon"></span>
+            Schema
+          </label>
+          <ul class="md-nav__list" data-md-scrollfix>
             
-          
-          
-            <div class="md-content" data-md-component="content">
-              <article class="md-content__inner md-typeset">
+              
                 
-                  
-
   
   
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/addresses/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    addresses
+  </span>
+  
 
-
-<h1 id="about-vector-tiles">About Vector Tiles</h1>
-<p>Vector tiles are a modern approach to delivering map data that offers significant advantages over traditional raster tiles. Unlike raster tiles which are pre-rendered images, vector tiles contain raw geographic data that can be styled dynamically on the client side. This means you can customize colors, labels, and visibility of features without requesting new tiles from the server.</p>
-<h2 id="why-use-vector-tiles">Why Use Vector Tiles?</h2>
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/aerialways/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    aerialways
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/boundaries/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    boundaries
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/buildings/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    buildings
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/contours/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    contours
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/dam_lines/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    dam_lines
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/ferries/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    ferries
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/land/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    land
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/parcel_boundaries/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    parcel_boundaries
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/pier_lines/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    pier_lines
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/place_labels/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    place_labels
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/pois/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    pois
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/public_transport/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    public_transport
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/sites/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    sites
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/street_labels/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    street_labels
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/street_polygons/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    street_polygons
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/streets/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    streets
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/water_lines/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    water_lines
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    <li class="md-nav__item">
+      <a href="schema/water_polygons/" class="md-nav__link">
+        
+  
+  <span class="md-ellipsis">
+    water_polygons
+  </span>
+  
+
+      </a>
+    </li>
+  
+
+              
+            
+          </ul>
+        </nav>
+      
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    
+    
+      
+        
+          
+        
+      
+    
+    
+    
+    <li class="md-nav__item md-nav__item--nested">
+      
+        
+        
+        <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_8_5_4" >
+        
+          
+          
+          <div class="md-nav__link md-nav__container">
+            <a href="styling/" class="md-nav__link ">
+              
+  
+  <span class="md-ellipsis">
+    Styling
+  </span>
+  
+
+            </a>
+            
+          </div>
+        
+        <nav class="md-nav" data-md-level="3" aria-labelledby="__nav_8_5_4_label" aria-expanded="false">
+          <label class="md-nav__title" for="__nav_8_5_4">
+            <span class="md-nav__icon md-icon"></span>
+            Styling
+          </label>
+          <ul class="md-nav__list" data-md-scrollfix>
+            
+              
+            
+          </ul>
+        </nav>
+      
+    </li>
+  
+
+              
+            
+              
+                
+  
+  
+  
+  
+    
+    
+      
+        
+          
+        
+      
+    
+    
+    
+    <li class="md-nav__item md-nav__item--nested">
+      
+        
+        
+        <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_8_5_5" >
+        
+          
+          
+          <div class="md-nav__link md-nav__container">
+            <a href="usage/" class="md-nav__link ">
+              
+  
+  <span class="md-ellipsis">
+    Usage
+  </span>
+  
+
+            </a>
+            
+          </div>
+        
+        <nav class="md-nav" data-md-level="3" aria-labelledby="__nav_8_5_5_label" aria-expanded="false">
+          <label class="md-nav__title" for="__nav_8_5_5">
+            <span class="md-nav__icon md-icon"></span>
+            Usage
+          </label>
+          <ul class="md-nav__list" data-md-scrollfix>
+            
+              
+            
+          </ul>
+        </nav>
+      
+    </li>
+  
+
+              
+            
+          </ul>
+        </nav>
+      
+    </li>
+  
+
+              
+            
+          </ul>
+        </nav>
+      
+    </li>
+  
+
+    
+  </ul>
+</nav>
+                  </div>
+                </div>
+              </div>
+            
+            
+              
+              <div class="md-sidebar md-sidebar--secondary" data-md-component="sidebar" data-md-type="toc" >
+                <div class="md-sidebar__scrollwrap">
+                  <div class="md-sidebar__inner">
+                    
+
+<nav class="md-nav md-nav--secondary" aria-label="Table of contents">
+  
+  
+  
+    
+  
+  
+    <label class="md-nav__title" for="__toc">
+      <span class="md-nav__icon md-icon"></span>
+      Table of contents
+    </label>
+    <ul class="md-nav__list" data-md-component="toc" data-md-scrollfix>
+      
+        <li class="md-nav__item">
+  <a href="#why-use-vector-tiles" class="md-nav__link">
+    <span class="md-ellipsis">
+      Why use Vector Tiles?
+    </span>
+  </a>
+  
+</li>
+      
+        <li class="md-nav__item">
+  <a href="#which-linz-basemaps-use-vector-tiles" class="md-nav__link">
+    <span class="md-ellipsis">
+      Which LINZ Basemaps' use Vector Tiles?
+    </span>
+  </a>
+  
+</li>
+      
+    </ul>
+  
+</nav>
+                  </div>
+                </div>
+              </div>
+            
+          
+          
+            <div class="md-content" data-md-component="content">
+              <article class="md-content__inner md-typeset">
+                
+                  
+
+  
+  
+
+
+<h1 id="working-with-vector-tiles">Working with Vector Tiles</h1>
+<p>Vector tiles are a modern approach to delivering map data that offers significant advantages over traditional raster tiles. Unlike raster tiles, which are pre-rendered images, vector tiles contain raw geographic data that you can styled dynamically client-side. This means you can customise the colors, labels, and visibility of features without requesting new tiles from the server.</p>
+<h2 id="why-use-vector-tiles">Why use Vector Tiles?</h2>
 <ul>
-<li><strong>Scalability</strong>: Vector tiles scale infinitely without pixelation, making them perfect for high-resolution displays</li>
-<li><strong>Customization</strong>: Style your maps on-the-fly - change colors, fonts, and feature visibility</li>
-<li><strong>Performance</strong>: Smaller file sizes compared to raster tiles at equivalent quality</li>
-<li><strong>Flexibility</strong>: Rotate maps and apply custom styles without server requests</li>
+<li>
+<p><strong>Customization</strong></p>
+<p>Style your maps on-the-fly - change colors, fonts, and feature visibility.</p>
+</li>
+</ul>
+<ul>
+<li>
+<p><strong>Flexibility</strong></p>
+<p>Rotate maps and apply custom styles without server requests.</p>
+</li>
 </ul>
-<h2 id="which-linz-basemaps-maps-use-vector-tiles">Which LINZ Basemaps Maps Use Vector Tiles?</h2>
 <ul>
-<li><a href="https://basemaps.linz.govt.nz/?style=topographic-v2">Topographic</a></li>
-<li><a href="https://basemaps.linz.govt.nz/?style=topolite-v2">Topolite</a></li>
-<li><a href="https://basemaps.linz.govt.nz/?style=labels-v2">Labels</a></li>
+<li>
+<p><strong>Performance</strong></p>
+<p>Smaller file sizes compared to raster tiles at equivalent quality.</p>
+</li>
+</ul>
+<ul>
+<li>
+<p><strong>Scalability</strong></p>
+<p>Vector tiles scale infinitely without pixelation, making them perfect for high-resolution displays.</p>
+</li>
 </ul>
-<p>Note: All these 3 maps use the same tileset, but have different styles which change the way they look.</p>
+<h2 id="which-linz-basemaps-use-vector-tiles">Which LINZ Basemaps' use Vector Tiles?</h2>
+<p>We have two sets of vector tiles, each defined by a different tile matrix: one in <a href="https://epsg.io/2193">NZTM2000Quad</a>, and one in <a href="https://epsg.io/3857">WebMercatorQuad</a>. For each set, we have three vector basemaps based on the same underlying data, but styled differently using separate stylesheets:</p>
+<table>
+<thead>
+<tr>
+<th style="text-align: center;"><a href="https://basemaps.linz.govt.nz/?style=labels-v2">Labels</a></th>
+<th style="text-align: center;"><a href="https://basemaps.linz.govt.nz/?style=topolite-v2">Topolite</a></th>
+<th style="text-align: center;"><a href="https://basemaps.linz.govt.nz/?style=topographic-v2">Topographic</a></th>
+</tr>
+</thead>
+<tbody>
+<tr>
+<td style="text-align: center;"><img alt="" src="static/labels.png" /></td>
+<td style="text-align: center;"><img alt="" src="static/topolite.png" /></td>
+<td style="text-align: center;"><img alt="" src="static/topographic.png" /></td>
+</tr>
+</tbody>
+</table>
+<p>We have three guides for working with vector tiles:</p>
 <ul>
-<li><a href="_How-to-use-vector-tiles/">How to use vector tiles</a></li>
-<li><a href="how-to-customize-vector-tiles/">How to customize vector tiles</a></li>
+<li><a href="usage/">How to <strong>Use</strong> our Vector Tiles</a></li>
+<li><a href="styling/">How to <strong>Style</strong> our Vector Tiles</a></li>
+<li><a href="creation/">How we <strong>Create</strong> our Vector Tiles</a></li>
 </ul>