Live Demo

Three mock partner pages, each driving a real Wander embed over the postMessage bridge, with a live event log showing the traffic in both directions.

Travel article — POI mentions in the copy fly the map to each place, and map selections highlight the related paragraph. It opens in SDK mode; switch to the URL-rewriting integration to see what the bridge replaces.

Multi-day itinerary — a three-day trip where the day tabs are rendered by the host page from the embed’s own itineraryChanged payload, and stay in sync whichever side changes the day.

Listing map — a filtered directory page that hands the embed whatever POIs it is currently showing, with card-to-pin and pin-to-card selection.

Both newer demos put the map in a bottom-sheet drawer on narrow viewports, so tapping a stop opens the map over the list instead of asking the visitor to scroll. Resize the window past 820px to see the same embed as a sticky column. See Itineraries & listing maps for the code.

Hosted SDK

Load the prototype SDK from the Wander developer docs site:

<script src="https://developer.wandermaps.com/sdk/wander-embed.js"></script>

API taste

const map = Wander.map('#el', { mapId, pois });

map.on('ready', handler);
map.on('poiSelected', handler);
map.on('dimensionChanged', handler);

map.flyTo({ poiId });

The SDK is a v0.1.0 prototype. Its API may change before v1.

See the Embed SDK reference for the full bridge reference.