Create a story map, fly to a location based on the scroll position

Create a story map. As you scroll down the page, the map will automatically move to the specific location of each chapter in the story.







  

      
        
          
          Fit to the bounds of a lineString
        
        
Fit to the bounds of a lineString

        Example
        
Get the bounds of a lineString.

      
    
   
  

      
        
          
          Fit a map to a bounding box
        
        
Fit a map to a bounding box

        Example
        
Fit the map to a specific area, regardless of the pixel size of the map.

      
    
   
  

      
        
          
          Fly to a location
        
        
Fly to a location

        Example
        
Use flyTo to smoothly interpolate between locations.

      
    
   
  

      
        
          
          Creates an animated map to fly between different locations
        
        
Creates an animated map to fly between different locations

        Example
        
This example uses SDK JS to fly between different locations and visualize the frequency of US schools by location using a heatmap layer with low zoom levels and a styled circles layer with a data-driven property for zoom levels in more detail.

      
    
   
  



      
      

      
        An extension of MapLibre GL JS
       
      

      
    

    

        


  
    
  





        
        

        
          
            
          
        
          
            
          
        
          
             
            

                
                  
Module Usage

                  
                
            

            
          
        
          
             
            

                
                  
Module Reference