Styling

Styling in autk-map happens at two levels. First, MapStyle defines the semantic base colors used by the renderer for physical and generic layers. Second, per-layer render settings such as opacity, visibility, and thematic display are applied with updateRenderInfo() and updateColorMap().

In v4, polygon borders can be toggled without rebuilding the layer geometry:

map.updateRenderInfo('neighborhoods', { showBorders: false });

In practice, that means you usually:

1. choose or customize a base map style;
2. load one or more layers;
3. override the render state of individual layers when needed;
4. optionally configure a color map for thematic rendering.

Part	Description
MapStyle	Per-map semantic color system (accessed via map.style) for surface, parks, water, roads, buildings, and generic vector types.
updateRenderInfo()	Per-layer render state such as opacity, isSkip, isPick, and isColorMap.
updateColorMap()	Palette and domain configuration used when thematic rendering is enabled.

Base map styles

MapStyle controls the default semantic colors used by the renderer. Each AutkMap owns its own MapStyle instance, exposed through map.style, so multiple maps can use different visual treatments. Built-in presets provide quick visual baselines for the same data. The example below loads a basic lower-Manhattan OSM scene and starts with the google preset. Use its selector to try the new poster preset or return to the default style; the map redraws automatically.

Built-in presets currently include:

• default
• light
• google
• apple
• osm
• poster

The poster preset uses white land, graphite roads, and pale-blue water/background. General-purpose presets derive muted generic polygon/line/point colors from their surface color, approximately 10%/20%/30% darker. This improves contrast without changing the data.

Every map has a bottom-right made with autark text watermark, even with showUi: false. It is branding, not OpenStreetMap attribution; published maps using OSM still need appropriate data credits.

For full control, use map.style.setCustomStyle() with a complete semantic color object. See MapStyle.

Opacity and layer render state

Per-layer styling is controlled with updateRenderInfo(). This is the main entry point when you want to emphasize one layer, mute another one, temporarily hide a layer, or toggle thematic display.

The example below uses the same OSM scene and lowers only the building opacity so the rest of the base map stays unchanged.

Render flag	Description
opacity	Layer opacity from 0 to 1.
isSkip	Hides the full layer without removing it.
isPick	Enables or disables picking for that layer.
isColorMap	Turns thematic coloring on or off for the layer.
pointSize	Per-layer point radius in projected units (default 64).
polylinesWidth	Full line/road width in projected units (generic default 12); overrides road category widths.

Color-map configuration

Thematic rendering separates the data values from the palette. updateThematic() defines which property path supplies the values, while updateColorMap() defines how those values are mapped to color.

The example below follows the same neighborhood-based thematic setup used elsewhere in the docs, but focuses on the palette configuration itself.

Sequential palettes are typically used for one-directional numeric values such as counts, density, or intensity. Diverging palettes are better when the values should be read around a midpoint or contrasted across two directions.

For the full thematic workflow, continue to Thematic data.

Layer controls in the hamburger menu

The currently selected isPick layer and the thematic-data display can also be activated from the hamburger menu in the map UI.