= props.viewState || props;
let changed = false;
- if ('longitude' in v && 'latitude' in v) {
- const center = tr.center;
- // @ts-ignore
- tr.center = new center.constructor(v.longitude, v.latitude);
- changed = changed || center !== tr.center;
- }
if ('zoom' in v) {
const zoom = tr.zoom;
tr.zoom = v.zoom;
@@ -82,5 +76,11 @@ export function applyViewStateToTransform(tr: Transform, props: MapboxProps): bo
changed = true;
tr.padding = v.padding;
}
+ if ('longitude' in v && 'latitude' in v) {
+ const center = tr.center;
+ // @ts-ignore
+ tr.center = new center.constructor(v.longitude, v.latitude);
+ changed = changed || center !== tr.center;
+ }
return changed;
}
diff --git a/test/src/utils/transform.spec.js b/test/src/utils/transform.spec.js
index 28876a77d..ddd04cf75 100644
--- a/test/src/utils/transform.spec.js
+++ b/test/src/utils/transform.spec.js
@@ -90,5 +90,11 @@ test('applyViewStateToTransform', t => {
changed = applyViewStateToTransform(tr, {viewState: {pitch: 30}});
t.notOk(changed, 'nothing changed');
+ applyViewStateToTransform(tr, {longitude: 0, latitude: 0, zoom: 0});
+ changed = applyViewStateToTransform(tr, {longitude: 12, latitude: 34, zoom: 15});
+ t.ok(changed, 'center and zoom changed');
+ t.equal(tr.zoom, 15, 'zoom is correct');
+ t.equal(tr.center.lat, 34, 'center latitude is correct');
+
t.end();
});
diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js
index 7e6b0d79e..345d83d2e 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',
@@ -164,8 +164,8 @@ const config = {
href: 'https://loaders.gl'
},
{
- label: 'nebula.gl',
- href: 'https://nebula.gl'
+ label: 'kepler.gl',
+ href: 'https://kepler.gl'
}
]
},
@@ -187,7 +187,7 @@ const config = {
]
}
],
- copyright: `Copyright © ${new Date().getFullYear()} OpenJS Foundation`
+ copyright: 'Copyright OpenJS Foundation and vis.gl contributors. All rights reserved. The OpenJS Foundation has registered trademarks and uses trademarks. For a list of trademarks of the OpenJS Foundation, please see our Trademark Policy and Trademark List. Trademarks and logos not indicated on the list of OpenJS Foundation trademarks are trademarks™ or registered® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them.
The OpenJS Foundation | Terms of Use | Privacy Policy | Bylaws | Code of Conduct | Trademark Policy | Trademark List | Cookie Policy
'
},
prism: {
theme: lightCodeTheme,
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.