This article describes how to load and visualize worldwide OpenStreetMap imagery data in LuciadRIA. You access such data through OpenStreetMap tile servers that adhere to the tile URL pattern http(s)://baseUrl/${z}/${x}/${y}.png. In that pattern, z, x, and y refer to zoom level, tile column, and tile row respectively. You can apply the principles used in this article to other tile servers adhering to a similar tile URL pattern.

Visualizing OpenStreetMap raster tiles on a map requires two steps:

  1. Create a UrlTileSetModel that applies the OpenStreetMap raster tiles settings.

  2. Use a RasterTileSetLayer to visualize the model.

// Create a model that applies the OpenStreetMap raster tiles' settings, including:
// - the URL pattern consisting of baseUrl/{tileLevel}/{tileColumn}/{inverse tileRow}.png
// - a Web Mercator projection
// - a single top-level tile
const webMercatorReference = getReference("EPSG:3857");
const quadTreeStructure : QuadTreeRasterTileSetStructure = {
  bounds: createBounds(webMercatorReference, [-20037508.3427892, 2 * 20037508.3427892, -20037508.3427892, 2 * 20037508.3427892]),
  level0Columns: 1,
  level0Rows: 1,
  reference: webMercatorReference
};
const model = new UrlTileSetModel({
  baseURL: "https://a.tile.openstreetmap.org/{z}/{x}/{-y}.png",
  structure: quadTreeStructure
})
// Create a layer for the model.
const layer = new RasterTileSetLayer(model, {
  label: "OpenStreetMap"
});

You can download OpenStreetMap tiles from public providers, like the ones listed on https://wiki.openstreetmap.org/wiki/Raster_tile_providers. Please consider the usage policies of these public providers. Most of them offer free access to OpenStreetMap tiles, but have limited bandwidth, and discourage putting too much stress on their services.

You can also choose to serve OpenStreetMap tiles from your own machines. Check http://wiki.openstreetmap.org/wiki/Tile_servers for a list of servers that you can run to serve OpenStreetMap tiles.

Next to OpenStreetMap tile servers, you can also find OGC-based WMS and WMTS servers on the Internet that offer OpenStreetMap data. The OGC web services articles for WMS and WMTS explain how to load and visualize data from such servers.