From a71cdf9ba27fcbec638b5326733cec1b1d5420aa Mon Sep 17 00:00:00 2001 From: Xiaoji Chen Date: Mon, 6 Jan 2020 15:21:02 -0800 Subject: [PATCH] Export WebMercatorViewport (#979) --- docs/advanced/viewport-transition.md | 4 ++-- docs/components/static-map.md | 4 ++-- examples/zoom-to-bounds/src/app.js | 3 +-- src/index.js | 1 + src/utils/map-controller.js | 3 ++- website/.eslintrc | 3 ++- website/src/constants/pages.js | 6 ++++++ 7 files changed, 16 insertions(+), 8 deletions(-) diff --git a/docs/advanced/viewport-transition.md b/docs/advanced/viewport-transition.md index 1e405d52f..55a99b546 100644 --- a/docs/advanced/viewport-transition.md +++ b/docs/advanced/viewport-transition.md @@ -55,7 +55,7 @@ See [viewport animation](#examples/viewport-animation) for a complete example. You can use the `WebMercatorViewport` utility to find the target viewport that fits around a lngLat bounding box: ```js -import WebMercatorViewport from 'viewport-mercator-project'; +import {WebMercatorViewport} from 'react-map-gl'; ``` ```js @@ -78,7 +78,7 @@ import WebMercatorViewport from 'viewport-mercator-project'; }; ``` -[Documentation of WebMercatorViewport](https://uber-common.github.io/viewport-mercator-project/#/documentation/api-reference/webmercatorviewport) +[Documentation of WebMercatorViewport](https://uber.github.io/react-map-gl/#/documentation/api-reference/web-mercator-viewport) ## InteractiveMap's Transition Props diff --git a/docs/components/static-map.md b/docs/components/static-map.md index d7408b6d3..e403f6a2b 100644 --- a/docs/components/static-map.md +++ b/docs/components/static-map.md @@ -202,7 +202,7 @@ Parameters: You can use the `WebMercatorViewport` utility to find the target viewport that fits around a lngLat bounding box: ```js -import WebMercatorViewport from 'viewport-mercator-project'; +import {WebMercatorViewport} from 'react-map-gl'; const viewport = new WebMercatorViewport({width: 800, height: 600}) .fitBounds([[-122.4, 37.7], [-122.5, 37.8]], { @@ -220,7 +220,7 @@ const viewport = new WebMercatorViewport({width: 800, height: 600}) */ ``` -[Documentation of WebMercatorViewport](https://uber-common.github.io/viewport-mercator-project/#/documentation/api-reference/webmercatorviewport) +[Documentation of WebMercatorViewport](https://uber.github.io/react-map-gl/#/documentation/api-reference/web-mercator-viewport) ## Source diff --git a/examples/zoom-to-bounds/src/app.js b/examples/zoom-to-bounds/src/app.js index 2c1340b46..4e172515f 100644 --- a/examples/zoom-to-bounds/src/app.js +++ b/examples/zoom-to-bounds/src/app.js @@ -1,7 +1,6 @@ import React, {Component} from 'react'; import {render} from 'react-dom'; -import MapGL, {LinearInterpolator} from 'react-map-gl'; -import WebMercatorViewport from 'viewport-mercator-project'; +import MapGL, {LinearInterpolator, WebMercatorViewport} from 'react-map-gl'; import bbox from '@turf/bbox'; import ControlPanel from './control-panel'; diff --git a/src/index.js b/src/index.js index 1e3050ea7..e858bee15 100644 --- a/src/index.js +++ b/src/index.js @@ -47,6 +47,7 @@ export { ViewportFlyToInterpolator as FlyToInterpolator } from './utils/transition'; export {default as MapController} from './utils/map-controller'; +export {WebMercatorViewport} from 'viewport-mercator-project'; // Experimental Features (May change in minor version bumps, use at your own risk) export {default as _MapContext} from './components/map-context'; diff --git a/src/utils/map-controller.js b/src/utils/map-controller.js index 95ac55cc2..8cac79d65 100644 --- a/src/utils/map-controller.js +++ b/src/utils/map-controller.js @@ -135,7 +135,8 @@ export default class MapController { /* Callback util */ // formats map state and invokes callback function updateViewport(newMapState: MapState, extraProps: any = {}, extraState: any = {}) { - const oldViewport = this.mapState ? this.mapState.getViewportProps() : this.mapStateProps; + // Always trigger callback on initial update (resize) + const oldViewport = this.mapState ? this.mapState.getViewportProps() : {}; const newViewport = Object.assign({}, newMapState.getViewportProps(), extraProps); const viewStateChanged = Object.keys(newViewport).some( diff --git a/website/.eslintrc b/website/.eslintrc index 6abb0a165..5988d3b07 100644 --- a/website/.eslintrc +++ b/website/.eslintrc @@ -5,7 +5,8 @@ ], "extends": [ "eslint-config-uber-jsx", - "eslint-config-uber-es2015" + "eslint-config-uber-es2015", + "prettier" ], "overrides": [{ "files": ["webpack/*.js"], diff --git a/website/src/constants/pages.js b/website/src/constants/pages.js index 604267e21..c035bcc01 100644 --- a/website/src/constants/pages.js +++ b/website/src/constants/pages.js @@ -178,6 +178,12 @@ const docPages = { { name: 'SVGOverlay', content: getDocUrl('overlays/svg-overlay.md') + }, + { + name: 'WebMercatorViewport', + // External content + content: + 'https://raw.githubusercontent.com/uber-web/math.gl/master/modules/web-mercator/docs/api-reference/web-mercator-viewport.md' } ] }