Skip to main content

Appearance

The map ships a complete visitor interface: search, a floor picker, a detail panel, directions entry points, and so on. The appearance surface decides which of those are visible.

Examples use a demonstration campus. Every snippet on this site addresses ucba, a publicly available campus with the building muntz-hall and the room 170. Substitute your own campus slug once you have one. Slugs for your campus are listed in your Waylocate console, and the addressing rules are in the reference grammar.

Setting chrome at runtime​

await map.ui.setChrome({ search: false, events: false });

The argument is a partial set of flags. Omitted flags are left as they are, so the call above hides two elements without disturbing anything else.

Unknown keys are rejected with INVALID_PAYLOAD. This is deliberately different from the ui= URL parameter, which ignores tokens it does not recognise. A URL is written by hand and benefits from tolerating a typo; a command is written by a program, and quietly discarding half of it would leave your code believing chrome is hidden when it is still on screen.

Setting chrome on load​

The same flags can be set in the embed URL, which avoids the brief moment where elements are visible before your command lands.

await mount({ container: "#map", campus: "ucba", ui: "-search,-events" });
<iframe src="https://waylocate.com/ucba?embed=1&ui=-search,-events"></iframe>

Prefer the URL for anything you always want hidden, and setChrome for things that change while the map is on screen.

The token grammar, the full flag list, and their defaults are in chrome flags.

Flags hide entry points, not capability​

Hiding an element removes the visitor's way in. It does not remove the feature.

With ui=-directions, the directions buttons disappear, but a route set through directions.start or through the from and to URL parameters still renders. With ui=-panel, the map's detail panel stays closed, but selection still works and still emits events.

This is what makes it practical to replace parts of the map's interface with your own: hide the panel, listen for selection.changed, and render your own detail view in your own design system, while the map continues to handle selection and framing.

const map = await mount({ container: "#map", campus: "ucba", ui: "-panel" });

map.on("selection.changed", (selection, meta) => {
  if (meta.source === "user") renderOwnPanel(selection);
});

Branding​

The Waylocate logo and campus badge cannot be disabled. branding: false is rejected rather than ignored, so that a call which cannot take effect does not report success.

What is not configurable yet​

The appearance surface currently covers visibility only. Colours, typography, map styling, marker appearance, and language are not host-configurable in this version of the protocol.

Several of these are planned. Because the protocol only ever grows, they will arrive as additional commands and additional payload fields rather than as changes to what is documented here, and an integration written today will continue to work when they do. The current shape of that list is in planned customization.

Next​