ApexMaps 1.2: Street Tiles, a View Event and Translated Map Text

ApexMaps 1.2.0 shipped on October 26, 2026 with street tiles under the map, an event that reports the view, and translated map text. Nothing breaks. react-apexmaps, vue-apexmaps and ngx-apexmaps moved to 1.2.0 alongside, and the demos on this site load the unversioned CDN, so they are already on it.

Key takeaways

• Street tiles (Premium): geo.tiles draws raster tiles from any {z}/{x}/{y} server under a Web Mercator map.
• viewChange and getView() report the visible bounds and web-map zoom level, in every plan.
• locale translates every string the map writes itself, screen-reader announcements included.
• Markers follow the map on resize and while a globe turns.
• One sizing change: the plot's size now rounds down, so it can be one pixel shorter.
• Upgrading is npm install apexmaps@1.2.0.

How do I put streets under a map?

Give geo.tiles a URL template on a Web Mercator map:

geo: {
  map: 'us/states',
  projection: 'webMercator',
  tiles: {
    url: 'https://tiles.example.com/{z}/{x}/{y}.png',
    attribution: '© Example contributors',
    minZoom: 4,
    request: (url) => ({ url, headers: { Authorization: 'Bearer ...' } }),
  },
}

Nothing is requested unless you give a url, so a map never calls a server its page did not configure. The tiles sit under every series in the same transform as the geometry, so they pan and zoom with it frame for frame. minZoom keeps them off until the reader has zoomed in far enough for streets to matter, and past maxZoom (default 19) the last level is stretched rather than requested. request runs before every tile, to sign its URL, add a header or route it through your own proxy, and may return a promise.

While tiles show, the automatic land drawn under a point-only map fades and keeps its outlines. A choropleth is data and keeps its fill, so give it opacity if the streets should show through. Tiles are cut in spherical Mercator, so on any other projection, or a turned one, the layer stays empty. Exports leave them out. Use a tile server whose terms allow your traffic and show the credit it asks for in attribution.

Tiles are a Premium feature, priced with image fills. Without a key they work in full with a watermark, so you can try them on your own server first. Raster Tiles covers every option, and Licensing the plans.

How do I keep my own layer in step with the map?

viewChange fires on every pan and zoom frame, globe turn and resize, synchronously with the frame, and getView() returns the same at any time:

map.on('viewChange', ({ bounds, center, zoom, k }) => {
  // bounds: [[west, south], [east, north]], or null when the projection cannot be inverted
  // zoom: the web-map level a {z}/{x}/{y} server would draw, null off an unturned Mercator
  loadVisibleRows(bounds, zoom)
})

It needs no license key, so a page that draws its own layer under the map, or fetches only the rows in view, owes nothing. The wrappers expose it as an onViewChange prop in React, a viewChange emit in Vue and a (viewChange) output in Angular. In Angular the event arrives outside the zone, so update a signal in the handler. See Following the view.

How do I translate the map's own text?

A top-level locale option replaces every string the map writes: the zoom buttons, the drilldown breadcrumb, the data table's caption and headings, the no-data text, the size legend, and the drilldown announcements a screen reader hears.

locale: {
  zoomControls: { zoomIn: '拡大', zoomOut: '縮小', reset: '表示をリセット' },
}

Each key you leave out keeps its English default. Localization lists every key.

Other changes

• Marker series are reprojected when the map resizes and while a globe turns, so they stay on their places.
• A left or right legend stays beside the map on pages without a box-sizing reset and at fractional container widths.
• The plot's size is rounded down rather than to the nearest pixel, so a container with a fractional height can get a plot one pixel shorter.
• The core bundle, apexmaps.min.js, is 93,254 B gzipped, up 3,435 B (3.8%) from 1.1.1.

The full notes are in the 1.2.0 GitHub release.

Upgrading

npm install apexmaps@1.2.0

The 1.2.0 wrappers need apexmaps 1.2.0, so upgrade them together, for example npm install apexmaps@1.2.0 react-apexmaps@1.2.0. Earlier: ApexMaps 1.1, with pixel maps.

Frequently asked questions