EOxElements

EOxElements

A Web Component collection of geospatial UI elements, crafted by EOX.

Documentation, Examples

Please find descriptions, API docs and interactive examples here.

Elements

• ⭕️ Alpha elements are in-development and may have many frequent breaking

changes.

• 🟡 Beta elements are mostly polished and ready for use, but may still have

breaking changes.

• ✅ Stable elements are reviewed, documented, and API complete.

<table> <tr> <th>Element</th> <th>Description</th> <th>Docs & Examples</th> <th>Version</th> <th>State</th> </tr> <tr> <td><a href="./elements/chart/">eox-chart</a></td> <td>Dynamic chart with built-in data fetching</td> <td><a href="https://eox-a.github.io/EOxElements/index.html?path=/docs/elements-eox-chart--docs">Docs & Examples</a></td> <td><a href="elements/chart/CHANGELOG.md"><img src="https://img.shields.io/npm/v/@eox/chart.svg?label=%20" /></a></td> <td>✅</td> </tr> <tr> <td><a href="./elements/drawtools/">eox-drawtools</a></td> <td>Draw and manage features on a map</td> <td><a href="https://eox-a.github.io/EOxElements/index.html?path=/docs/elements-eox-drawtools--docs">Docs & Examples</a></td> <td><a href="elements/drawtools/CHANGELOG.md"><img src="https://img.shields.io/npm/v/@eox/drawtools.svg?label=%20" /></a></td> <td>✅</td> </tr> <tr> <td><a href="./elements/feedback/">eox-feedback</a></td> <td>Quick and easy feedback widget</td> <td><a href="https://eox-a.github.io/EOxElements/index.html?path=/docs/elements-eox-feedback--docs">Docs & Examples</a></td> <td><a href="elements/feedback/CHANGELOG.md"><img src="https://img.shields.io/npm/v/@eox/feedback.svg?label=%20" /></a></td> <td>✅</td> </tr> <tr> <td><a href="./elements/geosearch/">eox-geosearch</a></td> <td>An autocompleted search input for geographic locations</td> <td><a href="https://eox-a.github.io/EOxElements/index.html?path=/docs/elements-eox-geosearch--docs">Docs & Examples</a></td> <td><a href="elements/geosearch/CHANGELOG.md"><img src="https://img.shields.io/npm/v/@eox/geosearch.svg?label=%20" /></a></td> <td>✅</td> </tr> <tr> <td><a href="./elements/itemfilter/">eox-itemfilter</a></td> <td>Filter/search large sets of items client-side or server-side</td> <td><a href="https://eox-a.github.io/EOxElements/index.html?path=/docs/elements-eox-itemfilter--docs">Docs & Examples</a></td> <td><a href="elements/itemfilter/CHANGELOG.md"><img src="https://img.shields.io/npm/v/@eox/itemfilter.svg?label=%20" /></a></td> <td>✅</td> </tr> <tr> <td><a href="./elements/jsonform/">eox-jsonform</a></td> <td>Render a form from a JSON schema</td> <td><a href="https://eox-a.github.io/EOxElements/index.html?path=/docs/elements-eox-jsonform--docs">Docs & Examples</a></td> <td><a href="elements/jsonform/CHANGELOG.md"><img src="https://img.shields.io/npm/v/@eox/jsonform.svg?label=%20" /></a></td> <td>✅</td> </tr> <tr> <td><a href="./elements/layercontrol/">eox-layercontrol</a></td> <td>Manage and modify map layers</td> <td><a href="https://eox-a.github.io/EOxElements/index.html?path=/docs/elements-eox-layercontrol--docs">Docs & Examples</a></td> <td><a href="elements/layercontrol/CHANGELOG.md"><img src="https://img.shields.io/npm/v/@eox/layercontrol.svg?label=%20" /></a></td> <td>✅</td> </tr> <tr> <td><a href="./elements/layout/">eox-layout</a></td> <td>Easily create a UI layout</td> <td><a href="https://eox-a.github.io/EOxElements/index.html?path=/docs/elements-eox-layout--docs">Docs & Examples</a></td> <td><a href="elements/layout/CHANGELOG.md"><img src="https://img.shields.io/npm/v/@eox/layout.svg?label=%20" /></a></td> <td>✅</td> </tr> <tr> <td><a href="./elements/map/">eox-map</a></td> <td>Map with powerful tools & helpers</td> <td><a href="https://eox-a.github.io/EOxElements/index.html?path=/docs/elements-eox-map--docs">Docs & Examples</a></td> <td><a href="elements/map/CHANGELOG.md"><img src="https://img.shields.io/npm/v/@eox/map.svg?label=%20" /></a></td> <td>✅</td> </tr> <tr> <td><a href="./elements/stacinfo/">eox-stacinfo</a></td> <td>Display properties of STAC files</td> <td><a href="https://eox-a.github.io/EOxElements/index.html?path=/docs/elements-eox-stacinfo--docs">Docs & Examples</a></td> <td><a href="elements/stacinfo/CHANGELOG.md"><img src="https://img.shields.io/npm/v/@eox/stacinfo.svg?label=%20" /></a></td> <td>✅</td> </tr> <td><a href="./elements/storytelling/">eox-storytelling</a></td> <td>StoryTelling tools based on markdown</td> <td><a href="https://eox-a.github.io/EOxElements/index.html?path=/docs/elements-eox-storytelling--docs">Docs & Examples</a></td> <td><a href="elements/storytelling/CHANGELOG.md"><img src="https://img.shields.io/npm/v/@eox/storytelling.svg?label=%20" /></a></td> <td>✅</td> </tr> <tr> <td><a href="./elements/timecontrol/">eox-timecontrol</a></td> <td>Time control and playback for map layers</td> <td><a href="https://eox-a.github.io/EOxElements/index.html?path=/docs/elements-eox-timecontrol--docs">Docs & Examples</a></td> <td><a href="elements/timecontrol/CHANGELOG.md"><img src="https://img.shields.io/npm/v/@eox/timecontrol.svg?label=%20" /></a></td> <td>✅</td> </tr> <tr> <td><a href="./elements/tour/">eox-tour</a></td> <td>Guided tour for UIs</td> <td><a href="https://eox-a.github.io/EOxElements/index.html?path=/docs/elements-eox-tour--docs">Docs & Examples</a></td> <td><a href="elements/tour/CHANGELOG.md"><img src="https://img.shields.io/npm/v/@eox/tour.svg?label=%20" /></a></td> <td>✅</td> </tr> </table>

Usage

For detailed descriptions and documentation on the individual elements, please check out the READMEs in the element subfolders.

Bundlers (Vite, Webpack, etc.)

npm install @eox/<element>

import "@eox/<element>"
<eox-element></eox-element>

Script tag

<eox-element></eox-element>

<script type="module">
import "@eox/<element>" from "https://cdn.skypack.dev/@eox/<element>"
</script>

Development

For detailed development instructions, including monorepo structure, coding standards, and testing procedures, please refer to the Contributing Guide.

AI Agents working in this repository should also consult AGENTS.md for specific guidelines on maintaining documentation and ensuring compatibility with the MCP server.

License

By contributing to EOxElements, you agree that your contributions will be licensed under the repository's LICENSE.

Previous versions

The main branch of this project contains the v2 version of EOxElements. For the (legacy) v1 EOxElements, please see the v1 branch.