A full-featured Framer plugin for designing and deploying the Mojave Globe React component with real-time WebGL preview, theming, and code generation.
Live Preview
The sticky preview canvas renders the globe with the same settings that will be inserted into Framer.
Streams texture and atmosphere changes immediately, and respects the current Framer theme (light/dark).
Mouse wheel adjusts the camera position for scroll/route modes; drag interactions mirror the props you enable.
Route mode animates between start/end locations once both have been resolved.
Appearance Controls
Texture Style: Light, Dark, Marble, or Topology maps (served from CDN).
Edge Padding (px)**: Adjusts `fitPaddingPx` so the globe fits safely inside the Framer frame.
Atmosphere**: Toggle on/off, pick a color, and set altitude (0–1) to control the halo around the globe.
Movement Controls
Mode: None, Rotate, Scroll, or Route — matches the `movement.mode` prop.
Reverse Direction: Flips spin, scroll, or route direction.
Start When: Choose Top/Middle/Bottom/Immediate/Sticky triggers for scroll animations.
Start Offset (px): Fine-tune when scroll/route animations begin.
Rotate Speed: Available in Rotate mode (0–120°/s).
Start / End Location: Resolve human-readable locations to latitude/longitude using the geocoding services; the **Set** buttons commit the values and refresh preview pins.
Route Warnings: A banner appears when Route mode is active without both endpoints.
Mouse Interactions: Toggle hover-to-center and drag interactions that map to `mouseInteractions`.
Marker Editor
`+ New Marker` creates a draft marker with defaults (`Lollipop` pin, scale 6.5, altitude -0.02, colors matching the UI).
Each marker row includes:
City: (required, geocoded before preview or insertion)
Label (optional)
Pin Type: ('Lollipop', 'Teardrop', 'Line', 'Pyramid')
Scale
Altitude Offset: and color pickers for head/stem where applicable.
Update: commits a single marker
Update All: normalizes the list, re-geocodes every marker, and refreshes the preview to keep draft state and plugin state in sync.
Remove: immediately deletes the marker from the draft and preview.
Marker data is sanitized (trimming text, clamping ranges, removing empty entries) before being saved or inserted.
Live Preview
The sticky preview canvas renders the globe with the same settings that will be inserted into Framer.
Streams texture and atmosphere changes immediately, and respects the current Framer theme (light/dark).
Mouse wheel adjusts the camera position for scroll/route modes; drag interactions mirror the props you enable.
Route mode animates between start/end locations once both have been resolved.
Appearance Controls
Texture Style: Light, Dark, Marble, or Topology maps (served from CDN).
Edge Padding (px)**: Adjusts `fitPaddingPx` so the globe fits safely inside the Framer frame.
Atmosphere**: Toggle on/off, pick a color, and set altitude (0–1) to control the halo around the globe.
Movement Controls
Mode: None, Rotate, Scroll, or Route — matches the `movement.mode` prop.
Reverse Direction: Flips spin, scroll, or route direction.
Start When: Choose Top/Middle/Bottom/Immediate/Sticky triggers for scroll animations.
Start Offset (px): Fine-tune when scroll/route animations begin.
Rotate Speed: Available in Rotate mode (0–120°/s).
Start / End Location: Resolve human-readable locations to latitude/longitude using the geocoding services; the **Set** buttons commit the values and refresh preview pins.
Route Warnings: A banner appears when Route mode is active without both endpoints.
Mouse Interactions: Toggle hover-to-center and drag interactions that map to `mouseInteractions`.
Marker Editor
`+ New Marker` creates a draft marker with defaults (`Lollipop` pin, scale 6.5, altitude -0.02, colors matching the UI).
Each marker row includes:
City: (required, geocoded before preview or insertion)
Label (optional)
Pin Type: ('Lollipop', 'Teardrop', 'Line', 'Pyramid')
Scale
Altitude Offset: and color pickers for head/stem where applicable.
Update: commits a single marker
Update All: normalizes the list, re-geocodes every marker, and refreshes the preview to keep draft state and plugin state in sync.
Remove: immediately deletes the marker from the draft and preview.
Marker data is sanitized (trimming text, clamping ranges, removing empty entries) before being saved or inserted.