# @geoblocks/ol-maplibre-layer

> Geoblocks to render a MapLibre GL JS map as an OpenLayers layer.

Latest version **2.0.0** (published 2026-09-24) · BSD-3-Clause license · 0 weekly downloads

## Install

```sh
npm install @geoblocks/ol-maplibre-layer
pnpm add @geoblocks/ol-maplibre-layer
yarn add @geoblocks/ol-maplibre-layer
bun add @geoblocks/ol-maplibre-layer
```

## Health

**Score 65/100 (B)** — status: active.

Positive: has types; esm support; no vulnerabilities; recently updated; high maintenance score.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 2.0.0 |
| Published | 2026-09-24 |
| First published | 2021-09-01 |
| Weekly downloads | 0 |
| License | BSD-3-Clause |
| TypeScript types | bundled |
| Module format | ESM |
| Dependencies | 0 |
| Unpacked size | 76.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 61 |
| Maintainers | gberaudo, sbrunner, fredj, bgerber, tyrossel, vladyslavtk |

## Links

- npm: https://www.npmjs.com/package/@geoblocks/ol-maplibre-layer
- Repository: https://github.com/geoblocks/ol-maplibre-layer
- Homepage: https://github.com/geoblocks/ol-maplibre-layer#readme
- Issues: https://github.com/geoblocks/ol-maplibre-layer/issues
- npm.io page: https://npm.io/package/@geoblocks/ol-maplibre-layer

## Recent versions

- 2.0.0 (latest) — 2026-09-24
- 1.0.3 — 2025-01-13
- 1.0.2 — 2024-11-25
- 1.0.1 — 2024-08-15
- 1.0.0 — 2024-05-23
- 0.1.3 — 2024-02-02
- 0.1.2 — 2023-11-08
- 0.1.1 — 2023-05-15
- 0.1.0 — 2023-04-28
- 0.1.0-rc0 — 2023-04-27
- 0.0.6 — 2023-02-24
- 0.0.5 — 2023-02-03
- 0.0.4 — 2022-04-07
- 0.0.3 — 2022-04-06
- 0.0.2 — 2022-02-23
- … 1 more at https://npm.io/package/@geoblocks/ol-maplibre-layer/versions

## README

# MapLibre OpenLayers layer

Render a [MapLibre GL JS](https://maplibre.org/maplibre-gl-js/docs/) map as an [OpenLayers](https://openlayers.org/) layer.

## Installation

```shell
npm i @geoblocks/ol-maplibre-layer
```

OpenLayers and MapLibre GL JS are peer dependencies, so you need to install them too.

```shell
npm i ol maplibre-gl
```

## Code example

```js
import {MapLibreLayer} from '@geoblocks/ol-maplibre-layer';

const layer = new MapLibreLayer({
  opacity: 0.7,
  mapLibreOptions: {
    style: 'https://www.example.com/path/to/style.json',
  },
});

// ...
map.addLayer(layer);
```

All the properties passed to the construction (except `mapLibreOptions`) are used to create the [OpenLayers layer](https://openlayers.org/en/latest/apidoc/module-ol_layer_Layer-Layer.html).
`mapLibreOptions` is used to create the [MapLibre map](https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/).

The MapLibreLayer exposes the underlying MapLibre map as public property, so you can use it to interact with the map.

```js
layer.maplibreMap.setStyle('https://www.example.com/path/to/other/style.json');
```

## Online doc and demos

- [Documentation](https://geoblocks.github.io/ol-maplibre-layer/api/);
- [Demo](https://geoblocks.github.io/ol-maplibre-layer/demo.html);

## Troubleshooting

With MapLibre-GL v6, you have to set the worker manually, read the [MapLibre v6 installation](https://github.com/maplibre/maplibre-gl-js/blob/v6.0.0/docs/index.md#installation).

## Local development

For local development we use a few demos.

```bash
npm install
npm run start
open http://localhost:1234
```

## Publish a new version to npm

The source is transpiled to standard ES modules and published on npm.

```bash
# update CHANGES.md
npm version patch
npm publish
git push --tags origin master
npm run gh-pages
```

---
_Source: https://npm.io/package/@geoblocks/ol-maplibre-layer · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._