Leaving slide mode.
The Map Markup Language (MapML) Proposal
Peter Rushforth, Maps for HTML CG co-chair
TPAC 2025
Kobe, Japan & online
10–14 November 2025
Satoru Takagi - KDDI Corp - W3C & Maps for HTML CG member
From Maps in the Web to the Web as a Map
The MapML Proposal
MapML is a proposal to make maps and locations accessible and interoperable as part of HTML
The idea is to create a layered map viewer element, similar to <img>, <video> or <audio>.
MapML is polyfilled using custom autonomous HTML elements.
A simple working example follows:
<mapml-viewer controls zoom="17" lat="34.666" lon="135.213">
<map-layer checked hidden src="openstreetmap.mapml"></map-layer>
<map-layer src="kobe-convention-centre.mapml" checked ></map-layer>
</mapml-viewer>
Motivation
Enhanced Accessibility and Usability
Making maps part of the HTML standard will improve accessibility and usability for users.
Creating simple maps should be simple; making complex maps should be possible, using standard tools, i.e. HTML, CSS, JS.
Better Privacy Through Decentralization
MapML will reduce the web's dependence on proprietary services, promoting privacy and decentralization by enabling user choice.
Problem Description
2022 research showed that 16% of web pages loaded a JS mapping library. For context, the <video> element was measured on 4.1% of page loads at the time.
Developers are forced to rely on complex, and in some cases inaccessible JavaScript libraries, due to lack of standards support for maps and location.
Location is a fundamental primitive form of information on the web, akin to text, images, video and audio.
Accordingly, maps should be prioritized for implementation by the web platform.
Impact of Current Situation
Accessibility Barriers
2020 community research demonstrated
that maps built with JavaScript have highly variable accessibility, creating an
inconsistent and often exclusionary experience for users. In research by Bocoup from 2022, 84% of
developers reported that they lacked the tools to create accessible maps.
Privacy and Surveillance
Map publishing is dominated by centralized platforms who track user location and search interests. Users have
few privacy-preserving alternatives. Standardization of maps in HTML would facilitate a decentralized
web of mapping services.
Inconsistent Experience
Map interfaces vary widely across sites. Standardizing an accessible map widget would give the web a baseline
experience for maps, as well as a foundation for innovation. Implementing an accessible map and location
rendering system will lead to a virtuous feedback loop for the web.
Use Cases and Requirements
Following our successful, global 2020 Maps for the Web joint W3C/OGC* workshop, our community co-chair led extensive research and documentation of
mapping use cases and requirements
There are likely scenarios that we haven't considered yet, which may give rise to more use cases and related requirements.
*Open Geospatial Consortium
Use Cases
Use cases are catgorized by user persona:
- Website visitor: View map, query map, find location, show/hide layers, express colour preferences
- Content / map author: Embed map, add / mashup layers, style content, add interactivity / animations
- Application Developer: Customize map controls, provide audible/visible feedback as map changes, customize map behavior
Capabilities
The Use Cases and Requirements (UCR) specification attempts to identify the capabilities a mapping application must have
in order to fulfill those use cases. Each capability is further categorized as a
requirement, an enhancement,
impractical or undecided
Documentation
A central hub for MapML is our developer documentation site.
There is a reference section for each element and
its proposed interface. For each element or interface there is a "Requirements" section.
Requirements
The Requirements section is formatted as a table that links the element or interface's
capabilities to the specific capability identified by the UCR document, and to the spec for that feature.
The aim of this table is to be able to compare what is implemented against the requirement.
Specification
Where applicable and available, there's a link to the
specification for the feature, if a capability has been described there.
MapML Polyfill
The MapML polyfill was the subject of collaborative research and development by the OGC and W3C community prior to the 2020 Workshop, and subsequent requirements formalization. Since 2020, MapML has seen further refinement and development driven by UCR requirements, and community input.
Tiled Coordinate Reference Systems
The Viewer
<mapml-viewer zoom="17" lat="34.666" lon="135.213" controls projection="OSMTILE">
<map-layer checked hidden src="openstreetmap.mapml"></map-layer>
<map-layer src="kobe-convention-centre.mapml" checked ></map-layer>
</mapml-viewer>
Layers
MapML layers are defined using the <map-layer> element. Each layer can contain features, tiles, and / or one or more templates for loading tiles or features, wrapped in the <map-extent> element. Many layers can be added to a viewer element to create a "mashup" map experience. The layer element has the checked boolean attribute to indicate whether it is displayed on the map. The checked attribute serves as an important API for map layers. The layer element also has the hidden boolean attribute, which serves to hide the layer from the layer list UI, but still include it in the map rendering.
<map-layer checked hidden src="openstreetmap.mapml"></map-layer>
<map-layer src="kobe-convention-centre.mapml" checked></map-layer>
<map-layer checked label="TPAC 2025 Venue">
<map-meta name="projection" content="OSMTILE"></map-meta>
<map-feature zoom="17">
<map-featurecaption>神戸国際会議場 <br>Kobe International Conference Center</map-featurecaption>
<map-properties>
<h2><a href="https://kobe-cc.jp/en/facilities/conference-center/">神戸国際会議場<br>Kobe International Conference Center</a></h2>
</map-properties>
<map-geometry>
<map-point>
<map-coordinates>135.213171 34.666085</map-coordinates>
</map-point>
</map-geometry>
</map-feature>
</map-layer>
Document Type
Standalone MapML documents encoded as XHTML are an important use case. The existence of
such documents and the corresponding text/mapmlMIME media type is required to enable the simplest use case of creating a dynamic layered map using hyperlinks, similar to
embedding images or videos in HTML pages.
Current Polyfilled MapML Implemented as XHTML
<mapml- lang="ja" xmlns="http://www.w3.org/1999/xhtml">
<map-head>
<map-title>オープンストリートマップ</map-title>
<map-link rel="license" href="https://www.openstreetmap.org/copyright" title="© オープンストリートマップの貢献者 CC BY-SA"></map-link>
</map-head>
<map-body>
<map-extent units="OSMTILE" checked="checked">
<map-input name="z" type="zoom" min="0" max="18"></map-input>
<map-input name="x" type="location" units="tilematrix" axis="column"></map-input>
<map-input name="y" type="location" units="tilematrix" axis="row"></map-input>
<map-link rel="tile" tref="https://tile.openstreetmap.org/{z}/{x}/{y}.png" ></map-link>
</map-extent>
</map-body>
</mapml->
Proposed Non-polyfilled MapML as html doctype
<!DOCTYPE mapml>
<html lang="ja">
<head>
<title>オープンストリートマップ</title>
<meta charset="utf-8">
<link rel="license" href="https://www.openstreetmap.org/copyright" title="© オープンストリートマップの貢献者 CC BY-SA">
</head>
<body>
<extent units="OSMTILE" checked>
<input name="z" type="zoom" min="0" max="18">
<input name="x" type="location" units="tilematrix" axis="column">
<input name="y" type="location" units="tilematrix" axis="row">
<link rel="tile" tref="https://tile.openstreetmap.org/{z}/{x}/{y}.png" >
</extent>
</body>
</html>
<map-extent>
A <map-extent> element defines a map 'form' that binds to the viewport of the map viewer. Within the <map-extent> element, you specify
variables, using <map-input> elements, to bind to a scalar property of the predefined viewport positions (top-left, bottom-right, etc) or properties (e.g. scale). Scalar properties include zoom, easting, northing, longitude, latitude or relative or absolute pixel coordinates. These variables are used to 'fill in' the form and submit to the server, obtaining images or other map resources (tiles, features) for rendering.
<map-layer label="オープンストリートマップ" checked>
<map-extent label="OpenStreetMap tile template" checked hidden units="OSMTILE">
<map-input name="z" type="zoom" value="18" min="0" max="18">
<map-input name="x" type="location" units="tilematrix" axis="column">
<map-input name="y" type="location" units="tilematrix" axis="row">
<map-link rel="tile" tref="https://tile.openstreetmap.org/{z}/{x}/{y}.png">
</map-extent>
</map-layer>
Features
MapML features are defined using the <map-feature> element. Each feature can represent a point, line, or polygon on the map, and can include additional metadata such as titles, descriptions, and styling information.
<map-feature zoom="17">
<map-featurecaption>神戸国際会議場 <br>Kobe International Conference Center</map-featurecaption>
<map-properties>
<h2><a href="https://kobe-cc.jp/en/facilities/conference-center/">神戸国際会議場<br>Kobe International Conference Center</a></h2>
</map-properties>
<map-geometry>
<map-point>
<map-coordinates>135.213171 34.666085</map-coordinates>
</map-point>
</map-geometry>
</map-feature>
Next Steps
We are seeking feedback and collaboration from the W3C community, and especially the browser projects, on the our proposal, including the polyfill implementation, use cases, and requirements.
We invite participation in the Maps for HTML Community Group to help refine and advance the proposal towards standardization.
If possible, the Maps for HTML community would prefer to integrate the MapML and HLA 2.0 proposals into a single coherent proposal for standardization and implementation
Please provide your feedback and insights to help us move forward with a unified community-backed proposal.