Leaflet Map

• This map plots markers on an interactive map using latitude and longitude columns
• A customizable tooltip is included by passing column names in an array
• Does not support value formatting yet
• Auto-zooms to the points plotted on the map

	

		
					
		
		
<LeafletMap 
    data={coords} 
    lat=lat 
    long=long
    name=store_name
    tooltipFields={['segment', 'annual_sales', 'city']}
    height=500
/>
		

Future Improvements

• Syntax should be expanded to allow for more flexibility and customization. E.g., allow for definitions of multiple sets and styles of markers, arbitrary shapes, choropleths, etc.
• Syntax may be similar to the DataTable with Columns. For example, if you wanted to show service locations, along with a service radius:

  	
  
  		
  					
  		
  		
     <LeafletMap basemap=cartoGrey>
       <Markers color=red data={high_value_locations} tooltipFields={['segment', 'annual_sales', 'city']} />
       <Markers color=blue data={low_value_locations} tooltipFields={['segment', 'annual_sales', 'city']} />
       <Circle centreLat=51.2342 centreLong=-0.1258 radius=2 label="Service Area" />
     </LeafletMap>
  		
  

• Having a few off-the-shelf styles for markers/shapes would be helpful (like in ReferenceArea)
• Tooltip customization may require specific syntax - e.g., a Tooltip component that slots into the Markers component
• Like with DataTable, if there are common use cases, it might make sense to cover those in their own pre-set components which call the underlying LeafletMap component