The Point of this React component is to enable drag-and-drop on-and-off a Google map, not to
drag a marker
inside a Google map.
DYNAMIC SINGLE PAGE WITH CODE
Create Map A
Destroy Map A
Drag markers between maps
⇆
Locations Saved on Destroy
Create Map B
Destroy Map B
ACTIVITIES SINGLE PAGE WITH CODE
Can add new spokes by dragging from the below icons when they are visible on the map.
Steveston
Sasamat Lake
North Shore
Stanley Park
Add new locations on the map connected to the "North Shore" hub by dragging from the "water" icon in the center of hub.
Drag Here to Delete
Clear All
0
Resize Map
Hide Info
Show Info
Drag Here to Modify
Lat
Lng
Title
Activity
Id
Svg
Outing
Color
Extra
EVENTS SINGLE PAGE WITH CODE
Dragging pins on the map show distance.
Map events are logged in the console.
The below pins are plain un-draggable icons.
HIKES SINGLE PAGE WITH CODE
Alouette Mountain Hike
Bastion Hike
Burke Mountain Hike
Swan Falls Hike
Clear All
0
Resize Map
Hide Info
Show Info
MALLS SINGLE PAGE WITH CODE
Drag and drop pins inside the map, onto the map, and off of the map to the "Delete" icon
Pacific Mall
Oakridge
Park Royal
Capilano
Royal City
Richmond Centre
Lansdowne
Aberdeen
Lougheed
Brentwood
Metropolis
Guilford
Central City
Coquitlam Centre
Drag Mall Here to Delete
SIMPLE SINGLE PAGE WITH CODE
Dump 3 ski hill locations
Drag red skier icons to the text area below, or a text editor.
ski_hills.locationsGetAll()