From 8a296179ea5733962d8679177992bddf3561bb35 Mon Sep 17 00:00:00 2001 From: Birk Skyum Date: Thu, 2 May 2024 11:12:53 +0200 Subject: [PATCH 1/5] Add maplibre in docs --- docs/README.md | 2 +- docs/get-started/get-started.md | 9 +++++---- docs/get-started/mapbox-tokens.md | 2 +- package.json | 2 +- website/docusaurus.config.js | 2 +- website/src/pages/index.jsx | 6 +++--- 6 files changed, 12 insertions(+), 11 deletions(-) diff --git a/docs/README.md b/docs/README.md index 793186025..5ff4db353 100644 --- a/docs/README.md +++ b/docs/README.md @@ -20,7 +20,7 @@ react-map-gl is a suite of [React](http://facebook.github.io/react/) components | Library | Description | | --- | --- | -| [MapLibre](https://github.com/MapLibre/maplibre-gl-js) | An open fork of mapbox-gl v1, that can be used without a mapbox token. | +| [MapLibre GL JS](https://github.com/MapLibre/maplibre-gl-js) | An open fork of mapbox-gl v1, that can be used without a mapbox token. | | [Mapbox GL JS v1](https://github.com/mapbox/mapbox-gl-js) | The previous version of mapbox GL JS. This version is free open source and can be used with non-mapbox basemaps without a mapbox token. | | [Mapbox GL JS v2](https://github.com/mapbox/mapbox-gl-js) | The latest version of Mapbox GL JS. Note that version 2 is not free open source, and a mapbox token is required and billable events are generated even if you do not use mapbox hosted basemaps. | | Other mapbox-gl forks | It may be possible to use react-map-gl with other mapbox forks, but this is not a supported use case. Minor PRs to enable other forks to be used may be accepted. | diff --git a/docs/get-started/get-started.md b/docs/get-started/get-started.md index 724266949..c123f7c10 100644 --- a/docs/get-started/get-started.md +++ b/docs/get-started/get-started.md @@ -126,10 +126,10 @@ import 'maplibre-gl/dist/maplibre-gl.css'; -## Using with a Compatible Fork +## Using with a MapLibre ```bash -npm install --save react-map-gl my-mapbox-fork +npm install --save react-map-gl maplibre-gl ``` Then override the `mapLib` prop of `Map`: @@ -137,11 +137,12 @@ Then override the `mapLib` prop of `Map`: ```tsx title="app.tsx" import * as React from 'react'; import Map from 'react-map-gl'; +import MapLibre from 'maplibre-gl'; // Include style sheet -import 'my-mapbox-fork/path/to/style-sheet.css'; +import 'maplibre-gl/dist/maplibre-gl.css'; function App() { - return ; + return ; } ``` diff --git a/docs/get-started/mapbox-tokens.md b/docs/get-started/mapbox-tokens.md index 6299f0609..669e4be26 100644 --- a/docs/get-started/mapbox-tokens.md +++ b/docs/get-started/mapbox-tokens.md @@ -4,7 +4,7 @@ Depending on which base map library you use, you may need a Mapbox token. You will need a Mapbox token if you use: - [mapbox-gl@>=2.0.0](https://github.com/mapbox/mapbox-gl-js/releases/tag/v2.0.0) - requires a mapbox access token in order to access the map renderer, and generates billable events regardlesss of whether you are displaying your own maps. -- `mapbox-gl@1.x` or `maplibre-gl@1.x` - requires an access token only if you load the map styles and tiles from Mapbox's data service. See "Display Maps Without A Mapbox Token" section below for using non-Mapbox tiles. +- `mapbox-gl@1.x` - requires an access token only if you load the map styles and tiles from Mapbox's data service. See "Display Maps Without A Mapbox Token" section below for using non-Mapbox tiles. To get a Mapbox token, you will need to register on [the Mapbox website](https://www.mapbox.com). The token will be used to identify you and start serving up map tiles. The service is free until a certain level of traffic is exceeded. diff --git a/package.json b/package.json index 2d3a48612..47136c0dc 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-map-gl", - "description": "React components for Mapbox GL JS-compatible libraries", + "description": "React components for MapLibre GL JS and Mapbox GL JS", "version": "7.2.0-beta.1", "keywords": [ "mapbox", diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js index 7e6b0d79e..0f8bcd153 100644 --- a/website/docusaurus.config.js +++ b/website/docusaurus.config.js @@ -9,7 +9,7 @@ const {resolve} = require('path'); /** @type {import('@docusaurus/types').Config} */ const config = { title: 'React Map GL', - tagline: 'React wrapper for Mapbox GL JS', + tagline: 'React wrapper for MapLibre GL JS and Mapbox GL JS', url: 'https://visgl.github.io/', baseUrl: '/react-map-gl/', onBrokenLinks: 'throw', diff --git a/website/src/pages/index.jsx b/website/src/pages/index.jsx index dda7b50e5..6799f435e 100644 --- a/website/src/pages/index.jsx +++ b/website/src/pages/index.jsx @@ -57,7 +57,7 @@ export default function IndexPage() {

- react-map-gl makes using Mapbox GL JS in React applications easy. + react-map-gl makes using MapLibre GL JS and Mapbox GL JS in React applications easy.

@@ -66,7 +66,7 @@ export default function IndexPage() { React Integration

- Use Mapbox GL JS Map as a fully controlled reactive component. + Use a MapLibre GL JS or Mapbox GL JS map as a fully controlled reactive component.

@@ -88,7 +88,7 @@ export default function IndexPage() { target="_blank" rel="noopener noreferrer"> deck.gl to render performant and compelling 2D and 3D - WebGL visualizations on top of your Mapbox GL JS based maps. + WebGL visualizations on top of your MapLibre GL JS and Mapbox GL JS based maps.

From 225370ab7eda008e37db016db4e695464c396635 Mon Sep 17 00:00:00 2001 From: Birk Skyum Date: Thu, 2 May 2024 11:18:47 +0200 Subject: [PATCH 2/5] typo --- docs/get-started/get-started.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/get-started/get-started.md b/docs/get-started/get-started.md index c123f7c10..ef71cb358 100644 --- a/docs/get-started/get-started.md +++ b/docs/get-started/get-started.md @@ -126,7 +126,7 @@ import 'maplibre-gl/dist/maplibre-gl.css'; -## Using with a MapLibre +## Use MapLibre GL JS ```bash npm install --save react-map-gl maplibre-gl From a9da94dba0c39b648b1c672b50382a3362cb3066 Mon Sep 17 00:00:00 2001 From: Birk Skyum Date: Thu, 2 May 2024 11:35:38 +0200 Subject: [PATCH 3/5] nit --- docs/get-started/get-started.md | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/docs/get-started/get-started.md b/docs/get-started/get-started.md index ef71cb358..4aa06b7e1 100644 --- a/docs/get-started/get-started.md +++ b/docs/get-started/get-started.md @@ -126,10 +126,10 @@ import 'maplibre-gl/dist/maplibre-gl.css'; -## Use MapLibre GL JS +## Using with a Compatible GL JS Fork ```bash -npm install --save react-map-gl maplibre-gl +npm install --save react-map-gl my-gl-js-fork ``` Then override the `mapLib` prop of `Map`: @@ -137,12 +137,11 @@ Then override the `mapLib` prop of `Map`: ```tsx title="app.tsx" import * as React from 'react'; import Map from 'react-map-gl'; -import MapLibre from 'maplibre-gl'; // Include style sheet -import 'maplibre-gl/dist/maplibre-gl.css'; +import 'my-gl-js-fork/path/to/style-sheet.css'; function App() { - return ; + return ; } -``` +``` \ No newline at end of file From 2bd2b62a8de25822c6a4bf0f24efb3787149352e Mon Sep 17 00:00:00 2001 From: Birk Skyum Date: Sat, 6 Jul 2024 00:02:59 +0200 Subject: [PATCH 4/5] revert change to header --- docs/get-started/get-started.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/get-started/get-started.md b/docs/get-started/get-started.md index 4aa06b7e1..93e47cd08 100644 --- a/docs/get-started/get-started.md +++ b/docs/get-started/get-started.md @@ -126,7 +126,7 @@ import 'maplibre-gl/dist/maplibre-gl.css'; -## Using with a Compatible GL JS Fork +## Using with a Compatible Fork ```bash npm install --save react-map-gl my-gl-js-fork From 3028680c2ec8350e93322d9e086a700a063d52f6 Mon Sep 17 00:00:00 2001 From: Birk Skyum Date: Sat, 6 Jul 2024 00:22:38 +0200 Subject: [PATCH 5/5] adapt naming --- docs/get-started/get-started.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/get-started/get-started.md b/docs/get-started/get-started.md index 93e47cd08..ce2a06f58 100644 --- a/docs/get-started/get-started.md +++ b/docs/get-started/get-started.md @@ -129,7 +129,7 @@ import 'maplibre-gl/dist/maplibre-gl.css'; ## Using with a Compatible Fork ```bash -npm install --save react-map-gl my-gl-js-fork +npm install --save react-map-gl my-map-gl-fork ``` Then override the `mapLib` prop of `Map`: @@ -139,9 +139,9 @@ import * as React from 'react'; import Map from 'react-map-gl'; // Include style sheet -import 'my-gl-js-fork/path/to/style-sheet.css'; +import 'my-map-gl-fork/path/to/style-sheet.css'; function App() { - return ; + return ; } ``` \ No newline at end of file