diff --git a/404.html b/404.html index 5cd2aa43..de82b92f 100644 --- a/404.html +++ b/404.html @@ -4,13 +4,13 @@ React Map GL - +
- + \ No newline at end of file diff --git a/assets/js/12488a06.a16db516.js b/assets/js/12488a06.a16db516.js new file mode 100644 index 00000000..908b569e --- /dev/null +++ b/assets/js/12488a06.a16db516.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkreact_map_gl_website=self.webpackChunkreact_map_gl_website||[]).push([[5004],{3905:(e,t,r)=>{r.d(t,{Zo:()=>l,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var u=n.createContext({}),c=function(e){var t=n.useContext(u),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},l=function(e){var t=c(e.components);return n.createElement(u.Provider,{value:t},e.children)},f="mdxType",p={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},d=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,l=s(e,["components","mdxType","originalType","parentName"]),f=c(r),d=o,m=f["".concat(u,".").concat(d)]||f[d]||p[d]||a;return r?n.createElement(m,i(i({ref:t},l),{},{components:r})):n.createElement(m,i({ref:t},l))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=d;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[f]="string"==typeof e?e:o,i[1]=s;for(var c=2;c{r.r(t),r.d(t,{assets:()=>b,contentTitle:()=>h,default:()=>w,frontMatter:()=>g,metadata:()=>y,toc:()=>_});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945));function u(){return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Create and Style Clusters"),a.createElement("p",null,"Use Mapbox GL JS' built-in functions to visualize points as clusters."),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/clusters",target:"_new"},"View Code \u2197")))}const c=a.memo(u);var l={id:"clusters",type:"circle",source:"earthquakes",filter:["has","point_count"],paint:{"circle-color":["step",["get","point_count"],"#51bbd6",100,"#f1f075",750,"#f28cb1"],"circle-radius":["step",["get","point_count"],20,100,30,750,40]}},f={id:"cluster-count",type:"symbol",source:"earthquakes",filter:["has","point_count"],layout:{"text-field":"{point_count_abbreviated}","text-font":["DIN Offc Pro Medium","Arial Unicode MS Bold"],"text-size":12}},p={id:"unclustered-point",type:"circle",source:"earthquakes",filter:["!",["has","point_count"]],paint:{"circle-color":"#11b4da","circle-radius":4,"circle-stroke-width":1,"circle-stroke-color":"#fff"}},d="";function m(){var e=(0,a.useRef)(null);return a.createElement(a.Fragment,null,a.createElement(s.D5,{initialViewState:{latitude:40.67,longitude:-103.59,zoom:3},mapStyle:"mapbox://styles/mapbox/dark-v9",mapboxAccessToken:d,interactiveLayerIds:[l.id],onClick:function(t){var r=t.features[0],n=r.properties.cluster_id;e.current.getSource("earthquakes").getClusterExpansionZoom(n,(function(t,n){t||e.current.easeTo({center:r.geometry.coordinates,zoom:n,duration:500})}))},ref:e},a.createElement(s.Hw,{id:"earthquakes",type:"geojson",data:"https://docs.mapbox.com/mapbox-gl-js/assets/earthquakes.geojson",cluster:!0,clusterMaxZoom:14,clusterRadius:50},a.createElement(s.mh,l),a.createElement(s.mh,f),a.createElement(s.mh,p))),a.createElement(c,null))}var v=["components"],g={},h="Clusters",y={unversionedId:"clusters",id:"clusters",title:"Clusters",description:"",source:"@site/src/examples/clusters.mdx",sourceDirName:".",slug:"/clusters",permalink:"/react-map-gl/examples/clusters",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"GeoJSON Animation",permalink:"/react-map-gl/examples/geojson-animation"},next:{title:"Limit Map Interaction",permalink:"/react-map-gl/examples/interaction"}},b={},_=[],E={toc:_},x="wrapper";function w(e){var t=e.components,r=(0,o.Z)(e,v);return(0,i.kt)(x,(0,n.Z)({},E,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"clusters"},"Clusters"),(0,i.kt)(m,{mdxType:"App"}))}w.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>K,Pv:()=>ee,GI:()=>Y,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>Z});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?d:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:p(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var c=new this._MapClass(a);i.padding&&c.setPadding(i.padding),r.cursor&&(c.getCanvas().style.cursor=r.cursor),this._createShadowTransform(c);var l=c._render;c._render=function(e){t._inRender=!0,l.call(c,e),t._inRender=!1};var f=c._renderTaskQueue.run;c._renderTaskQueue.run=function(e){f.call(c._renderTaskQueue,e),t._onBeforeRepaint()},c.on("render",(function(){return t._onAfterRepaint()}));var h=c.fire;for(var y in c.fire=this._fireEvent.bind(this,h),c.on("resize",(function(){t._renderTransform.resize(c.transform.width,c.transform.height)})),c.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(c.transform,t._renderTransform)})),c.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)c.on(y,this._onPointerEvent);for(var b in v)c.on(b,this._onCameraEvent);for(var E in g)c.on(E,this._onEvent);this._map=c},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var l=c(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),l&&t){var f=this._deferredEvents;f.move=!0,f.zoom||(f.zoom=o!==n.zoom),f.rotate||(f.rotate=i!==n.bearing),f.pitch||(f.pitch=a!==n.pitch)}return s||c(r.transform,e),l},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function x(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a},queryRenderedFeatures:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryRenderedFeatures(t,n);return r.transform=o,a}},o=(0,l.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,l.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const w="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var S=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var L=n.createContext(null);function C(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],c=(0,n.useRef)(),f=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,l.Z)(S);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,c.current)),t||(t=new b(n.Map,e,c.current)),f.map=x(t),f.mapLib=n,u(t),null==a||a.onMapMount(f.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),w((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return f.map}),[s]);var p=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:c,style:p},s&&n.createElement(L.Provider,{value:f},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var P=r(3935),O=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function M(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!O.test(n)?r[n]=o+"px":r[n]=o}}}function j(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,c,l,f,p,d,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,b=void 0!==y&&y,_=e.popup,E=void 0===_?null:_,x=e.rotation,w=void 0===x?0:x,S=e.rotationAlignment,C=void 0===S?"auto":S,O=e.pitchAlignment,j=void 0===O?"auto":O;return(0,n.useEffect)((function(){M(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),c=g,l=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,p=Array.isArray(c)?c[0]:c?c.x:0,d=Array.isArray(c)?c[1]:c?c.y:0,l!==p||f!==d)&&s.setOffset(g),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==w&&s.setRotation(w),s.getRotationAlignment()!==C&&s.setRotationAlignment(C),s.getPitchAlignment()!==j&&s.setPitchAlignment(j),s.getPopup()!==E&&s.setPopup(E),(0,P.createPortal)(e.children,s.getElement())}const T=(0,n.memo)((0,n.forwardRef)(j));function k(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var c=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return c.on("close",e),c.setDOMContent(s).addTo(o.getMap()),function(){c.off("close",e),c.isOpen()&&c.remove()}}),[]),(0,n.useEffect)((function(){M(c.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return c}),[]),c.isOpen()&&(c.getLngLat().lng===e.longitude&&c.getLngLat().lat===e.latitude||c.setLngLat([e.longitude,e.latitude]),e.offset&&!i(c.options.offset,e.offset)&&c.setOffset(e.offset),c.options.anchor===e.anchor&&c.options.maxWidth===e.maxWidth||(c.options.anchor=e.anchor,c.setMaxWidth(e.maxWidth)),c.options.className!==e.className)){for(var f,p=k(c.options.className),d=k(e.className),m=(0,l.Z)(p);!(f=m()).done;){var v=f.value;d.has(v)||c.removeClassName(v)}for(var g,h=(0,l.Z)(d);!(g=h()).done;){var y=g.value;p.has(y)||c.addClassName(y)}c.options.className=e.className}return(0,P.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(R));const Z=function(e,t,r,o){var a=(0,n.useContext)(L),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function I(e){var t=Z((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){M(t._controlContainer,e.style)}),[e.style]),null}const A=(0,n.memo)(I);function D(e,t){var r=(0,n.useRef)({props:e}),o=Z((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){M(o._container,e.style)}),[e.style]),null}const N=(0,n.memo)((0,n.forwardRef)(D));function F(e){var t=Z((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){M(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(F);function q(e){var t=Z((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){M(t._container,a)}),[a]),null}const B=(0,n.memo)(q);function W(e,t){if(!e)throw new Error(t)}var H=0;const V=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+H++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(W(r.id===n.id,"layer id changed"),W(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,c=r.filter,l=r.minzoom,f=r.maxzoom,p=r.beforeId;if(p!==n.beforeId&&e.moveLayer(t,p),a!==n.layout){var d=n.layout||{};for(var m in a)i(a[m],d[m])||e.setLayoutProperty(t,m,a[m]);for(var v in d)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(c,n.filter)||e.setFilter(t,c),l===n.minzoom&&f===n.maxzoom||e.setLayerZoomRange(t,l,f)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var G=0;const J=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+G++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,l.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){W(t.id===r.id,"source id changed"),W(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return C(e,t,Q)})),K=T,Y=z,$=A,ee=U,te=N,re=B,ne=V,oe=J;const ae=X},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{r.d(t,{Zo:()=>l,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var u=n.createContext({}),c=function(e){var t=n.useContext(u),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},l=function(e){var t=c(e.components);return n.createElement(u.Provider,{value:t},e.children)},p="mdxType",f={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},d=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,l=s(e,["components","mdxType","originalType","parentName"]),p=c(r),d=o,m=p["".concat(u,".").concat(d)]||p[d]||f[d]||a;return r?n.createElement(m,i(i({ref:t},l),{},{components:r})):n.createElement(m,i({ref:t},l))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=d;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[p]="string"==typeof e?e:o,i[1]=s;for(var c=2;c{r.r(t),r.d(t,{assets:()=>b,contentTitle:()=>h,default:()=>w,frontMatter:()=>g,metadata:()=>y,toc:()=>_});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945));function u(){return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Create and Style Clusters"),a.createElement("p",null,"Use Mapbox GL JS' built-in functions to visualize points as clusters."),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/clusters",target:"_new"},"View Code \u2197")))}const c=a.memo(u);var l={id:"clusters",type:"circle",source:"earthquakes",filter:["has","point_count"],paint:{"circle-color":["step",["get","point_count"],"#51bbd6",100,"#f1f075",750,"#f28cb1"],"circle-radius":["step",["get","point_count"],20,100,30,750,40]}},p={id:"cluster-count",type:"symbol",source:"earthquakes",filter:["has","point_count"],layout:{"text-field":"{point_count_abbreviated}","text-font":["DIN Offc Pro Medium","Arial Unicode MS Bold"],"text-size":12}},f={id:"unclustered-point",type:"circle",source:"earthquakes",filter:["!",["has","point_count"]],paint:{"circle-color":"#11b4da","circle-radius":4,"circle-stroke-width":1,"circle-stroke-color":"#fff"}},d="";function m(){var e=(0,a.useRef)(null);return a.createElement(a.Fragment,null,a.createElement(s.D5,{initialViewState:{latitude:40.67,longitude:-103.59,zoom:3},mapStyle:"mapbox://styles/mapbox/dark-v9",mapboxAccessToken:d,interactiveLayerIds:[l.id],onClick:function(t){var r=t.features[0],n=r.properties.cluster_id;e.current.getSource("earthquakes").getClusterExpansionZoom(n,(function(t,n){t||e.current.easeTo({center:r.geometry.coordinates,zoom:n,duration:500})}))},ref:e},a.createElement(s.Hw,{id:"earthquakes",type:"geojson",data:"https://docs.mapbox.com/mapbox-gl-js/assets/earthquakes.geojson",cluster:!0,clusterMaxZoom:14,clusterRadius:50},a.createElement(s.mh,l),a.createElement(s.mh,p),a.createElement(s.mh,f))),a.createElement(c,null))}var v=["components"],g={},h="Clusters",y={unversionedId:"clusters",id:"clusters",title:"Clusters",description:"",source:"@site/src/examples/clusters.mdx",sourceDirName:".",slug:"/clusters",permalink:"/react-map-gl/examples/clusters",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"GeoJSON Animation",permalink:"/react-map-gl/examples/geojson-animation"},next:{title:"Limit Map Interaction",permalink:"/react-map-gl/examples/interaction"}},b={},_=[],E={toc:_},x="wrapper";function w(e){var t=e.components,r=(0,o.Z)(e,v);return(0,i.kt)(x,(0,n.Z)({},E,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"clusters"},"Clusters"),(0,i.kt)(m,{mdxType:"App"}))}w.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>K,Pv:()=>ee,GI:()=>Y,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>Z});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?d:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:f(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var c=new this._MapClass(a);i.padding&&c.setPadding(i.padding),r.cursor&&(c.getCanvas().style.cursor=r.cursor),this._createShadowTransform(c);var l=c._render;c._render=function(e){t._inRender=!0,l.call(c,e),t._inRender=!1};var p=c._renderTaskQueue.run;c._renderTaskQueue.run=function(e){p.call(c._renderTaskQueue,e),t._onBeforeRepaint()},c.on("render",(function(){return t._onAfterRepaint()}));var h=c.fire;for(var y in c.fire=this._fireEvent.bind(this,h),c.on("resize",(function(){t._renderTransform.resize(c.transform.width,c.transform.height)})),c.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(c.transform,t._renderTransform)})),c.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)c.on(y,this._onPointerEvent);for(var b in v)c.on(b,this._onCameraEvent);for(var E in g)c.on(E,this._onEvent);this._map=c},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var l=c(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),l&&t){var p=this._deferredEvents;p.move=!0,p.zoom||(p.zoom=o!==n.zoom),p.rotate||(p.rotate=i!==n.bearing),p.pitch||(p.pitch=a!==n.pitch)}return s||c(r.transform,e),l},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function x(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a}},o=(0,l.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,l.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const w="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var S=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var L=n.createContext(null);function C(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],c=(0,n.useRef)(),p=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,l.Z)(S);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,c.current)),t||(t=new b(n.Map,e,c.current)),p.map=x(t),p.mapLib=n,u(t),null==a||a.onMapMount(p.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),w((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return p.map}),[s]);var f=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:c,style:f},s&&n.createElement(L.Provider,{value:p},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var P=r(3935),O=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function M(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!O.test(n)?r[n]=o+"px":r[n]=o}}}function j(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,c,l,p,f,d,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,b=void 0!==y&&y,_=e.popup,E=void 0===_?null:_,x=e.rotation,w=void 0===x?0:x,S=e.rotationAlignment,C=void 0===S?"auto":S,O=e.pitchAlignment,j=void 0===O?"auto":O;return(0,n.useEffect)((function(){M(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),c=g,l=Array.isArray(u)?u[0]:u?u.x:0,p=Array.isArray(u)?u[1]:u?u.y:0,f=Array.isArray(c)?c[0]:c?c.x:0,d=Array.isArray(c)?c[1]:c?c.y:0,l!==f||p!==d)&&s.setOffset(g),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==w&&s.setRotation(w),s.getRotationAlignment()!==C&&s.setRotationAlignment(C),s.getPitchAlignment()!==j&&s.setPitchAlignment(j),s.getPopup()!==E&&s.setPopup(E),(0,P.createPortal)(e.children,s.getElement())}const T=(0,n.memo)((0,n.forwardRef)(j));function k(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var c=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return c.on("close",e),c.setDOMContent(s).addTo(o.getMap()),function(){c.off("close",e),c.isOpen()&&c.remove()}}),[]),(0,n.useEffect)((function(){M(c.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return c}),[]),c.isOpen()&&(c.getLngLat().lng===e.longitude&&c.getLngLat().lat===e.latitude||c.setLngLat([e.longitude,e.latitude]),e.offset&&!i(c.options.offset,e.offset)&&c.setOffset(e.offset),c.options.anchor===e.anchor&&c.options.maxWidth===e.maxWidth||(c.options.anchor=e.anchor,c.setMaxWidth(e.maxWidth)),c.options.className!==e.className)){for(var p,f=k(c.options.className),d=k(e.className),m=(0,l.Z)(f);!(p=m()).done;){var v=p.value;d.has(v)||c.removeClassName(v)}for(var g,h=(0,l.Z)(d);!(g=h()).done;){var y=g.value;f.has(y)||c.addClassName(y)}c.options.className=e.className}return(0,P.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(R));const Z=function(e,t,r,o){var a=(0,n.useContext)(L),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function I(e){var t=Z((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){M(t._controlContainer,e.style)}),[e.style]),null}const A=(0,n.memo)(I);function D(e,t){var r=(0,n.useRef)({props:e}),o=Z((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){M(o._container,e.style)}),[e.style]),null}const N=(0,n.memo)((0,n.forwardRef)(D));function F(e){var t=Z((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){M(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(F);function B(e){var t=Z((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){M(t._container,a)}),[a]),null}const q=(0,n.memo)(B);function W(e,t){if(!e)throw new Error(t)}var H=0;const V=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+H++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(W(r.id===n.id,"layer id changed"),W(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,c=r.filter,l=r.minzoom,p=r.maxzoom,f=r.beforeId;if(f!==n.beforeId&&e.moveLayer(t,f),a!==n.layout){var d=n.layout||{};for(var m in a)i(a[m],d[m])||e.setLayoutProperty(t,m,a[m]);for(var v in d)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(c,n.filter)||e.setFilter(t,c),l===n.minzoom&&p===n.maxzoom||e.setLayerZoomRange(t,l,p)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var G=0;const J=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+G++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,l.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){W(t.id===r.id,"source id changed"),W(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return C(e,t,Q)})),K=T,Y=z,$=A,ee=U,te=N,re=q,ne=V,oe=J;const ae=X},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{r.d(t,{Zo:()=>l,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var u=n.createContext({}),c=function(e){var t=n.useContext(u),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},l=function(e){var t=c(e.components);return n.createElement(u.Provider,{value:t},e.children)},f="mdxType",d={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},p=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,l=s(e,["components","mdxType","originalType","parentName"]),f=c(r),p=o,m=f["".concat(u,".").concat(p)]||f[p]||d[p]||a;return r?n.createElement(m,i(i({ref:t},l),{},{components:r})):n.createElement(m,i({ref:t},l))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=p;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[f]="string"==typeof e?e:o,i[1]=s;for(var c=2;c{r.r(t),r.d(t,{assets:()=>y,contentTitle:()=>g,default:()=>S,frontMatter:()=>v,metadata:()=>h,toc:()=>b});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945));function u(e){var t=(0,a.useCallback)((function(t){e.onModeChange(t.target.value)}),[e.onModeChange]);return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Side by Side"),a.createElement("p",null,"Synchronize two maps."),a.createElement("div",null,a.createElement("label",null,"Mode: "),a.createElement("select",{value:e.mode,onChange:t},a.createElement("option",{value:"side-by-side"},"Side by side"),a.createElement("option",{value:"split-screen"},"Split screen"))),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/side-by-side",target:"_new"},"View Code \u2197")))}const c=a.memo(u);var l="",f={position:"absolute",width:"50%",height:"100%"},d={position:"absolute",left:"50%",width:"50%",height:"100%"};function p(){var e=(0,a.useState)({longitude:-122.43,latitude:37.78,zoom:12,pitch:30}),t=e[0],r=e[1],o=(0,a.useState)("side-by-side"),i=o[0],u=o[1],p=(0,a.useState)("left"),m=p[0],v=p[1],g=(0,a.useCallback)((function(){return v("left")}),[]),h=(0,a.useCallback)((function(){return v("right")}),[]),y=(0,a.useCallback)((function(e){return r(e.viewState)}),[]),b="undefined"==typeof window?100:window.innerWidth,_=(0,a.useMemo)((function(){return{left:"split-screen"===i?b/2:0,top:0,right:0,bottom:0}}),[b,i]),E=(0,a.useMemo)((function(){return{right:"split-screen"===i?b/2:0,top:0,left:0,bottom:0}}),[b,i]);return a.createElement(a.Fragment,null,a.createElement("div",{style:{position:"relative",height:"100%"}},a.createElement(s.ZP,(0,n.Z)({id:"left-map"},t,{padding:_,onMoveStart:g,onMove:"left"===m&&y,style:f,mapStyle:"mapbox://styles/mapbox/light-v9",mapboxAccessToken:l})),a.createElement(s.ZP,(0,n.Z)({id:"right-map"},t,{padding:E,onMoveStart:h,onMove:"right"===m&&y,style:d,mapStyle:"mapbox://styles/mapbox/dark-v9",mapboxAccessToken:l}))),a.createElement(c,{mode:i,onModeChange:u}))}var m=["components"],v={},g="Side by Side",h={unversionedId:"side-by-side",id:"side-by-side",title:"Side by Side",description:"",source:"@site/src/examples/side-by-side.mdx",sourceDirName:".",slug:"/side-by-side",permalink:"/react-map-gl/examples/side-by-side",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Geocoder",permalink:"/react-map-gl/examples/geocoder"}},y={},b=[],_={toc:b},E="wrapper";function S(e){var t=e.components,r=(0,o.Z)(e,m);return(0,i.kt)(E,(0,n.Z)({},_,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"side-by-side"},"Side by Side"),(0,i.kt)(p,{mdxType:"App"}))}S.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>K,Pv:()=>ee,GI:()=>Y,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>Z});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?p:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:d(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var c=new this._MapClass(a);i.padding&&c.setPadding(i.padding),r.cursor&&(c.getCanvas().style.cursor=r.cursor),this._createShadowTransform(c);var l=c._render;c._render=function(e){t._inRender=!0,l.call(c,e),t._inRender=!1};var f=c._renderTaskQueue.run;c._renderTaskQueue.run=function(e){f.call(c._renderTaskQueue,e),t._onBeforeRepaint()},c.on("render",(function(){return t._onAfterRepaint()}));var h=c.fire;for(var y in c.fire=this._fireEvent.bind(this,h),c.on("resize",(function(){t._renderTransform.resize(c.transform.width,c.transform.height)})),c.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(c.transform,t._renderTransform)})),c.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)c.on(y,this._onPointerEvent);for(var b in v)c.on(b,this._onCameraEvent);for(var E in g)c.on(E,this._onEvent);this._map=c},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var l=c(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),l&&t){var f=this._deferredEvents;f.move=!0,f.zoom||(f.zoom=o!==n.zoom),f.rotate||(f.rotate=i!==n.bearing),f.pitch||(f.pitch=a!==n.pitch)}return s||c(r.transform,e),l},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function S(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a},queryRenderedFeatures:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryRenderedFeatures(t,n);return r.transform=o,a}},o=(0,l.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,l.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const w="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var x=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var C=n.createContext(null);function L(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],c=(0,n.useRef)(),f=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,l.Z)(x);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,c.current)),t||(t=new b(n.Map,e,c.current)),f.map=S(t),f.mapLib=n,u(t),null==a||a.onMapMount(f.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),w((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return f.map}),[s]);var d=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:c,style:d},s&&n.createElement(C.Provider,{value:f},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var P=r(3935),M=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function O(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!M.test(n)?r[n]=o+"px":r[n]=o}}}function T(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,c,l,f,d,p,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,b=void 0!==y&&y,_=e.popup,E=void 0===_?null:_,S=e.rotation,w=void 0===S?0:S,x=e.rotationAlignment,L=void 0===x?"auto":x,M=e.pitchAlignment,T=void 0===M?"auto":M;return(0,n.useEffect)((function(){O(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),c=g,l=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,d=Array.isArray(c)?c[0]:c?c.x:0,p=Array.isArray(c)?c[1]:c?c.y:0,l!==d||f!==p)&&s.setOffset(g),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==w&&s.setRotation(w),s.getRotationAlignment()!==L&&s.setRotationAlignment(L),s.getPitchAlignment()!==T&&s.setPitchAlignment(T),s.getPopup()!==E&&s.setPopup(E),(0,P.createPortal)(e.children,s.getElement())}const j=(0,n.memo)((0,n.forwardRef)(T));function k(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var c=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return c.on("close",e),c.setDOMContent(s).addTo(o.getMap()),function(){c.off("close",e),c.isOpen()&&c.remove()}}),[]),(0,n.useEffect)((function(){O(c.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return c}),[]),c.isOpen()&&(c.getLngLat().lng===e.longitude&&c.getLngLat().lat===e.latitude||c.setLngLat([e.longitude,e.latitude]),e.offset&&!i(c.options.offset,e.offset)&&c.setOffset(e.offset),c.options.anchor===e.anchor&&c.options.maxWidth===e.maxWidth||(c.options.anchor=e.anchor,c.setMaxWidth(e.maxWidth)),c.options.className!==e.className)){for(var f,d=k(c.options.className),p=k(e.className),m=(0,l.Z)(d);!(f=m()).done;){var v=f.value;p.has(v)||c.removeClassName(v)}for(var g,h=(0,l.Z)(p);!(g=h()).done;){var y=g.value;d.has(y)||c.addClassName(y)}c.options.className=e.className}return(0,P.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(R));const Z=function(e,t,r,o){var a=(0,n.useContext)(C),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function I(e){var t=Z((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){O(t._controlContainer,e.style)}),[e.style]),null}const A=(0,n.memo)(I);function D(e,t){var r=(0,n.useRef)({props:e}),o=Z((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){O(o._container,e.style)}),[e.style]),null}const N=(0,n.memo)((0,n.forwardRef)(D));function F(e){var t=Z((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){O(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(F);function W(e){var t=Z((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){O(t._container,a)}),[a]),null}const B=(0,n.memo)(W);function H(e,t){if(!e)throw new Error(t)}var q=0;const V=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+q++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(H(r.id===n.id,"layer id changed"),H(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,c=r.filter,l=r.minzoom,f=r.maxzoom,d=r.beforeId;if(d!==n.beforeId&&e.moveLayer(t,d),a!==n.layout){var p=n.layout||{};for(var m in a)i(a[m],p[m])||e.setLayoutProperty(t,m,a[m]);for(var v in p)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(c,n.filter)||e.setFilter(t,c),l===n.minzoom&&f===n.maxzoom||e.setLayerZoomRange(t,l,f)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var G=0;const J=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+G++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,l.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){H(t.id===r.id,"source id changed"),H(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return L(e,t,Q)})),K=j,Y=z,$=A,ee=U,te=N,re=B,ne=V,oe=J;const ae=X},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{r.d(t,{Zo:()=>l,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var u=n.createContext({}),c=function(e){var t=n.useContext(u),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},l=function(e){var t=c(e.components);return n.createElement(u.Provider,{value:t},e.children)},p="mdxType",d={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},f=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,l=s(e,["components","mdxType","originalType","parentName"]),p=c(r),f=o,m=p["".concat(u,".").concat(f)]||p[f]||d[f]||a;return r?n.createElement(m,i(i({ref:t},l),{},{components:r})):n.createElement(m,i({ref:t},l))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=f;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[p]="string"==typeof e?e:o,i[1]=s;for(var c=2;c{r.r(t),r.d(t,{assets:()=>y,contentTitle:()=>g,default:()=>S,frontMatter:()=>v,metadata:()=>h,toc:()=>b});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945));function u(e){var t=(0,a.useCallback)((function(t){e.onModeChange(t.target.value)}),[e.onModeChange]);return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Side by Side"),a.createElement("p",null,"Synchronize two maps."),a.createElement("div",null,a.createElement("label",null,"Mode: "),a.createElement("select",{value:e.mode,onChange:t},a.createElement("option",{value:"side-by-side"},"Side by side"),a.createElement("option",{value:"split-screen"},"Split screen"))),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/side-by-side",target:"_new"},"View Code \u2197")))}const c=a.memo(u);var l="",p={position:"absolute",width:"50%",height:"100%"},d={position:"absolute",left:"50%",width:"50%",height:"100%"};function f(){var e=(0,a.useState)({longitude:-122.43,latitude:37.78,zoom:12,pitch:30}),t=e[0],r=e[1],o=(0,a.useState)("side-by-side"),i=o[0],u=o[1],f=(0,a.useState)("left"),m=f[0],v=f[1],g=(0,a.useCallback)((function(){return v("left")}),[]),h=(0,a.useCallback)((function(){return v("right")}),[]),y=(0,a.useCallback)((function(e){return r(e.viewState)}),[]),b="undefined"==typeof window?100:window.innerWidth,_=(0,a.useMemo)((function(){return{left:"split-screen"===i?b/2:0,top:0,right:0,bottom:0}}),[b,i]),E=(0,a.useMemo)((function(){return{right:"split-screen"===i?b/2:0,top:0,left:0,bottom:0}}),[b,i]);return a.createElement(a.Fragment,null,a.createElement("div",{style:{position:"relative",height:"100%"}},a.createElement(s.ZP,(0,n.Z)({id:"left-map"},t,{padding:_,onMoveStart:g,onMove:"left"===m&&y,style:p,mapStyle:"mapbox://styles/mapbox/light-v9",mapboxAccessToken:l})),a.createElement(s.ZP,(0,n.Z)({id:"right-map"},t,{padding:E,onMoveStart:h,onMove:"right"===m&&y,style:d,mapStyle:"mapbox://styles/mapbox/dark-v9",mapboxAccessToken:l}))),a.createElement(c,{mode:i,onModeChange:u}))}var m=["components"],v={},g="Side by Side",h={unversionedId:"side-by-side",id:"side-by-side",title:"Side by Side",description:"",source:"@site/src/examples/side-by-side.mdx",sourceDirName:".",slug:"/side-by-side",permalink:"/react-map-gl/examples/side-by-side",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Geocoder",permalink:"/react-map-gl/examples/geocoder"}},y={},b=[],_={toc:b},E="wrapper";function S(e){var t=e.components,r=(0,o.Z)(e,m);return(0,i.kt)(E,(0,n.Z)({},_,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"side-by-side"},"Side by Side"),(0,i.kt)(f,{mdxType:"App"}))}S.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>K,Pv:()=>ee,GI:()=>Y,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>Z});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?f:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:d(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var c=new this._MapClass(a);i.padding&&c.setPadding(i.padding),r.cursor&&(c.getCanvas().style.cursor=r.cursor),this._createShadowTransform(c);var l=c._render;c._render=function(e){t._inRender=!0,l.call(c,e),t._inRender=!1};var p=c._renderTaskQueue.run;c._renderTaskQueue.run=function(e){p.call(c._renderTaskQueue,e),t._onBeforeRepaint()},c.on("render",(function(){return t._onAfterRepaint()}));var h=c.fire;for(var y in c.fire=this._fireEvent.bind(this,h),c.on("resize",(function(){t._renderTransform.resize(c.transform.width,c.transform.height)})),c.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(c.transform,t._renderTransform)})),c.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)c.on(y,this._onPointerEvent);for(var b in v)c.on(b,this._onCameraEvent);for(var E in g)c.on(E,this._onEvent);this._map=c},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var l=c(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),l&&t){var p=this._deferredEvents;p.move=!0,p.zoom||(p.zoom=o!==n.zoom),p.rotate||(p.rotate=i!==n.bearing),p.pitch||(p.pitch=a!==n.pitch)}return s||c(r.transform,e),l},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function S(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a}},o=(0,l.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,l.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const w="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var x=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var C=n.createContext(null);function L(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],c=(0,n.useRef)(),p=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,l.Z)(x);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,c.current)),t||(t=new b(n.Map,e,c.current)),p.map=S(t),p.mapLib=n,u(t),null==a||a.onMapMount(p.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),w((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return p.map}),[s]);var d=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:c,style:d},s&&n.createElement(C.Provider,{value:p},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var P=r(3935),M=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function O(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!M.test(n)?r[n]=o+"px":r[n]=o}}}function j(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,c,l,p,d,f,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,b=void 0!==y&&y,_=e.popup,E=void 0===_?null:_,S=e.rotation,w=void 0===S?0:S,x=e.rotationAlignment,L=void 0===x?"auto":x,M=e.pitchAlignment,j=void 0===M?"auto":M;return(0,n.useEffect)((function(){O(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),c=g,l=Array.isArray(u)?u[0]:u?u.x:0,p=Array.isArray(u)?u[1]:u?u.y:0,d=Array.isArray(c)?c[0]:c?c.x:0,f=Array.isArray(c)?c[1]:c?c.y:0,l!==d||p!==f)&&s.setOffset(g),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==w&&s.setRotation(w),s.getRotationAlignment()!==L&&s.setRotationAlignment(L),s.getPitchAlignment()!==j&&s.setPitchAlignment(j),s.getPopup()!==E&&s.setPopup(E),(0,P.createPortal)(e.children,s.getElement())}const T=(0,n.memo)((0,n.forwardRef)(j));function k(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var c=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return c.on("close",e),c.setDOMContent(s).addTo(o.getMap()),function(){c.off("close",e),c.isOpen()&&c.remove()}}),[]),(0,n.useEffect)((function(){O(c.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return c}),[]),c.isOpen()&&(c.getLngLat().lng===e.longitude&&c.getLngLat().lat===e.latitude||c.setLngLat([e.longitude,e.latitude]),e.offset&&!i(c.options.offset,e.offset)&&c.setOffset(e.offset),c.options.anchor===e.anchor&&c.options.maxWidth===e.maxWidth||(c.options.anchor=e.anchor,c.setMaxWidth(e.maxWidth)),c.options.className!==e.className)){for(var p,d=k(c.options.className),f=k(e.className),m=(0,l.Z)(d);!(p=m()).done;){var v=p.value;f.has(v)||c.removeClassName(v)}for(var g,h=(0,l.Z)(f);!(g=h()).done;){var y=g.value;d.has(y)||c.addClassName(y)}c.options.className=e.className}return(0,P.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(R));const Z=function(e,t,r,o){var a=(0,n.useContext)(C),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function I(e){var t=Z((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){O(t._controlContainer,e.style)}),[e.style]),null}const A=(0,n.memo)(I);function D(e,t){var r=(0,n.useRef)({props:e}),o=Z((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){O(o._container,e.style)}),[e.style]),null}const N=(0,n.memo)((0,n.forwardRef)(D));function F(e){var t=Z((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){O(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(F);function W(e){var t=Z((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){O(t._container,a)}),[a]),null}const B=(0,n.memo)(W);function H(e,t){if(!e)throw new Error(t)}var q=0;const V=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+q++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(H(r.id===n.id,"layer id changed"),H(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,c=r.filter,l=r.minzoom,p=r.maxzoom,d=r.beforeId;if(d!==n.beforeId&&e.moveLayer(t,d),a!==n.layout){var f=n.layout||{};for(var m in a)i(a[m],f[m])||e.setLayoutProperty(t,m,a[m]);for(var v in f)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(c,n.filter)||e.setFilter(t,c),l===n.minzoom&&p===n.maxzoom||e.setLayerZoomRange(t,l,p)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var G=0;const J=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+G++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,l.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){H(t.id===r.id,"source id changed"),H(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return L(e,t,Q)})),K=T,Y=z,$=A,ee=U,te=N,re=B,ne=V,oe=J;const ae=X},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{n.r(t),n.d(t,{assets:()=>E,contentTitle:()=>_,default:()=>C,frontMatter:()=>y,metadata:()=>b,toc:()=>w});var r=n(7462),o=n(3366),a=n(7294),i=n(3905),s=n(7855),u=(n(745),n(945)),l=n(1307),c=n.n(l);function f(e){return(0,u.PE)((function(){return new(c())(e)}),(function(t){var n=t.map;n.on("draw.create",e.onCreate),n.on("draw.update",e.onUpdate),n.on("draw.delete",e.onDelete)}),(function(t){var n=t.map;n.off("draw.create",e.onCreate),n.off("draw.update",e.onUpdate),n.off("draw.delete",e.onDelete)}),{position:e.position}),null}f.defaultProps={onCreate:function(){},onUpdate:function(){},onDelete:function(){}};var d=n(1256);function p(e){for(var t,n=0,r=(0,s.Z)(e.polygons);!(t=r()).done;){var o=t.value;n+=(0,d.Z)(o)}return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Draw Polygon"),n>0&&a.createElement("p",null,Math.round(100*n)/100," ",a.createElement("br",null),"square meters"),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/draw-polygon",target:"_new"},"View Code \u2197")))}const m=a.memo(p);var v="";function g(){var e=(0,a.useState)({}),t=e[0],n=e[1],r=(0,a.useCallback)((function(e){n((function(t){for(var n,r=Object.assign({},t),o=(0,s.Z)(e.features);!(n=o()).done;){var a=n.value;r[a.id]=a}return r}))}),[]),o=(0,a.useCallback)((function(e){n((function(t){for(var n,r=Object.assign({},t),o=(0,s.Z)(e.features);!(n=o()).done;){delete r[n.value.id]}return r}))}),[]);return a.createElement(a.Fragment,null,a.createElement(u.ZP,{initialViewState:{longitude:-91.874,latitude:42.76,zoom:12},mapStyle:"mapbox://styles/mapbox/satellite-v9",mapboxAccessToken:v},a.createElement(f,{position:"top-left",displayControlsDefault:!1,controls:{polygon:!0,trash:!0},defaultMode:"draw_polygon",onCreate:r,onUpdate:r,onDelete:o})),a.createElement(m,{polygons:Object.values(t)}))}var h=["components"],y={},_="Draw Polygon",b={unversionedId:"draw-polygon",id:"draw-polygon",title:"Draw Polygon",description:"",source:"@site/src/examples/draw-polygon.mdx",sourceDirName:".",slug:"/draw-polygon",permalink:"/react-map-gl/examples/draw-polygon",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Heatmap",permalink:"/react-map-gl/examples/heatmap"},next:{title:"Terrain",permalink:"/react-map-gl/examples/terrain"}},E={},w=[],x={toc:w},L="wrapper";function C(e){var t=e.components,n=(0,o.Z)(e,h);return(0,i.kt)(L,(0,r.Z)({},x,n,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"draw-polygon"},"Draw Polygon"),(0,i.kt)(g,{mdxType:"App"}))}C.isMDXComponent=!0},945:(e,t,n)=>{n.d(t,{ot:()=>$,$j:()=>te,mh:()=>re,D5:()=>X,Jx:()=>K,Pv:()=>ee,GI:()=>Y,jf:()=>ne,Hw:()=>oe,ZP:()=>ae,PE:()=>Z});var r=n(7294),o=r.createContext(null);var a=n(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var n=0;n0;)n.appendChild(a.childNodes[0]);o._container=n;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(n)),r.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):r._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),r},t._initialize=function(e){var t=this,n=this.props,r=n.mapStyle,o=void 0===r?p:r,a=Object.assign({},n,n.initialViewState,{accessToken:n.mapboxAccessToken||b()||null,container:e,style:d(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),n.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,n.gl}}var l=new this._MapClass(a);i.padding&&l.setPadding(i.padding),n.cursor&&(l.getCanvas().style.cursor=n.cursor),this._createShadowTransform(l);var c=l._render;l._render=function(e){t._inRender=!0,c.call(l,e),t._inRender=!1};var f=l._renderTaskQueue.run;l._renderTaskQueue.run=function(e){f.call(l._renderTaskQueue,e),t._onBeforeRepaint()},l.on("render",(function(){return t._onAfterRepaint()}));var h=l.fire;for(var y in l.fire=this._fireEvent.bind(this,h),l.on("resize",(function(){t._renderTransform.resize(l.transform.width,l.transform.height)})),l.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(l.transform,t._renderTransform)})),l.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)l.on(y,this._onPointerEvent);for(var _ in v)l.on(_,this._onCameraEvent);for(var E in g)l.on(E,this._onEvent);this._map=l},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,n,r=(t=e.transform,(n=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,n);e.painter.transform=r,this._renderTransform=r},t._updateSize=function(e){var t=e.viewState;if(t){var n=this._map;if(t.width!==n.transform.width||t.height!==n.transform.height)return n.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var n=this._map,r=this._renderTransform,o=r.zoom,a=r.pitch,i=r.bearing,s=n.isMoving();s&&(r.cameraElevationReference="sea");var c=l(r,Object.assign({},u(n.transform),e));if(s&&(r.cameraElevationReference="ground"),c&&t){var f=this._deferredEvents;f.move=!0,f.zoom||(f.zoom=o!==r.zoom),f.rotate||(f.rotate=i!==r.bearing),f.pitch||(f.pitch=a!==r.pitch)}return s||l(n.transform,e),c},t._updateSettings=function(e,t){for(var n=this._map,r=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=r}else this._hoveredFeatures=null},t._fireEvent=function(e,t,n){var r=this._map,o=r.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(r.transform=this._renderTransform,e.call(r,t,n),r.transform=o,r):(e.call(r,t,n),r)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var n in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[n]&&t.fire(n);this._internalUpdate=!1;var r=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,r),t.transform=r}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function b(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(n){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(r){}return e}_.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function w(e){if(!e)return null;for(var t,n=e.map,r={getMap:function(){return n},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var r=n.transform;n.transform=e.transform;var o=n.project(t);return n.transform=r,o},unproject:function(t){var r=n.transform;n.transform=e.transform;var o=n.unproject(t);return n.transform=r,o},queryTerrainElevation:function(t,r){var o=n.transform;n.transform=e.transform;var a=n.queryTerrainElevation(t,r);return n.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,n=e;for(;n;){for(var r,o=(0,c.Z)(Object.getOwnPropertyNames(n));!(r=o()).done;){var a=r.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}n=Object.getPrototypeOf(n)}return Array.from(t)}(n));!(t=o()).done;){var a=t.value;a in r||E.includes(a)||(r[a]=n[a].bind(n))}return r}const x="undefined"!=typeof document?r.useLayoutEffect:r.useEffect;var L=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var C=r.createContext(null);function S(e,t,n){var a=(0,r.useContext)(o),i=(0,r.useState)(null),s=i[0],u=i[1],l=(0,r.useRef)(),f=(0,r.useRef)({mapLib:null,map:null}).current;(0,r.useEffect)((function(){var t,r=e.mapLib,o=!0;return Promise.resolve(r||n).then((function(n){if(o){if(!n)throw new Error("Invalid mapLib");var r="Map"in n?n:n.default;if(!r.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var n,r=(0,c.Z)(L);!(n=r()).done;){var o=n.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(r,e),r.supported&&!r.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=_.reuse(e,l.current)),t||(t=new _(r.Map,e,l.current)),f.map=w(t),f.mapLib=r,u(t),null==a||a.onMapMount(f.map,e.id)}})).catch((function(t){var n=e.onError;n?n({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),x((function(){s&&s.setProps(e)})),(0,r.useImperativeHandle)(t,(function(){return f.map}),[s]);var d=(0,r.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return r.createElement("div",{id:e.id,ref:l,style:d},s&&r.createElement(C.Provider,{value:f},r.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var M=n(3935),P=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function T(e,t){if(e&&t){var n=e.style;for(var r in t){var o=t[r];Number.isFinite(o)&&!P.test(r)?n[r]=o+"px":n[r]=o}}}function R(e,t){var n=(0,r.useContext)(C),o=n.map,a=n.mapLib,i=(0,r.useRef)({props:e});i.current.props=e;var s=(0,r.useMemo)((function(){var t=!1;r.Children.forEach(e.children,(function(e){e&&(t=!0)}));var n=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(n);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,r.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,l,c,f,d,p,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,_=void 0!==y&&y,b=e.popup,E=void 0===b?null:b,w=e.rotation,x=void 0===w?0:w,L=e.rotationAlignment,S=void 0===L?"auto":L,P=e.pitchAlignment,R=void 0===P?"auto":P;return(0,r.useEffect)((function(){T(s.getElement(),h)}),[h]),(0,r.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),l=g,c=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,d=Array.isArray(l)?l[0]:l?l.x:0,p=Array.isArray(l)?l[1]:l?l.y:0,c!==d||f!==p)&&s.setOffset(g),s.isDraggable()!==_&&s.setDraggable(_),s.getRotation()!==x&&s.setRotation(x),s.getRotationAlignment()!==S&&s.setRotationAlignment(S),s.getPitchAlignment()!==R&&s.setPitchAlignment(R),s.getPopup()!==E&&s.setPopup(E),(0,M.createPortal)(e.children,s.getElement())}const k=(0,r.memo)((0,r.forwardRef)(R));function j(e){return new Set(e?e.trim().split(/\s+/):[])}function z(e,t){var n=(0,r.useContext)(C),o=n.map,a=n.mapLib,s=(0,r.useMemo)((function(){return document.createElement("div")}),[]),u=(0,r.useRef)({props:e});u.current.props=e;var l=(0,r.useMemo)((function(){var t=Object.assign({},e),n=new a.Popup(t);return n.setLngLat([e.longitude,e.latitude]),n.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),n}),[]);if((0,r.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return l.on("close",e),l.setDOMContent(s).addTo(o.getMap()),function(){l.off("close",e),l.isOpen()&&l.remove()}}),[]),(0,r.useEffect)((function(){T(l.getElement(),e.style)}),[e.style]),(0,r.useImperativeHandle)(t,(function(){return l}),[]),l.isOpen()&&(l.getLngLat().lng===e.longitude&&l.getLngLat().lat===e.latitude||l.setLngLat([e.longitude,e.latitude]),e.offset&&!i(l.options.offset,e.offset)&&l.setOffset(e.offset),l.options.anchor===e.anchor&&l.options.maxWidth===e.maxWidth||(l.options.anchor=e.anchor,l.setMaxWidth(e.maxWidth)),l.options.className!==e.className)){for(var f,d=j(l.options.className),p=j(e.className),m=(0,c.Z)(d);!(f=m()).done;){var v=f.value;p.has(v)||l.removeClassName(v)}for(var g,h=(0,c.Z)(p);!(g=h()).done;){var y=g.value;d.has(y)||l.addClassName(y)}l.options.className=e.className}return(0,M.createPortal)(e.children,s)}const O=(0,r.memo)((0,r.forwardRef)(z));const Z=function(e,t,n,o){var a=(0,r.useContext)(C),i=(0,r.useMemo)((function(){return e(a)}),[]);return(0,r.useEffect)((function(){var e=o||n||t,r="function"==typeof t&&"function"==typeof n?t:null,s="function"==typeof n?n:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),r&&r(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function D(e){var t=Z((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,r.useEffect)((function(){T(t._controlContainer,e.style)}),[e.style]),null}const I=(0,r.memo)(D);function A(e,t){var n=(0,r.useRef)({props:e}),o=Z((function(t){var r=new t.mapLib.GeolocateControl(e),o=r._setupUI;return r._setupUI=function(e){r._container.hasChildNodes()||o(e)},r.on("geolocate",(function(e){null==n.current.props.onGeolocate||n.current.props.onGeolocate(e)})),r.on("error",(function(e){null==n.current.props.onError||n.current.props.onError(e)})),r.on("outofmaxbounds",(function(e){null==n.current.props.onOutOfMaxBounds||n.current.props.onOutOfMaxBounds(e)})),r.on("trackuserlocationstart",(function(e){null==n.current.props.onTrackUserLocationStart||n.current.props.onTrackUserLocationStart(e)})),r.on("trackuserlocationend",(function(e){null==n.current.props.onTrackUserLocationEnd||n.current.props.onTrackUserLocationEnd(e)})),r}),{position:e.position});return n.current.props=e,(0,r.useImperativeHandle)(t,(function(){return o}),[]),(0,r.useEffect)((function(){T(o._container,e.style)}),[e.style]),null}const U=(0,r.memo)((0,r.forwardRef)(A));function N(e){var t=Z((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,r.useEffect)((function(){T(t._container,e.style)}),[e.style]),null}const F=(0,r.memo)(N);function B(e){var t=Z((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),n=(0,r.useRef)(e),o=n.current;n.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,r.useEffect)((function(){T(t._container,a)}),[a]),null}const W=(0,r.memo)(B);function H(e,t){if(!e)throw new Error(t)}var q=0;const V=function(e){var t=(0,r.useContext)(C).map.getMap(),n=(0,r.useRef)(e),o=(0,r.useState)(0)[1],a=(0,r.useMemo)((function(){return e.id||"jsx-layer-"+q++}),[]);if((0,r.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,n,r){if(H(n.id===r.id,"layer id changed"),H(n.type===r.type,"layer type changed"),"custom"!==n.type&&"custom"!==r.type){var o=n.layout,a=void 0===o?{}:o,s=n.paint,u=void 0===s?{}:s,l=n.filter,c=n.minzoom,f=n.maxzoom,d=n.beforeId;if(d!==r.beforeId&&e.moveLayer(t,d),a!==r.layout){var p=r.layout||{};for(var m in a)i(a[m],p[m])||e.setLayoutProperty(t,m,a[m]);for(var v in p)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==r.paint){var g=r.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(l,r.filter)||e.setFilter(t,l),c===r.minzoom&&f===r.maxzoom||e.setLayerZoomRange(t,c,f)}}(t,a,e,n.current)}catch(s){console.warn(s)}else!function(e,t,n){if(e.style&&e.style._loaded&&(!("source"in n)||e.getSource(n.source))){var r=Object.assign({},n,{id:t});delete r.beforeId,e.addLayer(r,n.beforeId)}}(t,a,e);return n.current=e,null};var G=0;const J=function(e){var t=(0,r.useContext)(C).map.getMap(),n=(0,r.useRef)(e),o=(0,r.useState)(0)[1],a=(0,r.useMemo)((function(){return e.id||"jsx-source-"+G++}),[]);(0,r.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var n,r=null==(n=t.getStyle())?void 0:n.layers;if(r)for(var o,i=(0,c.Z)(r);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,n){H(t.id===n.id,"source id changed"),H(t.type===n.type,"source type changed");var r="",o=0;for(var a in t)"children"===a||"id"===a||i(n[a],t[a])||(r=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===r)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(r){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+r)}}(s,e,n.current):s=function(e,t,n){if(e.style&&e.style._loaded){var r=Object.assign({},n);return delete r.id,delete r.children,e.addSource(t,r),e.getSource(t)}return null}(t,a,e),n.current=e,s&&r.Children.map(e.children,(function(e){return e&&(0,r.cloneElement)(e,{source:a})}))||null};var Q=n.e(8539).then(n.t.bind(n,8539,23)),X=r.forwardRef((function(e,t){return S(e,t,Q)})),K=k,Y=O,$=I,ee=F,te=U,ne=W,re=V,oe=J;const ae=X}}]); \ No newline at end of file diff --git a/assets/js/2632493b.a4d88196.js b/assets/js/2632493b.a4d88196.js new file mode 100644 index 00000000..0ca11c7a --- /dev/null +++ b/assets/js/2632493b.a4d88196.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkreact_map_gl_website=self.webpackChunkreact_map_gl_website||[]).push([[2134],{8093:(e,t,r)=>{r.r(t),r.d(t,{assets:()=>E,contentTitle:()=>_,default:()=>C,frontMatter:()=>y,metadata:()=>b,toc:()=>w});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=r(7855),u=(r(745),r(945)),l=r(1307),c=r.n(l);function f(e){return(0,u.PE)((function(){return new(c())(e)}),(function(t){var r=t.map;r.on("draw.create",e.onCreate),r.on("draw.update",e.onUpdate),r.on("draw.delete",e.onDelete)}),(function(t){var r=t.map;r.off("draw.create",e.onCreate),r.off("draw.update",e.onUpdate),r.off("draw.delete",e.onDelete)}),{position:e.position}),null}f.defaultProps={onCreate:function(){},onUpdate:function(){},onDelete:function(){}};var d=r(1256);function p(e){for(var t,r=0,n=(0,s.Z)(e.polygons);!(t=n()).done;){var o=t.value;r+=(0,d.Z)(o)}return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Draw Polygon"),r>0&&a.createElement("p",null,Math.round(100*r)/100," ",a.createElement("br",null),"square meters"),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/draw-polygon",target:"_new"},"View Code \u2197")))}const m=a.memo(p);var v="";function g(){var e=(0,a.useState)({}),t=e[0],r=e[1],n=(0,a.useCallback)((function(e){r((function(t){for(var r,n=Object.assign({},t),o=(0,s.Z)(e.features);!(r=o()).done;){var a=r.value;n[a.id]=a}return n}))}),[]),o=(0,a.useCallback)((function(e){r((function(t){for(var r,n=Object.assign({},t),o=(0,s.Z)(e.features);!(r=o()).done;){delete n[r.value.id]}return n}))}),[]);return a.createElement(a.Fragment,null,a.createElement(u.ZP,{initialViewState:{longitude:-91.874,latitude:42.76,zoom:12},mapStyle:"mapbox://styles/mapbox/satellite-v9",mapboxAccessToken:v},a.createElement(f,{position:"top-left",displayControlsDefault:!1,controls:{polygon:!0,trash:!0},defaultMode:"draw_polygon",onCreate:n,onUpdate:n,onDelete:o})),a.createElement(m,{polygons:Object.values(t)}))}var h=["components"],y={},_="Draw Polygon",b={unversionedId:"draw-polygon",id:"draw-polygon",title:"Draw Polygon",description:"",source:"@site/src/examples/draw-polygon.mdx",sourceDirName:".",slug:"/draw-polygon",permalink:"/react-map-gl/examples/draw-polygon",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Heatmap",permalink:"/react-map-gl/examples/heatmap"},next:{title:"Terrain",permalink:"/react-map-gl/examples/terrain"}},E={},w=[],x={toc:w},L="wrapper";function C(e){var t=e.components,r=(0,o.Z)(e,h);return(0,i.kt)(L,(0,n.Z)({},x,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"draw-polygon"},"Draw Polygon"),(0,i.kt)(g,{mdxType:"App"}))}C.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>K,Pv:()=>ee,GI:()=>Y,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>Z});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?p:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||b()||null,container:e,style:d(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var l=new this._MapClass(a);i.padding&&l.setPadding(i.padding),r.cursor&&(l.getCanvas().style.cursor=r.cursor),this._createShadowTransform(l);var c=l._render;l._render=function(e){t._inRender=!0,c.call(l,e),t._inRender=!1};var f=l._renderTaskQueue.run;l._renderTaskQueue.run=function(e){f.call(l._renderTaskQueue,e),t._onBeforeRepaint()},l.on("render",(function(){return t._onAfterRepaint()}));var h=l.fire;for(var y in l.fire=this._fireEvent.bind(this,h),l.on("resize",(function(){t._renderTransform.resize(l.transform.width,l.transform.height)})),l.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(l.transform,t._renderTransform)})),l.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)l.on(y,this._onPointerEvent);for(var _ in v)l.on(_,this._onCameraEvent);for(var E in g)l.on(E,this._onEvent);this._map=l},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var c=l(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),c&&t){var f=this._deferredEvents;f.move=!0,f.zoom||(f.zoom=o!==n.zoom),f.rotate||(f.rotate=i!==n.bearing),f.pitch||(f.pitch=a!==n.pitch)}return s||l(r.transform,e),c},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function b(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}_.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function w(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a},queryRenderedFeatures:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryRenderedFeatures(t,n);return r.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,c.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const x="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var L=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var C=n.createContext(null);function S(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],l=(0,n.useRef)(),f=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,c.Z)(L);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=_.reuse(e,l.current)),t||(t=new _(n.Map,e,l.current)),f.map=w(t),f.mapLib=n,u(t),null==a||a.onMapMount(f.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),x((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return f.map}),[s]);var d=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:l,style:d},s&&n.createElement(C.Provider,{value:f},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var M=r(3935),P=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function T(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!P.test(n)?r[n]=o+"px":r[n]=o}}}function R(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,l,c,f,d,p,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,_=void 0!==y&&y,b=e.popup,E=void 0===b?null:b,w=e.rotation,x=void 0===w?0:w,L=e.rotationAlignment,S=void 0===L?"auto":L,P=e.pitchAlignment,R=void 0===P?"auto":P;return(0,n.useEffect)((function(){T(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),l=g,c=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,d=Array.isArray(l)?l[0]:l?l.x:0,p=Array.isArray(l)?l[1]:l?l.y:0,c!==d||f!==p)&&s.setOffset(g),s.isDraggable()!==_&&s.setDraggable(_),s.getRotation()!==x&&s.setRotation(x),s.getRotationAlignment()!==S&&s.setRotationAlignment(S),s.getPitchAlignment()!==R&&s.setPitchAlignment(R),s.getPopup()!==E&&s.setPopup(E),(0,M.createPortal)(e.children,s.getElement())}const k=(0,n.memo)((0,n.forwardRef)(R));function j(e){return new Set(e?e.trim().split(/\s+/):[])}function z(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var l=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return l.on("close",e),l.setDOMContent(s).addTo(o.getMap()),function(){l.off("close",e),l.isOpen()&&l.remove()}}),[]),(0,n.useEffect)((function(){T(l.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return l}),[]),l.isOpen()&&(l.getLngLat().lng===e.longitude&&l.getLngLat().lat===e.latitude||l.setLngLat([e.longitude,e.latitude]),e.offset&&!i(l.options.offset,e.offset)&&l.setOffset(e.offset),l.options.anchor===e.anchor&&l.options.maxWidth===e.maxWidth||(l.options.anchor=e.anchor,l.setMaxWidth(e.maxWidth)),l.options.className!==e.className)){for(var f,d=j(l.options.className),p=j(e.className),m=(0,c.Z)(d);!(f=m()).done;){var v=f.value;p.has(v)||l.removeClassName(v)}for(var g,h=(0,c.Z)(p);!(g=h()).done;){var y=g.value;d.has(y)||l.addClassName(y)}l.options.className=e.className}return(0,M.createPortal)(e.children,s)}const O=(0,n.memo)((0,n.forwardRef)(z));const Z=function(e,t,r,o){var a=(0,n.useContext)(C),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function D(e){var t=Z((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){T(t._controlContainer,e.style)}),[e.style]),null}const I=(0,n.memo)(D);function A(e,t){var r=(0,n.useRef)({props:e}),o=Z((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){T(o._container,e.style)}),[e.style]),null}const U=(0,n.memo)((0,n.forwardRef)(A));function F(e){var t=Z((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){T(t._container,e.style)}),[e.style]),null}const N=(0,n.memo)(F);function B(e){var t=Z((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){T(t._container,a)}),[a]),null}const W=(0,n.memo)(B);function H(e,t){if(!e)throw new Error(t)}var q=0;const V=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+q++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(H(r.id===n.id,"layer id changed"),H(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,l=r.filter,c=r.minzoom,f=r.maxzoom,d=r.beforeId;if(d!==n.beforeId&&e.moveLayer(t,d),a!==n.layout){var p=n.layout||{};for(var m in a)i(a[m],p[m])||e.setLayoutProperty(t,m,a[m]);for(var v in p)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(l,n.filter)||e.setFilter(t,l),c===n.minzoom&&f===n.maxzoom||e.setLayerZoomRange(t,c,f)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var G=0;const J=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+G++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,c.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){H(t.id===r.id,"source id changed"),H(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return S(e,t,Q)})),K=k,Y=O,$=I,ee=N,te=U,re=W,ne=V,oe=J;const ae=X}}]); \ No newline at end of file diff --git a/assets/js/2b604174.6e37e49f.js b/assets/js/2b604174.6e37e49f.js deleted file mode 100644 index 34fe4fc9..00000000 --- a/assets/js/2b604174.6e37e49f.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkreact_map_gl_website=self.webpackChunkreact_map_gl_website||[]).push([[5186],{3905:(e,t,n)=>{n.d(t,{Zo:()=>c,kt:()=>f});var r=n(7294);function o(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function a(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function i(e){for(var t=1;t=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var u=r.createContext({}),l=function(e){var t=r.useContext(u),n=t;return e&&(n="function"==typeof e?e(t):i(i({},t),e)),n},c=function(e){var t=l(e.components);return r.createElement(u.Provider,{value:t},e.children)},p="mdxType",d={inlineCode:"code",wrapper:function(e){var t=e.children;return r.createElement(r.Fragment,{},t)}},m=r.forwardRef((function(e,t){var n=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,c=s(e,["components","mdxType","originalType","parentName"]),p=l(n),m=o,f=p["".concat(u,".").concat(m)]||p[m]||d[m]||a;return n?r.createElement(f,i(i({ref:t},c),{},{components:n})):r.createElement(f,i({ref:t},c))}));function f(e,t){var n=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=n.length,i=new Array(a);i[0]=m;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[p]="string"==typeof e?e:o,i[1]=s;for(var l=2;l{n.r(t),n.d(t,{assets:()=>b,contentTitle:()=>y,default:()=>E,frontMatter:()=>h,metadata:()=>_,toc:()=>w});var r=n(7462),o=n(3366),a=n(7294),i=n(3905),s=(n(745),n(945));function u(){return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Marker, Popup, NavigationControl and FullscreenControl "),a.createElement("p",null,"Map showing top 20 most populated cities of the United States. Click on a marker to learn more."),a.createElement("p",null,"Data source:"," ",a.createElement("a",{href:"https://en.wikipedia.org/wiki/List_of_United_States_cities_by_population"},"Wikipedia")),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/controls",target:"_new"},"View Code \u2197")))}const l=a.memo(u);var c={cursor:"pointer",fill:"#d00",stroke:"none"};function p(e){var t=e.size,n=void 0===t?20:t;return a.createElement("svg",{height:n,viewBox:"0 0 24 24",style:c},a.createElement("path",{d:"M20.2,15.7L20.2,15.7c1.1-1.6,1.8-3.6,1.8-5.7c0-5.6-4.5-10-10-10S2,4.5,2,10c0,2,0.6,3.9,1.6,5.4c0,0.1,0.1,0.2,0.2,0.3\n c0,0,0.1,0.1,0.1,0.2c0.2,0.3,0.4,0.6,0.7,0.9c2.6,3.1,7.4,7.6,7.4,7.6s4.8-4.5,7.4-7.5c0.2-0.3,0.5-0.6,0.7-0.9\n C20.1,15.8,20.2,15.8,20.2,15.7z"}))}const d=a.memo(p);var m=n(7971),f="";function g(){var e=(0,a.useState)(null),t=e[0],n=e[1],r=(0,a.useMemo)((function(){return m.map((function(e,t){return a.createElement(s.Jx,{key:"marker-"+t,longitude:e.longitude,latitude:e.latitude,anchor:"bottom",onClick:function(t){t.originalEvent.stopPropagation(),n(e)}},a.createElement(d,null))}))}),[]);return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:{latitude:40,longitude:-100,zoom:3.5,bearing:0,pitch:0},mapStyle:"mapbox://styles/mapbox/dark-v9",mapboxAccessToken:f},a.createElement(s.$j,{position:"top-left"}),a.createElement(s.ot,{position:"top-left"}),a.createElement(s.Pv,{position:"top-left"}),a.createElement(s.jf,null),r,t&&a.createElement(s.GI,{anchor:"top",longitude:Number(t.longitude),latitude:Number(t.latitude),onClose:function(){return n(null)}},a.createElement("div",null,t.city,", ",t.state," |"," ",a.createElement("a",{target:"_new",href:"http://en.wikipedia.org/w/index.php?title=Special:Search&search="+t.city+", "+t.state},"Wikipedia")),a.createElement("img",{width:"100%",src:t.image}))),a.createElement(l,null))}var v=["components"],h={},y="Markers, Popups and Controls",_={unversionedId:"controls",id:"controls",title:"Markers, Popups and Controls",description:"",source:"@site/src/examples/controls.mdx",sourceDirName:".",slug:"/controls",permalink:"/react-map-gl/examples/controls",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Dynamic Styling",permalink:"/react-map-gl/examples/layers"},next:{title:"Custom Cursor",permalink:"/react-map-gl/examples/custom-cursor"}},b={},w=[],k={toc:w},x="wrapper";function E(e){var t=e.components,n=(0,o.Z)(e,v);return(0,i.kt)(x,(0,r.Z)({},k,n,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"markers-popups-and-controls"},"Markers, Popups and Controls"),(0,i.kt)(g,{mdxType:"App"}))}E.isMDXComponent=!0},945:(e,t,n)=>{n.d(t,{ot:()=>K,$j:()=>te,mh:()=>re,D5:()=>X,Jx:()=>Y,Pv:()=>ee,GI:()=>$,jf:()=>ne,Hw:()=>oe,ZP:()=>ae,PE:()=>z});var r=n(7294),o=r.createContext(null);var a=n(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var n=0;n0;)n.appendChild(a.childNodes[0]);o._container=n;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(n)),r.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):r._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),r},t._initialize=function(e){var t=this,n=this.props,r=n.mapStyle,o=void 0===r?m:r,a=Object.assign({},n,n.initialViewState,{accessToken:n.mapboxAccessToken||b()||null,container:e,style:d(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),n.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,n.gl}}var l=new this._MapClass(a);i.padding&&l.setPadding(i.padding),n.cursor&&(l.getCanvas().style.cursor=n.cursor),this._createShadowTransform(l);var c=l._render;l._render=function(e){t._inRender=!0,c.call(l,e),t._inRender=!1};var p=l._renderTaskQueue.run;l._renderTaskQueue.run=function(e){p.call(l._renderTaskQueue,e),t._onBeforeRepaint()},l.on("render",(function(){return t._onAfterRepaint()}));var h=l.fire;for(var y in l.fire=this._fireEvent.bind(this,h),l.on("resize",(function(){t._renderTransform.resize(l.transform.width,l.transform.height)})),l.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(l.transform,t._renderTransform)})),l.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),f)l.on(y,this._onPointerEvent);for(var _ in g)l.on(_,this._onCameraEvent);for(var w in v)l.on(w,this._onEvent);this._map=l},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,n,r=(t=e.transform,(n=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,n);e.painter.transform=r,this._renderTransform=r},t._updateSize=function(e){var t=e.viewState;if(t){var n=this._map;if(t.width!==n.transform.width||t.height!==n.transform.height)return n.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var n=this._map,r=this._renderTransform,o=r.zoom,a=r.pitch,i=r.bearing,s=n.isMoving();s&&(r.cameraElevationReference="sea");var c=l(r,Object.assign({},u(n.transform),e));if(s&&(r.cameraElevationReference="ground"),c&&t){var p=this._deferredEvents;p.move=!0,p.zoom||(p.zoom=o!==r.zoom),p.rotate||(p.rotate=i!==r.bearing),p.pitch||(p.pitch=a!==r.pitch)}return s||l(n.transform,e),c},t._updateSettings=function(e,t){for(var n=this._map,r=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=r}else this._hoveredFeatures=null},t._fireEvent=function(e,t,n){var r=this._map,o=r.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in g&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(r.transform=this._renderTransform,e.call(r,t,n),r.transform=o,r):(e.call(r,t,n),r)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var n in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[n]&&t.fire(n);this._internalUpdate=!1;var r=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,r),t.transform=r}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function b(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(n){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(r){}return e}_.savedMaps=[];var w=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function k(e){if(!e)return null;for(var t,n=e.map,r={getMap:function(){return n},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var r=n.transform;n.transform=e.transform;var o=n.project(t);return n.transform=r,o},unproject:function(t){var r=n.transform;n.transform=e.transform;var o=n.unproject(t);return n.transform=r,o},queryTerrainElevation:function(t,r){var o=n.transform;n.transform=e.transform;var a=n.queryTerrainElevation(t,r);return n.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,n=e;for(;n;){for(var r,o=(0,c.Z)(Object.getOwnPropertyNames(n));!(r=o()).done;){var a=r.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}n=Object.getPrototypeOf(n)}return Array.from(t)}(n));!(t=o()).done;){var a=t.value;a in r||w.includes(a)||(r[a]=n[a].bind(n))}return r}const x="undefined"!=typeof document?r.useLayoutEffect:r.useEffect;var E=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var S=r.createContext(null);function C(e,t,n){var a=(0,r.useContext)(o),i=(0,r.useState)(null),s=i[0],u=i[1],l=(0,r.useRef)(),p=(0,r.useRef)({mapLib:null,map:null}).current;(0,r.useEffect)((function(){var t,r=e.mapLib,o=!0;return Promise.resolve(r||n).then((function(n){if(o){if(!n)throw new Error("Invalid mapLib");var r="Map"in n?n:n.default;if(!r.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var n,r=(0,c.Z)(E);!(n=r()).done;){var o=n.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(r,e),r.supported&&!r.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=_.reuse(e,l.current)),t||(t=new _(r.Map,e,l.current)),p.map=k(t),p.mapLib=r,u(t),null==a||a.onMapMount(p.map,e.id)}})).catch((function(t){var n=e.onError;n?n({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),x((function(){s&&s.setProps(e)})),(0,r.useImperativeHandle)(t,(function(){return p.map}),[s]);var d=(0,r.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return r.createElement("div",{id:e.id,ref:l,style:d},s&&r.createElement(S.Provider,{value:p},r.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var P=n(3935),j=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function L(e,t){if(e&&t){var n=e.style;for(var r in t){var o=t[r];Number.isFinite(o)&&!j.test(r)?n[r]=o+"px":n[r]=o}}}function M(e,t){var n=(0,r.useContext)(S),o=n.map,a=n.mapLib,i=(0,r.useRef)({props:e});i.current.props=e;var s=(0,r.useMemo)((function(){var t=!1;r.Children.forEach(e.children,(function(e){e&&(t=!0)}));var n=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(n);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,r.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,l,c,p,d,m,f=e.longitude,g=e.latitude,v=e.offset,h=e.style,y=e.draggable,_=void 0!==y&&y,b=e.popup,w=void 0===b?null:b,k=e.rotation,x=void 0===k?0:k,E=e.rotationAlignment,C=void 0===E?"auto":E,j=e.pitchAlignment,M=void 0===j?"auto":j;return(0,r.useEffect)((function(){L(s.getElement(),h)}),[h]),(0,r.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===f&&s.getLngLat().lat===g||s.setLngLat([f,g]),v&&(u=s.getOffset(),l=v,c=Array.isArray(u)?u[0]:u?u.x:0,p=Array.isArray(u)?u[1]:u?u.y:0,d=Array.isArray(l)?l[0]:l?l.x:0,m=Array.isArray(l)?l[1]:l?l.y:0,c!==d||p!==m)&&s.setOffset(v),s.isDraggable()!==_&&s.setDraggable(_),s.getRotation()!==x&&s.setRotation(x),s.getRotationAlignment()!==C&&s.setRotationAlignment(C),s.getPitchAlignment()!==M&&s.setPitchAlignment(M),s.getPopup()!==w&&s.setPopup(w),(0,P.createPortal)(e.children,s.getElement())}const O=(0,r.memo)((0,r.forwardRef)(M));function T(e){return new Set(e?e.trim().split(/\s+/):[])}function D(e,t){var n=(0,r.useContext)(S),o=n.map,a=n.mapLib,s=(0,r.useMemo)((function(){return document.createElement("div")}),[]),u=(0,r.useRef)({props:e});u.current.props=e;var l=(0,r.useMemo)((function(){var t=Object.assign({},e),n=new a.Popup(t);return n.setLngLat([e.longitude,e.latitude]),n.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),n}),[]);if((0,r.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return l.on("close",e),l.setDOMContent(s).addTo(o.getMap()),function(){l.off("close",e),l.isOpen()&&l.remove()}}),[]),(0,r.useEffect)((function(){L(l.getElement(),e.style)}),[e.style]),(0,r.useImperativeHandle)(t,(function(){return l}),[]),l.isOpen()&&(l.getLngLat().lng===e.longitude&&l.getLngLat().lat===e.latitude||l.setLngLat([e.longitude,e.latitude]),e.offset&&!i(l.options.offset,e.offset)&&l.setOffset(e.offset),l.options.anchor===e.anchor&&l.options.maxWidth===e.maxWidth||(l.options.anchor=e.anchor,l.setMaxWidth(e.maxWidth)),l.options.className!==e.className)){for(var p,d=T(l.options.className),m=T(e.className),f=(0,c.Z)(d);!(p=f()).done;){var g=p.value;m.has(g)||l.removeClassName(g)}for(var v,h=(0,c.Z)(m);!(v=h()).done;){var y=v.value;d.has(y)||l.addClassName(y)}l.options.className=e.className}return(0,P.createPortal)(e.children,s)}const R=(0,r.memo)((0,r.forwardRef)(D));const z=function(e,t,n,o){var a=(0,r.useContext)(S),i=(0,r.useMemo)((function(){return e(a)}),[]);return(0,r.useEffect)((function(){var e=o||n||t,r="function"==typeof t&&"function"==typeof n?t:null,s="function"==typeof n?n:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),r&&r(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function A(e){var t=z((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,r.useEffect)((function(){L(t._controlContainer,e.style)}),[e.style]),null}const N=(0,r.memo)(A);function I(e,t){var n=(0,r.useRef)({props:e}),o=z((function(t){var r=new t.mapLib.GeolocateControl(e),o=r._setupUI;return r._setupUI=function(e){r._container.hasChildNodes()||o(e)},r.on("geolocate",(function(e){null==n.current.props.onGeolocate||n.current.props.onGeolocate(e)})),r.on("error",(function(e){null==n.current.props.onError||n.current.props.onError(e)})),r.on("outofmaxbounds",(function(e){null==n.current.props.onOutOfMaxBounds||n.current.props.onOutOfMaxBounds(e)})),r.on("trackuserlocationstart",(function(e){null==n.current.props.onTrackUserLocationStart||n.current.props.onTrackUserLocationStart(e)})),r.on("trackuserlocationend",(function(e){null==n.current.props.onTrackUserLocationEnd||n.current.props.onTrackUserLocationEnd(e)})),r}),{position:e.position});return n.current.props=e,(0,r.useImperativeHandle)(t,(function(){return o}),[]),(0,r.useEffect)((function(){L(o._container,e.style)}),[e.style]),null}const Z=(0,r.memo)((0,r.forwardRef)(I));function F(e){var t=z((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,r.useEffect)((function(){L(t._container,e.style)}),[e.style]),null}const U=(0,r.memo)(F);function W(e){var t=z((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),n=(0,r.useRef)(e),o=n.current;n.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,r.useEffect)((function(){L(t._container,a)}),[a]),null}const J=(0,r.memo)(W);function G(e,t){if(!e)throw new Error(t)}var B=0;const H=function(e){var t=(0,r.useContext)(S).map.getMap(),n=(0,r.useRef)(e),o=(0,r.useState)(0)[1],a=(0,r.useMemo)((function(){return e.id||"jsx-layer-"+B++}),[]);if((0,r.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,n,r){if(G(n.id===r.id,"layer id changed"),G(n.type===r.type,"layer type changed"),"custom"!==n.type&&"custom"!==r.type){var o=n.layout,a=void 0===o?{}:o,s=n.paint,u=void 0===s?{}:s,l=n.filter,c=n.minzoom,p=n.maxzoom,d=n.beforeId;if(d!==r.beforeId&&e.moveLayer(t,d),a!==r.layout){var m=r.layout||{};for(var f in a)i(a[f],m[f])||e.setLayoutProperty(t,f,a[f]);for(var g in m)a.hasOwnProperty(g)||e.setLayoutProperty(t,g,void 0)}if(u!==r.paint){var v=r.paint||{};for(var h in u)i(u[h],v[h])||e.setPaintProperty(t,h,u[h]);for(var y in v)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(l,r.filter)||e.setFilter(t,l),c===r.minzoom&&p===r.maxzoom||e.setLayerZoomRange(t,c,p)}}(t,a,e,n.current)}catch(s){console.warn(s)}else!function(e,t,n){if(e.style&&e.style._loaded&&(!("source"in n)||e.getSource(n.source))){var r=Object.assign({},n,{id:t});delete r.beforeId,e.addLayer(r,n.beforeId)}}(t,a,e);return n.current=e,null};var V=0;const q=function(e){var t=(0,r.useContext)(S).map.getMap(),n=(0,r.useRef)(e),o=(0,r.useState)(0)[1],a=(0,r.useMemo)((function(){return e.id||"jsx-source-"+V++}),[]);(0,r.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var n,r=null==(n=t.getStyle())?void 0:n.layers;if(r)for(var o,i=(0,c.Z)(r);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,n){G(t.id===n.id,"source id changed"),G(t.type===n.type,"source type changed");var r="",o=0;for(var a in t)"children"===a||"id"===a||i(n[a],t[a])||(r=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===r)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(r){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+r)}}(s,e,n.current):s=function(e,t,n){if(e.style&&e.style._loaded){var r=Object.assign({},n);return delete r.id,delete r.children,e.addSource(t,r),e.getSource(t)}return null}(t,a,e),n.current=e,s&&r.Children.map(e.children,(function(e){return e&&(0,r.cloneElement)(e,{source:a})}))||null};var Q=n.e(8539).then(n.t.bind(n,8539,23)),X=r.forwardRef((function(e,t){return C(e,t,Q)})),Y=O,$=R,K=N,ee=U,te=Z,ne=J,re=H,oe=q;const ae=X},745:(e,t,n)=>{var r=n(3935);r.createRoot,r.hydrateRoot},1202:(e,t,n)=>{n.d(t,{Z:()=>i});var r=n(1002);function o(e){var t=function(e,t){if("object"!==(0,r.Z)(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t||"default");if("object"!==(0,r.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,r.Z)(t)?t:String(t)}function a(e,t){for(var n=0;n{e.exports=JSON.parse('[{"city":"New York","population":"8,175,133","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/b/b9/Above_Gotham.jpg/240px-Above_Gotham.jpg","state":"New York","latitude":40.6643,"longitude":-73.9385},{"city":"Los Angeles","population":"3,792,621","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/5/57/LA_Skyline_Mountains2.jpg/240px-LA_Skyline_Mountains2.jpg","state":"California","latitude":34.0194,"longitude":-118.4108},{"city":"Chicago","population":"2,695,598","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/8/85/2008-06-10_3000x1000_chicago_skyline.jpg/240px-2008-06-10_3000x1000_chicago_skyline.jpg","state":"Illinois","latitude":41.8376,"longitude":-87.6818},{"city":"Houston","population":"2,100,263","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/6/60/Aerial_views_of_the_Houston%2C_Texas%2C_28005u.jpg/240px-Aerial_views_of_the_Houston%2C_Texas%2C_28005u.jpg","state":"Texas","latitude":29.7805,"longitude":-95.3863},{"city":"Phoenix","population":"1,445,632","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/b/b9/Downtown_Phoenix_Aerial_Looking_Northeast.jpg/207px-Downtown_Phoenix_Aerial_Looking_Northeast.jpg","state":"Arizona","latitude":33.5722,"longitude":-112.088},{"city":"Philadelphia","population":"1,526,006","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/4/4d/Philly_skyline.jpg/240px-Philly_skyline.jpg","state":"Pennsylvania","latitude":40.0094,"longitude":-75.1333},{"city":"San Antonio","population":"1,327,407","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/f/ff/Downtown_San_Antonio_View.JPG/240px-Downtown_San_Antonio_View.JPG","state":"Texas","latitude":29.4724,"longitude":-98.5251},{"city":"San Diego","population":"1,307,402","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/5/53/US_Navy_110604-N-NS602-574_Navy_and_Marine_Corps_personnel%2C_along_with_community_leaders_from_the_greater_San_Diego_area_come_together_to_commemora.jpg/240px-US_Navy_110604-N-NS602-574_Navy_and_Marine_Corps_personnel%2C_along_with_community_leaders_from_the_greater_San_Diego_area_come_together_to_commemora.jpg","state":"California","latitude":32.8153,"longitude":-117.135},{"city":"Dallas","population":"1,197,816","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/a/ab/Dallas_skyline_daytime.jpg/240px-Dallas_skyline_daytime.jpg","state":"Texas","latitude":32.7757,"longitude":-96.7967},{"city":"San Jose","population":"945,942","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/1/1e/Downtown_San_Jose_skyline.PNG/240px-Downtown_San_Jose_skyline.PNG","state":"California","latitude":37.2969,"longitude":-121.8193},{"city":"Austin","population":"790,390","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/9/97/Austin2012-12-01.JPG/240px-Austin2012-12-01.JPG","state":"Texas","latitude":30.3072,"longitude":-97.756},{"city":"Jacksonville","population":"821,784","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/f/f3/Skyline_of_Jacksonville_FL%2C_South_view_20160706_1.jpg/240px-Skyline_of_Jacksonville_FL%2C_South_view_20160706_1.jpg","state":"Florida","latitude":30.337,"longitude":-81.6613},{"city":"San Francisco","population":"805,235","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/6/6a/San_Francisco_skyline_from_Coit_Tower.jpg/240px-San_Francisco_skyline_from_Coit_Tower.jpg","state":"California","latitude":37.7751,"longitude":-122.4193},{"city":"Columbus","population":"787,033","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/f/fc/Columbus-ohio-skyline-panorama.jpg/240px-Columbus-ohio-skyline-panorama.jpg","state":"Ohio","latitude":39.9848,"longitude":-82.985},{"city":"Indianapolis","population":"820,445","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/1/16/Downtown_indy_from_parking_garage_zoom.JPG/213px-Downtown_indy_from_parking_garage_zoom.JPG","state":"Indiana","latitude":39.7767,"longitude":-86.1459},{"city":"Fort Worth","population":"741,206","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/d/db/FortWorthTexasSkylineW.jpg/240px-FortWorthTexasSkylineW.jpg","state":"Texas","latitude":32.7795,"longitude":-97.3463},{"city":"Charlotte","population":"731,424","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/7/7d/Charlotte_skyline45647.jpg/222px-Charlotte_skyline45647.jpg","state":"North Carolina","latitude":35.2087,"longitude":-80.8307},{"city":"Seattle","population":"608,660","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/3/36/SeattleI5Skyline.jpg/240px-SeattleI5Skyline.jpg","state":"Washington","latitude":47.6205,"longitude":-122.3509},{"city":"Denver","population":"600,158","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/0/0b/DenverCP.JPG/240px-DenverCP.JPG","state":"Colorado","latitude":39.7618,"longitude":-104.8806},{"city":"El Paso","population":"649,121","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/6/6d/Downtown_El_Paso_at_sunset.jpeg/240px-Downtown_El_Paso_at_sunset.jpeg","state":"Texas","latitude":31.8484,"longitude":-106.427}]')}}]); \ No newline at end of file diff --git a/assets/js/2b604174.be966c49.js b/assets/js/2b604174.be966c49.js new file mode 100644 index 00000000..127964f2 --- /dev/null +++ b/assets/js/2b604174.be966c49.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkreact_map_gl_website=self.webpackChunkreact_map_gl_website||[]).push([[5186],{3905:(e,t,n)=>{n.d(t,{Zo:()=>c,kt:()=>f});var r=n(7294);function o(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function a(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function i(e){for(var t=1;t=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var u=r.createContext({}),l=function(e){var t=r.useContext(u),n=t;return e&&(n="function"==typeof e?e(t):i(i({},t),e)),n},c=function(e){var t=l(e.components);return r.createElement(u.Provider,{value:t},e.children)},p="mdxType",d={inlineCode:"code",wrapper:function(e){var t=e.children;return r.createElement(r.Fragment,{},t)}},m=r.forwardRef((function(e,t){var n=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,c=s(e,["components","mdxType","originalType","parentName"]),p=l(n),m=o,f=p["".concat(u,".").concat(m)]||p[m]||d[m]||a;return n?r.createElement(f,i(i({ref:t},c),{},{components:n})):r.createElement(f,i({ref:t},c))}));function f(e,t){var n=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=n.length,i=new Array(a);i[0]=m;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[p]="string"==typeof e?e:o,i[1]=s;for(var l=2;l{n.r(t),n.d(t,{assets:()=>b,contentTitle:()=>y,default:()=>E,frontMatter:()=>h,metadata:()=>_,toc:()=>w});var r=n(7462),o=n(3366),a=n(7294),i=n(3905),s=(n(745),n(945));function u(){return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Marker, Popup, NavigationControl and FullscreenControl "),a.createElement("p",null,"Map showing top 20 most populated cities of the United States. Click on a marker to learn more."),a.createElement("p",null,"Data source:"," ",a.createElement("a",{href:"https://en.wikipedia.org/wiki/List_of_United_States_cities_by_population"},"Wikipedia")),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/controls",target:"_new"},"View Code \u2197")))}const l=a.memo(u);var c={cursor:"pointer",fill:"#d00",stroke:"none"};function p(e){var t=e.size,n=void 0===t?20:t;return a.createElement("svg",{height:n,viewBox:"0 0 24 24",style:c},a.createElement("path",{d:"M20.2,15.7L20.2,15.7c1.1-1.6,1.8-3.6,1.8-5.7c0-5.6-4.5-10-10-10S2,4.5,2,10c0,2,0.6,3.9,1.6,5.4c0,0.1,0.1,0.2,0.2,0.3\n c0,0,0.1,0.1,0.1,0.2c0.2,0.3,0.4,0.6,0.7,0.9c2.6,3.1,7.4,7.6,7.4,7.6s4.8-4.5,7.4-7.5c0.2-0.3,0.5-0.6,0.7-0.9\n C20.1,15.8,20.2,15.8,20.2,15.7z"}))}const d=a.memo(p);var m=n(7971),f="";function g(){var e=(0,a.useState)(null),t=e[0],n=e[1],r=(0,a.useMemo)((function(){return m.map((function(e,t){return a.createElement(s.Jx,{key:"marker-"+t,longitude:e.longitude,latitude:e.latitude,anchor:"bottom",onClick:function(t){t.originalEvent.stopPropagation(),n(e)}},a.createElement(d,null))}))}),[]);return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:{latitude:40,longitude:-100,zoom:3.5,bearing:0,pitch:0},mapStyle:"mapbox://styles/mapbox/dark-v9",mapboxAccessToken:f},a.createElement(s.$j,{position:"top-left"}),a.createElement(s.ot,{position:"top-left"}),a.createElement(s.Pv,{position:"top-left"}),a.createElement(s.jf,null),r,t&&a.createElement(s.GI,{anchor:"top",longitude:Number(t.longitude),latitude:Number(t.latitude),onClose:function(){return n(null)}},a.createElement("div",null,t.city,", ",t.state," |"," ",a.createElement("a",{target:"_new",href:"http://en.wikipedia.org/w/index.php?title=Special:Search&search="+t.city+", "+t.state},"Wikipedia")),a.createElement("img",{width:"100%",src:t.image}))),a.createElement(l,null))}var v=["components"],h={},y="Markers, Popups and Controls",_={unversionedId:"controls",id:"controls",title:"Markers, Popups and Controls",description:"",source:"@site/src/examples/controls.mdx",sourceDirName:".",slug:"/controls",permalink:"/react-map-gl/examples/controls",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Dynamic Styling",permalink:"/react-map-gl/examples/layers"},next:{title:"Custom Cursor",permalink:"/react-map-gl/examples/custom-cursor"}},b={},w=[],k={toc:w},x="wrapper";function E(e){var t=e.components,n=(0,o.Z)(e,v);return(0,i.kt)(x,(0,r.Z)({},k,n,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"markers-popups-and-controls"},"Markers, Popups and Controls"),(0,i.kt)(g,{mdxType:"App"}))}E.isMDXComponent=!0},945:(e,t,n)=>{n.d(t,{ot:()=>K,$j:()=>te,mh:()=>re,D5:()=>X,Jx:()=>Y,Pv:()=>ee,GI:()=>$,jf:()=>ne,Hw:()=>oe,ZP:()=>ae,PE:()=>z});var r=n(7294),o=r.createContext(null);var a=n(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var n=0;n0;)n.appendChild(a.childNodes[0]);o._container=n;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(n)),r.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):r._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),r},t._initialize=function(e){var t=this,n=this.props,r=n.mapStyle,o=void 0===r?m:r,a=Object.assign({},n,n.initialViewState,{accessToken:n.mapboxAccessToken||b()||null,container:e,style:d(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),n.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,n.gl}}var l=new this._MapClass(a);i.padding&&l.setPadding(i.padding),n.cursor&&(l.getCanvas().style.cursor=n.cursor),this._createShadowTransform(l);var c=l._render;l._render=function(e){t._inRender=!0,c.call(l,e),t._inRender=!1};var p=l._renderTaskQueue.run;l._renderTaskQueue.run=function(e){p.call(l._renderTaskQueue,e),t._onBeforeRepaint()},l.on("render",(function(){return t._onAfterRepaint()}));var h=l.fire;for(var y in l.fire=this._fireEvent.bind(this,h),l.on("resize",(function(){t._renderTransform.resize(l.transform.width,l.transform.height)})),l.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(l.transform,t._renderTransform)})),l.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),f)l.on(y,this._onPointerEvent);for(var _ in g)l.on(_,this._onCameraEvent);for(var w in v)l.on(w,this._onEvent);this._map=l},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,n,r=(t=e.transform,(n=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,n);e.painter.transform=r,this._renderTransform=r},t._updateSize=function(e){var t=e.viewState;if(t){var n=this._map;if(t.width!==n.transform.width||t.height!==n.transform.height)return n.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var n=this._map,r=this._renderTransform,o=r.zoom,a=r.pitch,i=r.bearing,s=n.isMoving();s&&(r.cameraElevationReference="sea");var c=l(r,Object.assign({},u(n.transform),e));if(s&&(r.cameraElevationReference="ground"),c&&t){var p=this._deferredEvents;p.move=!0,p.zoom||(p.zoom=o!==r.zoom),p.rotate||(p.rotate=i!==r.bearing),p.pitch||(p.pitch=a!==r.pitch)}return s||l(n.transform,e),c},t._updateSettings=function(e,t){for(var n=this._map,r=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=r}else this._hoveredFeatures=null},t._fireEvent=function(e,t,n){var r=this._map,o=r.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in g&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(r.transform=this._renderTransform,e.call(r,t,n),r.transform=o,r):(e.call(r,t,n),r)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var n in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[n]&&t.fire(n);this._internalUpdate=!1;var r=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,r),t.transform=r}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function b(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(n){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(r){}return e}_.savedMaps=[];var w=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function k(e){if(!e)return null;for(var t,n=e.map,r={getMap:function(){return n},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var r=n.transform;n.transform=e.transform;var o=n.project(t);return n.transform=r,o},unproject:function(t){var r=n.transform;n.transform=e.transform;var o=n.unproject(t);return n.transform=r,o},queryTerrainElevation:function(t,r){var o=n.transform;n.transform=e.transform;var a=n.queryTerrainElevation(t,r);return n.transform=o,a},queryRenderedFeatures:function(t,r){var o=n.transform;n.transform=e.transform;var a=n.queryRenderedFeatures(t,r);return n.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,n=e;for(;n;){for(var r,o=(0,c.Z)(Object.getOwnPropertyNames(n));!(r=o()).done;){var a=r.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}n=Object.getPrototypeOf(n)}return Array.from(t)}(n));!(t=o()).done;){var a=t.value;a in r||w.includes(a)||(r[a]=n[a].bind(n))}return r}const x="undefined"!=typeof document?r.useLayoutEffect:r.useEffect;var E=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var S=r.createContext(null);function C(e,t,n){var a=(0,r.useContext)(o),i=(0,r.useState)(null),s=i[0],u=i[1],l=(0,r.useRef)(),p=(0,r.useRef)({mapLib:null,map:null}).current;(0,r.useEffect)((function(){var t,r=e.mapLib,o=!0;return Promise.resolve(r||n).then((function(n){if(o){if(!n)throw new Error("Invalid mapLib");var r="Map"in n?n:n.default;if(!r.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var n,r=(0,c.Z)(E);!(n=r()).done;){var o=n.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(r,e),r.supported&&!r.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=_.reuse(e,l.current)),t||(t=new _(r.Map,e,l.current)),p.map=k(t),p.mapLib=r,u(t),null==a||a.onMapMount(p.map,e.id)}})).catch((function(t){var n=e.onError;n?n({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),x((function(){s&&s.setProps(e)})),(0,r.useImperativeHandle)(t,(function(){return p.map}),[s]);var d=(0,r.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return r.createElement("div",{id:e.id,ref:l,style:d},s&&r.createElement(S.Provider,{value:p},r.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var P=n(3935),j=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function L(e,t){if(e&&t){var n=e.style;for(var r in t){var o=t[r];Number.isFinite(o)&&!j.test(r)?n[r]=o+"px":n[r]=o}}}function M(e,t){var n=(0,r.useContext)(S),o=n.map,a=n.mapLib,i=(0,r.useRef)({props:e});i.current.props=e;var s=(0,r.useMemo)((function(){var t=!1;r.Children.forEach(e.children,(function(e){e&&(t=!0)}));var n=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(n);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,r.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,l,c,p,d,m,f=e.longitude,g=e.latitude,v=e.offset,h=e.style,y=e.draggable,_=void 0!==y&&y,b=e.popup,w=void 0===b?null:b,k=e.rotation,x=void 0===k?0:k,E=e.rotationAlignment,C=void 0===E?"auto":E,j=e.pitchAlignment,M=void 0===j?"auto":j;return(0,r.useEffect)((function(){L(s.getElement(),h)}),[h]),(0,r.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===f&&s.getLngLat().lat===g||s.setLngLat([f,g]),v&&(u=s.getOffset(),l=v,c=Array.isArray(u)?u[0]:u?u.x:0,p=Array.isArray(u)?u[1]:u?u.y:0,d=Array.isArray(l)?l[0]:l?l.x:0,m=Array.isArray(l)?l[1]:l?l.y:0,c!==d||p!==m)&&s.setOffset(v),s.isDraggable()!==_&&s.setDraggable(_),s.getRotation()!==x&&s.setRotation(x),s.getRotationAlignment()!==C&&s.setRotationAlignment(C),s.getPitchAlignment()!==M&&s.setPitchAlignment(M),s.getPopup()!==w&&s.setPopup(w),(0,P.createPortal)(e.children,s.getElement())}const T=(0,r.memo)((0,r.forwardRef)(M));function O(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var n=(0,r.useContext)(S),o=n.map,a=n.mapLib,s=(0,r.useMemo)((function(){return document.createElement("div")}),[]),u=(0,r.useRef)({props:e});u.current.props=e;var l=(0,r.useMemo)((function(){var t=Object.assign({},e),n=new a.Popup(t);return n.setLngLat([e.longitude,e.latitude]),n.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),n}),[]);if((0,r.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return l.on("close",e),l.setDOMContent(s).addTo(o.getMap()),function(){l.off("close",e),l.isOpen()&&l.remove()}}),[]),(0,r.useEffect)((function(){L(l.getElement(),e.style)}),[e.style]),(0,r.useImperativeHandle)(t,(function(){return l}),[]),l.isOpen()&&(l.getLngLat().lng===e.longitude&&l.getLngLat().lat===e.latitude||l.setLngLat([e.longitude,e.latitude]),e.offset&&!i(l.options.offset,e.offset)&&l.setOffset(e.offset),l.options.anchor===e.anchor&&l.options.maxWidth===e.maxWidth||(l.options.anchor=e.anchor,l.setMaxWidth(e.maxWidth)),l.options.className!==e.className)){for(var p,d=O(l.options.className),m=O(e.className),f=(0,c.Z)(d);!(p=f()).done;){var g=p.value;m.has(g)||l.removeClassName(g)}for(var v,h=(0,c.Z)(m);!(v=h()).done;){var y=v.value;d.has(y)||l.addClassName(y)}l.options.className=e.className}return(0,P.createPortal)(e.children,s)}const D=(0,r.memo)((0,r.forwardRef)(R));const z=function(e,t,n,o){var a=(0,r.useContext)(S),i=(0,r.useMemo)((function(){return e(a)}),[]);return(0,r.useEffect)((function(){var e=o||n||t,r="function"==typeof t&&"function"==typeof n?t:null,s="function"==typeof n?n:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),r&&r(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function A(e){var t=z((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,r.useEffect)((function(){L(t._controlContainer,e.style)}),[e.style]),null}const N=(0,r.memo)(A);function I(e,t){var n=(0,r.useRef)({props:e}),o=z((function(t){var r=new t.mapLib.GeolocateControl(e),o=r._setupUI;return r._setupUI=function(e){r._container.hasChildNodes()||o(e)},r.on("geolocate",(function(e){null==n.current.props.onGeolocate||n.current.props.onGeolocate(e)})),r.on("error",(function(e){null==n.current.props.onError||n.current.props.onError(e)})),r.on("outofmaxbounds",(function(e){null==n.current.props.onOutOfMaxBounds||n.current.props.onOutOfMaxBounds(e)})),r.on("trackuserlocationstart",(function(e){null==n.current.props.onTrackUserLocationStart||n.current.props.onTrackUserLocationStart(e)})),r.on("trackuserlocationend",(function(e){null==n.current.props.onTrackUserLocationEnd||n.current.props.onTrackUserLocationEnd(e)})),r}),{position:e.position});return n.current.props=e,(0,r.useImperativeHandle)(t,(function(){return o}),[]),(0,r.useEffect)((function(){L(o._container,e.style)}),[e.style]),null}const Z=(0,r.memo)((0,r.forwardRef)(I));function F(e){var t=z((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,r.useEffect)((function(){L(t._container,e.style)}),[e.style]),null}const U=(0,r.memo)(F);function W(e){var t=z((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),n=(0,r.useRef)(e),o=n.current;n.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,r.useEffect)((function(){L(t._container,a)}),[a]),null}const J=(0,r.memo)(W);function G(e,t){if(!e)throw new Error(t)}var B=0;const H=function(e){var t=(0,r.useContext)(S).map.getMap(),n=(0,r.useRef)(e),o=(0,r.useState)(0)[1],a=(0,r.useMemo)((function(){return e.id||"jsx-layer-"+B++}),[]);if((0,r.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,n,r){if(G(n.id===r.id,"layer id changed"),G(n.type===r.type,"layer type changed"),"custom"!==n.type&&"custom"!==r.type){var o=n.layout,a=void 0===o?{}:o,s=n.paint,u=void 0===s?{}:s,l=n.filter,c=n.minzoom,p=n.maxzoom,d=n.beforeId;if(d!==r.beforeId&&e.moveLayer(t,d),a!==r.layout){var m=r.layout||{};for(var f in a)i(a[f],m[f])||e.setLayoutProperty(t,f,a[f]);for(var g in m)a.hasOwnProperty(g)||e.setLayoutProperty(t,g,void 0)}if(u!==r.paint){var v=r.paint||{};for(var h in u)i(u[h],v[h])||e.setPaintProperty(t,h,u[h]);for(var y in v)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(l,r.filter)||e.setFilter(t,l),c===r.minzoom&&p===r.maxzoom||e.setLayerZoomRange(t,c,p)}}(t,a,e,n.current)}catch(s){console.warn(s)}else!function(e,t,n){if(e.style&&e.style._loaded&&(!("source"in n)||e.getSource(n.source))){var r=Object.assign({},n,{id:t});delete r.beforeId,e.addLayer(r,n.beforeId)}}(t,a,e);return n.current=e,null};var V=0;const q=function(e){var t=(0,r.useContext)(S).map.getMap(),n=(0,r.useRef)(e),o=(0,r.useState)(0)[1],a=(0,r.useMemo)((function(){return e.id||"jsx-source-"+V++}),[]);(0,r.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var n,r=null==(n=t.getStyle())?void 0:n.layers;if(r)for(var o,i=(0,c.Z)(r);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,n){G(t.id===n.id,"source id changed"),G(t.type===n.type,"source type changed");var r="",o=0;for(var a in t)"children"===a||"id"===a||i(n[a],t[a])||(r=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===r)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(r){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+r)}}(s,e,n.current):s=function(e,t,n){if(e.style&&e.style._loaded){var r=Object.assign({},n);return delete r.id,delete r.children,e.addSource(t,r),e.getSource(t)}return null}(t,a,e),n.current=e,s&&r.Children.map(e.children,(function(e){return e&&(0,r.cloneElement)(e,{source:a})}))||null};var Q=n.e(8539).then(n.t.bind(n,8539,23)),X=r.forwardRef((function(e,t){return C(e,t,Q)})),Y=T,$=D,K=N,ee=U,te=Z,ne=J,re=H,oe=q;const ae=X},745:(e,t,n)=>{var r=n(3935);r.createRoot,r.hydrateRoot},1202:(e,t,n)=>{n.d(t,{Z:()=>i});var r=n(1002);function o(e){var t=function(e,t){if("object"!==(0,r.Z)(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t||"default");if("object"!==(0,r.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,r.Z)(t)?t:String(t)}function a(e,t){for(var n=0;n{e.exports=JSON.parse('[{"city":"New York","population":"8,175,133","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/b/b9/Above_Gotham.jpg/240px-Above_Gotham.jpg","state":"New York","latitude":40.6643,"longitude":-73.9385},{"city":"Los Angeles","population":"3,792,621","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/5/57/LA_Skyline_Mountains2.jpg/240px-LA_Skyline_Mountains2.jpg","state":"California","latitude":34.0194,"longitude":-118.4108},{"city":"Chicago","population":"2,695,598","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/8/85/2008-06-10_3000x1000_chicago_skyline.jpg/240px-2008-06-10_3000x1000_chicago_skyline.jpg","state":"Illinois","latitude":41.8376,"longitude":-87.6818},{"city":"Houston","population":"2,100,263","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/6/60/Aerial_views_of_the_Houston%2C_Texas%2C_28005u.jpg/240px-Aerial_views_of_the_Houston%2C_Texas%2C_28005u.jpg","state":"Texas","latitude":29.7805,"longitude":-95.3863},{"city":"Phoenix","population":"1,445,632","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/b/b9/Downtown_Phoenix_Aerial_Looking_Northeast.jpg/207px-Downtown_Phoenix_Aerial_Looking_Northeast.jpg","state":"Arizona","latitude":33.5722,"longitude":-112.088},{"city":"Philadelphia","population":"1,526,006","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/4/4d/Philly_skyline.jpg/240px-Philly_skyline.jpg","state":"Pennsylvania","latitude":40.0094,"longitude":-75.1333},{"city":"San Antonio","population":"1,327,407","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/f/ff/Downtown_San_Antonio_View.JPG/240px-Downtown_San_Antonio_View.JPG","state":"Texas","latitude":29.4724,"longitude":-98.5251},{"city":"San Diego","population":"1,307,402","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/5/53/US_Navy_110604-N-NS602-574_Navy_and_Marine_Corps_personnel%2C_along_with_community_leaders_from_the_greater_San_Diego_area_come_together_to_commemora.jpg/240px-US_Navy_110604-N-NS602-574_Navy_and_Marine_Corps_personnel%2C_along_with_community_leaders_from_the_greater_San_Diego_area_come_together_to_commemora.jpg","state":"California","latitude":32.8153,"longitude":-117.135},{"city":"Dallas","population":"1,197,816","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/a/ab/Dallas_skyline_daytime.jpg/240px-Dallas_skyline_daytime.jpg","state":"Texas","latitude":32.7757,"longitude":-96.7967},{"city":"San Jose","population":"945,942","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/1/1e/Downtown_San_Jose_skyline.PNG/240px-Downtown_San_Jose_skyline.PNG","state":"California","latitude":37.2969,"longitude":-121.8193},{"city":"Austin","population":"790,390","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/9/97/Austin2012-12-01.JPG/240px-Austin2012-12-01.JPG","state":"Texas","latitude":30.3072,"longitude":-97.756},{"city":"Jacksonville","population":"821,784","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/f/f3/Skyline_of_Jacksonville_FL%2C_South_view_20160706_1.jpg/240px-Skyline_of_Jacksonville_FL%2C_South_view_20160706_1.jpg","state":"Florida","latitude":30.337,"longitude":-81.6613},{"city":"San Francisco","population":"805,235","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/6/6a/San_Francisco_skyline_from_Coit_Tower.jpg/240px-San_Francisco_skyline_from_Coit_Tower.jpg","state":"California","latitude":37.7751,"longitude":-122.4193},{"city":"Columbus","population":"787,033","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/f/fc/Columbus-ohio-skyline-panorama.jpg/240px-Columbus-ohio-skyline-panorama.jpg","state":"Ohio","latitude":39.9848,"longitude":-82.985},{"city":"Indianapolis","population":"820,445","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/1/16/Downtown_indy_from_parking_garage_zoom.JPG/213px-Downtown_indy_from_parking_garage_zoom.JPG","state":"Indiana","latitude":39.7767,"longitude":-86.1459},{"city":"Fort Worth","population":"741,206","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/d/db/FortWorthTexasSkylineW.jpg/240px-FortWorthTexasSkylineW.jpg","state":"Texas","latitude":32.7795,"longitude":-97.3463},{"city":"Charlotte","population":"731,424","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/7/7d/Charlotte_skyline45647.jpg/222px-Charlotte_skyline45647.jpg","state":"North Carolina","latitude":35.2087,"longitude":-80.8307},{"city":"Seattle","population":"608,660","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/3/36/SeattleI5Skyline.jpg/240px-SeattleI5Skyline.jpg","state":"Washington","latitude":47.6205,"longitude":-122.3509},{"city":"Denver","population":"600,158","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/0/0b/DenverCP.JPG/240px-DenverCP.JPG","state":"Colorado","latitude":39.7618,"longitude":-104.8806},{"city":"El Paso","population":"649,121","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/6/6d/Downtown_El_Paso_at_sunset.jpeg/240px-Downtown_El_Paso_at_sunset.jpeg","state":"Texas","latitude":31.8484,"longitude":-106.427}]')}}]); \ No newline at end of file diff --git a/assets/js/3a4d92a3.4457ee0b.js b/assets/js/3a4d92a3.4457ee0b.js deleted file mode 100644 index 5a65af71..00000000 --- a/assets/js/3a4d92a3.4457ee0b.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkreact_map_gl_website=self.webpackChunkreact_map_gl_website||[]).push([[1341],{5700:(e,t,n)=>{n.r(t),n.d(t,{assets:()=>_,contentTitle:()=>h,default:()=>S,frontMatter:()=>g,metadata:()=>y,toc:()=>b});var r=n(7462),o=n(3366),a=n(7294),i=n(3905),s=(n(745),n(945));function u(e){var t=e.year;return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Interactive GeoJSON"),a.createElement("p",null,"Map showing median household income by state in year ",a.createElement("b",null,t),". Hover over a state to see details."),a.createElement("p",null,"Data source: ",a.createElement("a",{href:"www.census.gov"},"US Census Bureau")),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/geojson",target:"_new"},"View Code \u2197")),a.createElement("hr",null),a.createElement("div",{key:"year",className:"input"},a.createElement("label",null,"Year"),a.createElement("input",{type:"range",value:t,min:1995,max:2015,step:1,onChange:function(t){return e.onChange(t.target.value)}})))}const l=a.memo(u);var c={id:"data",type:"fill",paint:{"fill-color":{property:"percentile",stops:[[0,"#3288bd"],[1,"#66c2a5"],[2,"#abdda4"],[3,"#e6f598"],[4,"#ffffbf"],[5,"#fee08b"],[6,"#fdae61"],[7,"#f46d43"],[8,"#d53e4f"]]},"fill-opacity":.8}},f=n(685),p=n(5256);var d="";function m(){var e=(0,a.useState)(2015),t=e[0],n=e[1],r=(0,a.useState)(null),o=r[0],i=r[1],u=(0,a.useState)(null),m=u[0],v=u[1];(0,a.useEffect)((function(){fetch("https://raw.githubusercontent.com/uber/react-map-gl/master/examples/.data/us-income.geojson").then((function(e){return e.json()})).then((function(e){return i(e)})).catch((function(e){return console.error("Could not load data",e)}))}),[]);var g=(0,a.useCallback)((function(e){var t=e.features,n=e.point,r=n.x,o=n.y,a=t&&t[0];v(a&&{feature:a,x:r,y:o})}),[]),h=(0,a.useMemo)((function(){return o&&(e=function(e){return e.properties.income[t]},n=o.features,r=(0,p.FT)().domain(n.map(e)).range((0,f.w6)(9)),{type:"FeatureCollection",features:n.map((function(t){var n=e(t),o=Object.assign({},t.properties,{value:n,percentile:r(n)});return Object.assign({},t,{properties:o})}))});var e,n,r}),[o,t]);return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:{latitude:40,longitude:-100,zoom:3},mapStyle:"mapbox://styles/mapbox/light-v9",mapboxAccessToken:d,interactiveLayerIds:["data"],onMouseMove:g},a.createElement(s.Hw,{type:"geojson",data:h},a.createElement(s.mh,c)),m&&a.createElement("div",{className:"tooltip",style:{left:m.x,top:m.y}},a.createElement("div",null,"State: ",m.feature.properties.name),a.createElement("div",null,"Median Household Income: ",m.feature.properties.value),a.createElement("div",null,"Percentile: ",m.feature.properties.percentile/8*100))),a.createElement(l,{year:t,onChange:function(e){return n(e)}}))}var v=["components"],g={},h="GeoJSON",y={unversionedId:"geojson",id:"geojson",title:"GeoJSON",description:"",source:"@site/src/examples/geojson.mdx",sourceDirName:".",slug:"/geojson",permalink:"/react-map-gl/examples/geojson",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Draggable Marker",permalink:"/react-map-gl/examples/draggable-markers"},next:{title:"GeoJSON Animation",permalink:"/react-map-gl/examples/geojson-animation"}},_={},b=[],E={toc:b},x="wrapper";function S(e){var t=e.components,n=(0,o.Z)(e,v);return(0,i.kt)(x,(0,r.Z)({},E,n,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"geojson"},"GeoJSON"),(0,i.kt)(m,{mdxType:"App"}))}S.isMDXComponent=!0},945:(e,t,n)=>{n.d(t,{ot:()=>$,$j:()=>te,mh:()=>re,D5:()=>X,Jx:()=>Y,Pv:()=>ee,GI:()=>K,jf:()=>ne,Hw:()=>oe,ZP:()=>ae,PE:()=>I});var r=n(7294),o=r.createContext(null);var a=n(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var n=0;n0;)n.appendChild(a.childNodes[0]);o._container=n;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(n)),r.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):r._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),r},t._initialize=function(e){var t=this,n=this.props,r=n.mapStyle,o=void 0===r?d:r,a=Object.assign({},n,n.initialViewState,{accessToken:n.mapboxAccessToken||b()||null,container:e,style:p(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),n.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,n.gl}}var l=new this._MapClass(a);i.padding&&l.setPadding(i.padding),n.cursor&&(l.getCanvas().style.cursor=n.cursor),this._createShadowTransform(l);var c=l._render;l._render=function(e){t._inRender=!0,c.call(l,e),t._inRender=!1};var f=l._renderTaskQueue.run;l._renderTaskQueue.run=function(e){f.call(l._renderTaskQueue,e),t._onBeforeRepaint()},l.on("render",(function(){return t._onAfterRepaint()}));var h=l.fire;for(var y in l.fire=this._fireEvent.bind(this,h),l.on("resize",(function(){t._renderTransform.resize(l.transform.width,l.transform.height)})),l.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(l.transform,t._renderTransform)})),l.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)l.on(y,this._onPointerEvent);for(var _ in v)l.on(_,this._onCameraEvent);for(var E in g)l.on(E,this._onEvent);this._map=l},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,n,r=(t=e.transform,(n=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,n);e.painter.transform=r,this._renderTransform=r},t._updateSize=function(e){var t=e.viewState;if(t){var n=this._map;if(t.width!==n.transform.width||t.height!==n.transform.height)return n.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var n=this._map,r=this._renderTransform,o=r.zoom,a=r.pitch,i=r.bearing,s=n.isMoving();s&&(r.cameraElevationReference="sea");var c=l(r,Object.assign({},u(n.transform),e));if(s&&(r.cameraElevationReference="ground"),c&&t){var f=this._deferredEvents;f.move=!0,f.zoom||(f.zoom=o!==r.zoom),f.rotate||(f.rotate=i!==r.bearing),f.pitch||(f.pitch=a!==r.pitch)}return s||l(n.transform,e),c},t._updateSettings=function(e,t){for(var n=this._map,r=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=r}else this._hoveredFeatures=null},t._fireEvent=function(e,t,n){var r=this._map,o=r.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(r.transform=this._renderTransform,e.call(r,t,n),r.transform=o,r):(e.call(r,t,n),r)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var n in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[n]&&t.fire(n);this._internalUpdate=!1;var r=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,r),t.transform=r}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function b(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(n){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(r){}return e}_.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function x(e){if(!e)return null;for(var t,n=e.map,r={getMap:function(){return n},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var r=n.transform;n.transform=e.transform;var o=n.project(t);return n.transform=r,o},unproject:function(t){var r=n.transform;n.transform=e.transform;var o=n.unproject(t);return n.transform=r,o},queryTerrainElevation:function(t,r){var o=n.transform;n.transform=e.transform;var a=n.queryTerrainElevation(t,r);return n.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,n=e;for(;n;){for(var r,o=(0,c.Z)(Object.getOwnPropertyNames(n));!(r=o()).done;){var a=r.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}n=Object.getPrototypeOf(n)}return Array.from(t)}(n));!(t=o()).done;){var a=t.value;a in r||E.includes(a)||(r[a]=n[a].bind(n))}return r}const S="undefined"!=typeof document?r.useLayoutEffect:r.useEffect;var L=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var C=r.createContext(null);function w(e,t,n){var a=(0,r.useContext)(o),i=(0,r.useState)(null),s=i[0],u=i[1],l=(0,r.useRef)(),f=(0,r.useRef)({mapLib:null,map:null}).current;(0,r.useEffect)((function(){var t,r=e.mapLib,o=!0;return Promise.resolve(r||n).then((function(n){if(o){if(!n)throw new Error("Invalid mapLib");var r="Map"in n?n:n.default;if(!r.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var n,r=(0,c.Z)(L);!(n=r()).done;){var o=n.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(r,e),r.supported&&!r.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=_.reuse(e,l.current)),t||(t=new _(r.Map,e,l.current)),f.map=x(t),f.mapLib=r,u(t),null==a||a.onMapMount(f.map,e.id)}})).catch((function(t){var n=e.onError;n?n({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),S((function(){s&&s.setProps(e)})),(0,r.useImperativeHandle)(t,(function(){return f.map}),[s]);var p=(0,r.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return r.createElement("div",{id:e.id,ref:l,style:p},s&&r.createElement(C.Provider,{value:f},r.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var M=n(3935),P=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function j(e,t){if(e&&t){var n=e.style;for(var r in t){var o=t[r];Number.isFinite(o)&&!P.test(r)?n[r]=o+"px":n[r]=o}}}function T(e,t){var n=(0,r.useContext)(C),o=n.map,a=n.mapLib,i=(0,r.useRef)({props:e});i.current.props=e;var s=(0,r.useMemo)((function(){var t=!1;r.Children.forEach(e.children,(function(e){e&&(t=!0)}));var n=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(n);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,r.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,l,c,f,p,d,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,_=void 0!==y&&y,b=e.popup,E=void 0===b?null:b,x=e.rotation,S=void 0===x?0:x,L=e.rotationAlignment,w=void 0===L?"auto":L,P=e.pitchAlignment,T=void 0===P?"auto":P;return(0,r.useEffect)((function(){j(s.getElement(),h)}),[h]),(0,r.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),l=g,c=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,p=Array.isArray(l)?l[0]:l?l.x:0,d=Array.isArray(l)?l[1]:l?l.y:0,c!==p||f!==d)&&s.setOffset(g),s.isDraggable()!==_&&s.setDraggable(_),s.getRotation()!==S&&s.setRotation(S),s.getRotationAlignment()!==w&&s.setRotationAlignment(w),s.getPitchAlignment()!==T&&s.setPitchAlignment(T),s.getPopup()!==E&&s.setPopup(E),(0,M.createPortal)(e.children,s.getElement())}const k=(0,r.memo)((0,r.forwardRef)(T));function O(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var n=(0,r.useContext)(C),o=n.map,a=n.mapLib,s=(0,r.useMemo)((function(){return document.createElement("div")}),[]),u=(0,r.useRef)({props:e});u.current.props=e;var l=(0,r.useMemo)((function(){var t=Object.assign({},e),n=new a.Popup(t);return n.setLngLat([e.longitude,e.latitude]),n.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),n}),[]);if((0,r.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return l.on("close",e),l.setDOMContent(s).addTo(o.getMap()),function(){l.off("close",e),l.isOpen()&&l.remove()}}),[]),(0,r.useEffect)((function(){j(l.getElement(),e.style)}),[e.style]),(0,r.useImperativeHandle)(t,(function(){return l}),[]),l.isOpen()&&(l.getLngLat().lng===e.longitude&&l.getLngLat().lat===e.latitude||l.setLngLat([e.longitude,e.latitude]),e.offset&&!i(l.options.offset,e.offset)&&l.setOffset(e.offset),l.options.anchor===e.anchor&&l.options.maxWidth===e.maxWidth||(l.options.anchor=e.anchor,l.setMaxWidth(e.maxWidth)),l.options.className!==e.className)){for(var f,p=O(l.options.className),d=O(e.className),m=(0,c.Z)(p);!(f=m()).done;){var v=f.value;d.has(v)||l.removeClassName(v)}for(var g,h=(0,c.Z)(d);!(g=h()).done;){var y=g.value;p.has(y)||l.addClassName(y)}l.options.className=e.className}return(0,M.createPortal)(e.children,s)}const z=(0,r.memo)((0,r.forwardRef)(R));const I=function(e,t,n,o){var a=(0,r.useContext)(C),i=(0,r.useMemo)((function(){return e(a)}),[]);return(0,r.useEffect)((function(){var e=o||n||t,r="function"==typeof t&&"function"==typeof n?t:null,s="function"==typeof n?n:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),r&&r(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function A(e){var t=I((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,r.useEffect)((function(){j(t._controlContainer,e.style)}),[e.style]),null}const Z=(0,r.memo)(A);function N(e,t){var n=(0,r.useRef)({props:e}),o=I((function(t){var r=new t.mapLib.GeolocateControl(e),o=r._setupUI;return r._setupUI=function(e){r._container.hasChildNodes()||o(e)},r.on("geolocate",(function(e){null==n.current.props.onGeolocate||n.current.props.onGeolocate(e)})),r.on("error",(function(e){null==n.current.props.onError||n.current.props.onError(e)})),r.on("outofmaxbounds",(function(e){null==n.current.props.onOutOfMaxBounds||n.current.props.onOutOfMaxBounds(e)})),r.on("trackuserlocationstart",(function(e){null==n.current.props.onTrackUserLocationStart||n.current.props.onTrackUserLocationStart(e)})),r.on("trackuserlocationend",(function(e){null==n.current.props.onTrackUserLocationEnd||n.current.props.onTrackUserLocationEnd(e)})),r}),{position:e.position});return n.current.props=e,(0,r.useImperativeHandle)(t,(function(){return o}),[]),(0,r.useEffect)((function(){j(o._container,e.style)}),[e.style]),null}const D=(0,r.memo)((0,r.forwardRef)(N));function F(e){var t=I((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,r.useEffect)((function(){j(t._container,e.style)}),[e.style]),null}const U=(0,r.memo)(F);function B(e){var t=I((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),n=(0,r.useRef)(e),o=n.current;n.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,r.useEffect)((function(){j(t._container,a)}),[a]),null}const H=(0,r.memo)(B);function W(e,t){if(!e)throw new Error(t)}var G=0;const J=function(e){var t=(0,r.useContext)(C).map.getMap(),n=(0,r.useRef)(e),o=(0,r.useState)(0)[1],a=(0,r.useMemo)((function(){return e.id||"jsx-layer-"+G++}),[]);if((0,r.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,n,r){if(W(n.id===r.id,"layer id changed"),W(n.type===r.type,"layer type changed"),"custom"!==n.type&&"custom"!==r.type){var o=n.layout,a=void 0===o?{}:o,s=n.paint,u=void 0===s?{}:s,l=n.filter,c=n.minzoom,f=n.maxzoom,p=n.beforeId;if(p!==r.beforeId&&e.moveLayer(t,p),a!==r.layout){var d=r.layout||{};for(var m in a)i(a[m],d[m])||e.setLayoutProperty(t,m,a[m]);for(var v in d)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==r.paint){var g=r.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(l,r.filter)||e.setFilter(t,l),c===r.minzoom&&f===r.maxzoom||e.setLayerZoomRange(t,c,f)}}(t,a,e,n.current)}catch(s){console.warn(s)}else!function(e,t,n){if(e.style&&e.style._loaded&&(!("source"in n)||e.getSource(n.source))){var r=Object.assign({},n,{id:t});delete r.beforeId,e.addLayer(r,n.beforeId)}}(t,a,e);return n.current=e,null};var V=0;const q=function(e){var t=(0,r.useContext)(C).map.getMap(),n=(0,r.useRef)(e),o=(0,r.useState)(0)[1],a=(0,r.useMemo)((function(){return e.id||"jsx-source-"+V++}),[]);(0,r.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var n,r=null==(n=t.getStyle())?void 0:n.layers;if(r)for(var o,i=(0,c.Z)(r);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,n){W(t.id===n.id,"source id changed"),W(t.type===n.type,"source type changed");var r="",o=0;for(var a in t)"children"===a||"id"===a||i(n[a],t[a])||(r=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===r)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(r){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+r)}}(s,e,n.current):s=function(e,t,n){if(e.style&&e.style._loaded){var r=Object.assign({},n);return delete r.id,delete r.children,e.addSource(t,r),e.getSource(t)}return null}(t,a,e),n.current=e,s&&r.Children.map(e.children,(function(e){return e&&(0,r.cloneElement)(e,{source:a})}))||null};var Q=n.e(8539).then(n.t.bind(n,8539,23)),X=r.forwardRef((function(e,t){return w(e,t,Q)})),Y=k,K=z,$=Z,ee=U,te=D,ne=H,re=J,oe=q;const ae=X}}]); \ No newline at end of file diff --git a/assets/js/3a4d92a3.6216717c.js b/assets/js/3a4d92a3.6216717c.js new file mode 100644 index 00000000..9c824f00 --- /dev/null +++ b/assets/js/3a4d92a3.6216717c.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkreact_map_gl_website=self.webpackChunkreact_map_gl_website||[]).push([[1341],{5700:(e,t,r)=>{r.r(t),r.d(t,{assets:()=>_,contentTitle:()=>h,default:()=>S,frontMatter:()=>g,metadata:()=>y,toc:()=>b});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945));function u(e){var t=e.year;return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Interactive GeoJSON"),a.createElement("p",null,"Map showing median household income by state in year ",a.createElement("b",null,t),". Hover over a state to see details."),a.createElement("p",null,"Data source: ",a.createElement("a",{href:"www.census.gov"},"US Census Bureau")),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/geojson",target:"_new"},"View Code \u2197")),a.createElement("hr",null),a.createElement("div",{key:"year",className:"input"},a.createElement("label",null,"Year"),a.createElement("input",{type:"range",value:t,min:1995,max:2015,step:1,onChange:function(t){return e.onChange(t.target.value)}})))}const l=a.memo(u);var c={id:"data",type:"fill",paint:{"fill-color":{property:"percentile",stops:[[0,"#3288bd"],[1,"#66c2a5"],[2,"#abdda4"],[3,"#e6f598"],[4,"#ffffbf"],[5,"#fee08b"],[6,"#fdae61"],[7,"#f46d43"],[8,"#d53e4f"]]},"fill-opacity":.8}},f=r(685),p=r(5256);var d="";function m(){var e=(0,a.useState)(2015),t=e[0],r=e[1],n=(0,a.useState)(null),o=n[0],i=n[1],u=(0,a.useState)(null),m=u[0],v=u[1];(0,a.useEffect)((function(){fetch("https://raw.githubusercontent.com/uber/react-map-gl/master/examples/.data/us-income.geojson").then((function(e){return e.json()})).then((function(e){return i(e)})).catch((function(e){return console.error("Could not load data",e)}))}),[]);var g=(0,a.useCallback)((function(e){var t=e.features,r=e.point,n=r.x,o=r.y,a=t&&t[0];v(a&&{feature:a,x:n,y:o})}),[]),h=(0,a.useMemo)((function(){return o&&(e=function(e){return e.properties.income[t]},r=o.features,n=(0,p.FT)().domain(r.map(e)).range((0,f.w6)(9)),{type:"FeatureCollection",features:r.map((function(t){var r=e(t),o=Object.assign({},t.properties,{value:r,percentile:n(r)});return Object.assign({},t,{properties:o})}))});var e,r,n}),[o,t]);return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:{latitude:40,longitude:-100,zoom:3},mapStyle:"mapbox://styles/mapbox/light-v9",mapboxAccessToken:d,interactiveLayerIds:["data"],onMouseMove:g},a.createElement(s.Hw,{type:"geojson",data:h},a.createElement(s.mh,c)),m&&a.createElement("div",{className:"tooltip",style:{left:m.x,top:m.y}},a.createElement("div",null,"State: ",m.feature.properties.name),a.createElement("div",null,"Median Household Income: ",m.feature.properties.value),a.createElement("div",null,"Percentile: ",m.feature.properties.percentile/8*100))),a.createElement(l,{year:t,onChange:function(e){return r(e)}}))}var v=["components"],g={},h="GeoJSON",y={unversionedId:"geojson",id:"geojson",title:"GeoJSON",description:"",source:"@site/src/examples/geojson.mdx",sourceDirName:".",slug:"/geojson",permalink:"/react-map-gl/examples/geojson",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Draggable Marker",permalink:"/react-map-gl/examples/draggable-markers"},next:{title:"GeoJSON Animation",permalink:"/react-map-gl/examples/geojson-animation"}},_={},b=[],E={toc:b},x="wrapper";function S(e){var t=e.components,r=(0,o.Z)(e,v);return(0,i.kt)(x,(0,n.Z)({},E,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"geojson"},"GeoJSON"),(0,i.kt)(m,{mdxType:"App"}))}S.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>Y,Pv:()=>ee,GI:()=>K,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>I});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?d:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||b()||null,container:e,style:p(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var l=new this._MapClass(a);i.padding&&l.setPadding(i.padding),r.cursor&&(l.getCanvas().style.cursor=r.cursor),this._createShadowTransform(l);var c=l._render;l._render=function(e){t._inRender=!0,c.call(l,e),t._inRender=!1};var f=l._renderTaskQueue.run;l._renderTaskQueue.run=function(e){f.call(l._renderTaskQueue,e),t._onBeforeRepaint()},l.on("render",(function(){return t._onAfterRepaint()}));var h=l.fire;for(var y in l.fire=this._fireEvent.bind(this,h),l.on("resize",(function(){t._renderTransform.resize(l.transform.width,l.transform.height)})),l.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(l.transform,t._renderTransform)})),l.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)l.on(y,this._onPointerEvent);for(var _ in v)l.on(_,this._onCameraEvent);for(var E in g)l.on(E,this._onEvent);this._map=l},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var c=l(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),c&&t){var f=this._deferredEvents;f.move=!0,f.zoom||(f.zoom=o!==n.zoom),f.rotate||(f.rotate=i!==n.bearing),f.pitch||(f.pitch=a!==n.pitch)}return s||l(r.transform,e),c},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function b(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}_.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function x(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a},queryRenderedFeatures:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryRenderedFeatures(t,n);return r.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,c.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const S="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var L=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var C=n.createContext(null);function w(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],l=(0,n.useRef)(),f=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,c.Z)(L);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=_.reuse(e,l.current)),t||(t=new _(n.Map,e,l.current)),f.map=x(t),f.mapLib=n,u(t),null==a||a.onMapMount(f.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),S((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return f.map}),[s]);var p=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:l,style:p},s&&n.createElement(C.Provider,{value:f},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var M=r(3935),P=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function j(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!P.test(n)?r[n]=o+"px":r[n]=o}}}function T(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,l,c,f,p,d,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,_=void 0!==y&&y,b=e.popup,E=void 0===b?null:b,x=e.rotation,S=void 0===x?0:x,L=e.rotationAlignment,w=void 0===L?"auto":L,P=e.pitchAlignment,T=void 0===P?"auto":P;return(0,n.useEffect)((function(){j(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),l=g,c=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,p=Array.isArray(l)?l[0]:l?l.x:0,d=Array.isArray(l)?l[1]:l?l.y:0,c!==p||f!==d)&&s.setOffset(g),s.isDraggable()!==_&&s.setDraggable(_),s.getRotation()!==S&&s.setRotation(S),s.getRotationAlignment()!==w&&s.setRotationAlignment(w),s.getPitchAlignment()!==T&&s.setPitchAlignment(T),s.getPopup()!==E&&s.setPopup(E),(0,M.createPortal)(e.children,s.getElement())}const R=(0,n.memo)((0,n.forwardRef)(T));function k(e){return new Set(e?e.trim().split(/\s+/):[])}function O(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var l=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return l.on("close",e),l.setDOMContent(s).addTo(o.getMap()),function(){l.off("close",e),l.isOpen()&&l.remove()}}),[]),(0,n.useEffect)((function(){j(l.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return l}),[]),l.isOpen()&&(l.getLngLat().lng===e.longitude&&l.getLngLat().lat===e.latitude||l.setLngLat([e.longitude,e.latitude]),e.offset&&!i(l.options.offset,e.offset)&&l.setOffset(e.offset),l.options.anchor===e.anchor&&l.options.maxWidth===e.maxWidth||(l.options.anchor=e.anchor,l.setMaxWidth(e.maxWidth)),l.options.className!==e.className)){for(var f,p=k(l.options.className),d=k(e.className),m=(0,c.Z)(p);!(f=m()).done;){var v=f.value;d.has(v)||l.removeClassName(v)}for(var g,h=(0,c.Z)(d);!(g=h()).done;){var y=g.value;p.has(y)||l.addClassName(y)}l.options.className=e.className}return(0,M.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(O));const I=function(e,t,r,o){var a=(0,n.useContext)(C),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function A(e){var t=I((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){j(t._controlContainer,e.style)}),[e.style]),null}const Z=(0,n.memo)(A);function N(e,t){var r=(0,n.useRef)({props:e}),o=I((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){j(o._container,e.style)}),[e.style]),null}const F=(0,n.memo)((0,n.forwardRef)(N));function D(e){var t=I((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){j(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(D);function B(e){var t=I((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){j(t._container,a)}),[a]),null}const H=(0,n.memo)(B);function W(e,t){if(!e)throw new Error(t)}var G=0;const q=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+G++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(W(r.id===n.id,"layer id changed"),W(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,l=r.filter,c=r.minzoom,f=r.maxzoom,p=r.beforeId;if(p!==n.beforeId&&e.moveLayer(t,p),a!==n.layout){var d=n.layout||{};for(var m in a)i(a[m],d[m])||e.setLayoutProperty(t,m,a[m]);for(var v in d)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(l,n.filter)||e.setFilter(t,l),c===n.minzoom&&f===n.maxzoom||e.setLayerZoomRange(t,c,f)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var J=0;const V=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+J++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,c.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){W(t.id===r.id,"source id changed"),W(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return w(e,t,Q)})),Y=R,K=z,$=Z,ee=U,te=F,re=H,ne=q,oe=V;const ae=X}}]); \ No newline at end of file diff --git a/assets/js/5990ff10.3c22b4c2.js b/assets/js/5990ff10.3c22b4c2.js deleted file mode 100644 index dfe38cce..00000000 --- a/assets/js/5990ff10.3c22b4c2.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkreact_map_gl_website=self.webpackChunkreact_map_gl_website||[]).push([[2344],{3905:(e,t,n)=>{n.d(t,{Zo:()=>c,kt:()=>f});var r=n(7294);function o(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function a(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function i(e){for(var t=1;t=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var u=r.createContext({}),l=function(e){var t=r.useContext(u),n=t;return e&&(n="function"==typeof e?e(t):i(i({},t),e)),n},c=function(e){var t=l(e.components);return r.createElement(u.Provider,{value:t},e.children)},p="mdxType",d={inlineCode:"code",wrapper:function(e){var t=e.children;return r.createElement(r.Fragment,{},t)}},m=r.forwardRef((function(e,t){var n=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,c=s(e,["components","mdxType","originalType","parentName"]),p=l(n),m=o,f=p["".concat(u,".").concat(m)]||p[m]||d[m]||a;return n?r.createElement(f,i(i({ref:t},c),{},{components:n})):r.createElement(f,i({ref:t},c))}));function f(e,t){var n=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=n.length,i=new Array(a);i[0]=m;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[p]="string"==typeof e?e:o,i[1]=s;for(var l=2;l{n.r(t),n.d(t,{assets:()=>y,contentTitle:()=>v,default:()=>x,frontMatter:()=>g,metadata:()=>h,toc:()=>_});var r=n(7462),o=n(3366),a=n(7294),i=n(3905),s=(n(745),n(945)),u=n(7971);function l(e){return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Camera Transition"),a.createElement("p",null,"Smooth animate of the viewport."),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/viewport-animation",target:"_new"},"View Code \u2197")),a.createElement("hr",null),u.filter((function(e){return"California"===e.state})).map((function(t,n){return a.createElement("div",{key:"btn-"+n,className:"input"},a.createElement("input",{type:"radio",name:"city",id:"city-"+n,defaultChecked:"San Francisco"===t.city,onClick:function(){return e.onSelectCity(t)}}),a.createElement("label",{htmlFor:"city-"+n},t.city))})))}const c=a.memo(l);var p="",d={latitude:37.7751,longitude:-122.4193,zoom:11,bearing:0,pitch:0};function m(){var e=(0,a.useRef)(),t=(0,a.useCallback)((function(t){var n,r=t.longitude,o=t.latitude;null==(n=e.current)||n.flyTo({center:[r,o],duration:2e3})}),[]);return a.createElement(a.Fragment,null,a.createElement(s.ZP,{ref:e,initialViewState:d,mapStyle:"mapbox://styles/mapbox/light-v9",mapboxAccessToken:p}),a.createElement(c,{onSelectCity:t}))}var f=["components"],g={},v="Camera Transition",h={unversionedId:"viewport-animation",id:"viewport-animation",title:"Camera Transition",description:"",source:"@site/src/examples/viewport-animation.mdx",sourceDirName:".",slug:"/viewport-animation",permalink:"/react-map-gl/examples/viewport-animation",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Limit Map Interaction",permalink:"/react-map-gl/examples/interaction"},next:{title:"Highlight By Filter",permalink:"/react-map-gl/examples/filter"}},y={},_=[],b={toc:_},w="wrapper";function x(e){var t=e.components,n=(0,o.Z)(e,f);return(0,i.kt)(w,(0,r.Z)({},b,n,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"camera-transition"},"Camera Transition"),(0,i.kt)(m,{mdxType:"App"}))}x.isMDXComponent=!0},945:(e,t,n)=>{n.d(t,{ot:()=>$,$j:()=>te,mh:()=>re,D5:()=>X,Jx:()=>Y,Pv:()=>ee,GI:()=>K,jf:()=>ne,Hw:()=>oe,ZP:()=>ae,PE:()=>D});var r=n(7294),o=r.createContext(null);var a=n(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var n=0;n0;)n.appendChild(a.childNodes[0]);o._container=n;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(n)),r.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):r._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),r},t._initialize=function(e){var t=this,n=this.props,r=n.mapStyle,o=void 0===r?m:r,a=Object.assign({},n,n.initialViewState,{accessToken:n.mapboxAccessToken||b()||null,container:e,style:d(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),n.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,n.gl}}var l=new this._MapClass(a);i.padding&&l.setPadding(i.padding),n.cursor&&(l.getCanvas().style.cursor=n.cursor),this._createShadowTransform(l);var c=l._render;l._render=function(e){t._inRender=!0,c.call(l,e),t._inRender=!1};var p=l._renderTaskQueue.run;l._renderTaskQueue.run=function(e){p.call(l._renderTaskQueue,e),t._onBeforeRepaint()},l.on("render",(function(){return t._onAfterRepaint()}));var h=l.fire;for(var y in l.fire=this._fireEvent.bind(this,h),l.on("resize",(function(){t._renderTransform.resize(l.transform.width,l.transform.height)})),l.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(l.transform,t._renderTransform)})),l.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),f)l.on(y,this._onPointerEvent);for(var _ in g)l.on(_,this._onCameraEvent);for(var w in v)l.on(w,this._onEvent);this._map=l},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,n,r=(t=e.transform,(n=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,n);e.painter.transform=r,this._renderTransform=r},t._updateSize=function(e){var t=e.viewState;if(t){var n=this._map;if(t.width!==n.transform.width||t.height!==n.transform.height)return n.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var n=this._map,r=this._renderTransform,o=r.zoom,a=r.pitch,i=r.bearing,s=n.isMoving();s&&(r.cameraElevationReference="sea");var c=l(r,Object.assign({},u(n.transform),e));if(s&&(r.cameraElevationReference="ground"),c&&t){var p=this._deferredEvents;p.move=!0,p.zoom||(p.zoom=o!==r.zoom),p.rotate||(p.rotate=i!==r.bearing),p.pitch||(p.pitch=a!==r.pitch)}return s||l(n.transform,e),c},t._updateSettings=function(e,t){for(var n=this._map,r=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=r}else this._hoveredFeatures=null},t._fireEvent=function(e,t,n){var r=this._map,o=r.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in g&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(r.transform=this._renderTransform,e.call(r,t,n),r.transform=o,r):(e.call(r,t,n),r)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var n in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[n]&&t.fire(n);this._internalUpdate=!1;var r=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,r),t.transform=r}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function b(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(n){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(r){}return e}_.savedMaps=[];var w=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function x(e){if(!e)return null;for(var t,n=e.map,r={getMap:function(){return n},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var r=n.transform;n.transform=e.transform;var o=n.project(t);return n.transform=r,o},unproject:function(t){var r=n.transform;n.transform=e.transform;var o=n.unproject(t);return n.transform=r,o},queryTerrainElevation:function(t,r){var o=n.transform;n.transform=e.transform;var a=n.queryTerrainElevation(t,r);return n.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,n=e;for(;n;){for(var r,o=(0,c.Z)(Object.getOwnPropertyNames(n));!(r=o()).done;){var a=r.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}n=Object.getPrototypeOf(n)}return Array.from(t)}(n));!(t=o()).done;){var a=t.value;a in r||w.includes(a)||(r[a]=n[a].bind(n))}return r}const k="undefined"!=typeof document?r.useLayoutEffect:r.useEffect;var S=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var C=r.createContext(null);function E(e,t,n){var a=(0,r.useContext)(o),i=(0,r.useState)(null),s=i[0],u=i[1],l=(0,r.useRef)(),p=(0,r.useRef)({mapLib:null,map:null}).current;(0,r.useEffect)((function(){var t,r=e.mapLib,o=!0;return Promise.resolve(r||n).then((function(n){if(o){if(!n)throw new Error("Invalid mapLib");var r="Map"in n?n:n.default;if(!r.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var n,r=(0,c.Z)(S);!(n=r()).done;){var o=n.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(r,e),r.supported&&!r.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=_.reuse(e,l.current)),t||(t=new _(r.Map,e,l.current)),p.map=x(t),p.mapLib=r,u(t),null==a||a.onMapMount(p.map,e.id)}})).catch((function(t){var n=e.onError;n?n({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),k((function(){s&&s.setProps(e)})),(0,r.useImperativeHandle)(t,(function(){return p.map}),[s]);var d=(0,r.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return r.createElement("div",{id:e.id,ref:l,style:d},s&&r.createElement(C.Provider,{value:p},r.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var P=n(3935),j=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function L(e,t){if(e&&t){var n=e.style;for(var r in t){var o=t[r];Number.isFinite(o)&&!j.test(r)?n[r]=o+"px":n[r]=o}}}function T(e,t){var n=(0,r.useContext)(C),o=n.map,a=n.mapLib,i=(0,r.useRef)({props:e});i.current.props=e;var s=(0,r.useMemo)((function(){var t=!1;r.Children.forEach(e.children,(function(e){e&&(t=!0)}));var n=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(n);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,r.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,l,c,p,d,m,f=e.longitude,g=e.latitude,v=e.offset,h=e.style,y=e.draggable,_=void 0!==y&&y,b=e.popup,w=void 0===b?null:b,x=e.rotation,k=void 0===x?0:x,S=e.rotationAlignment,E=void 0===S?"auto":S,j=e.pitchAlignment,T=void 0===j?"auto":j;return(0,r.useEffect)((function(){L(s.getElement(),h)}),[h]),(0,r.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===f&&s.getLngLat().lat===g||s.setLngLat([f,g]),v&&(u=s.getOffset(),l=v,c=Array.isArray(u)?u[0]:u?u.x:0,p=Array.isArray(u)?u[1]:u?u.y:0,d=Array.isArray(l)?l[0]:l?l.x:0,m=Array.isArray(l)?l[1]:l?l.y:0,c!==d||p!==m)&&s.setOffset(v),s.isDraggable()!==_&&s.setDraggable(_),s.getRotation()!==k&&s.setRotation(k),s.getRotationAlignment()!==E&&s.setRotationAlignment(E),s.getPitchAlignment()!==T&&s.setPitchAlignment(T),s.getPopup()!==w&&s.setPopup(w),(0,P.createPortal)(e.children,s.getElement())}const O=(0,r.memo)((0,r.forwardRef)(T));function M(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var n=(0,r.useContext)(C),o=n.map,a=n.mapLib,s=(0,r.useMemo)((function(){return document.createElement("div")}),[]),u=(0,r.useRef)({props:e});u.current.props=e;var l=(0,r.useMemo)((function(){var t=Object.assign({},e),n=new a.Popup(t);return n.setLngLat([e.longitude,e.latitude]),n.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),n}),[]);if((0,r.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return l.on("close",e),l.setDOMContent(s).addTo(o.getMap()),function(){l.off("close",e),l.isOpen()&&l.remove()}}),[]),(0,r.useEffect)((function(){L(l.getElement(),e.style)}),[e.style]),(0,r.useImperativeHandle)(t,(function(){return l}),[]),l.isOpen()&&(l.getLngLat().lng===e.longitude&&l.getLngLat().lat===e.latitude||l.setLngLat([e.longitude,e.latitude]),e.offset&&!i(l.options.offset,e.offset)&&l.setOffset(e.offset),l.options.anchor===e.anchor&&l.options.maxWidth===e.maxWidth||(l.options.anchor=e.anchor,l.setMaxWidth(e.maxWidth)),l.options.className!==e.className)){for(var p,d=M(l.options.className),m=M(e.className),f=(0,c.Z)(d);!(p=f()).done;){var g=p.value;m.has(g)||l.removeClassName(g)}for(var v,h=(0,c.Z)(m);!(v=h()).done;){var y=v.value;d.has(y)||l.addClassName(y)}l.options.className=e.className}return(0,P.createPortal)(e.children,s)}const A=(0,r.memo)((0,r.forwardRef)(R));const D=function(e,t,n,o){var a=(0,r.useContext)(C),i=(0,r.useMemo)((function(){return e(a)}),[]);return(0,r.useEffect)((function(){var e=o||n||t,r="function"==typeof t&&"function"==typeof n?t:null,s="function"==typeof n?n:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),r&&r(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function z(e){var t=D((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,r.useEffect)((function(){L(t._controlContainer,e.style)}),[e.style]),null}const N=(0,r.memo)(z);function I(e,t){var n=(0,r.useRef)({props:e}),o=D((function(t){var r=new t.mapLib.GeolocateControl(e),o=r._setupUI;return r._setupUI=function(e){r._container.hasChildNodes()||o(e)},r.on("geolocate",(function(e){null==n.current.props.onGeolocate||n.current.props.onGeolocate(e)})),r.on("error",(function(e){null==n.current.props.onError||n.current.props.onError(e)})),r.on("outofmaxbounds",(function(e){null==n.current.props.onOutOfMaxBounds||n.current.props.onOutOfMaxBounds(e)})),r.on("trackuserlocationstart",(function(e){null==n.current.props.onTrackUserLocationStart||n.current.props.onTrackUserLocationStart(e)})),r.on("trackuserlocationend",(function(e){null==n.current.props.onTrackUserLocationEnd||n.current.props.onTrackUserLocationEnd(e)})),r}),{position:e.position});return n.current.props=e,(0,r.useImperativeHandle)(t,(function(){return o}),[]),(0,r.useEffect)((function(){L(o._container,e.style)}),[e.style]),null}const Z=(0,r.memo)((0,r.forwardRef)(I));function F(e){var t=D((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,r.useEffect)((function(){L(t._container,e.style)}),[e.style]),null}const U=(0,r.memo)(F);function W(e){var t=D((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),n=(0,r.useRef)(e),o=n.current;n.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,r.useEffect)((function(){L(t._container,a)}),[a]),null}const J=(0,r.memo)(W);function G(e,t){if(!e)throw new Error(t)}var H=0;const B=function(e){var t=(0,r.useContext)(C).map.getMap(),n=(0,r.useRef)(e),o=(0,r.useState)(0)[1],a=(0,r.useMemo)((function(){return e.id||"jsx-layer-"+H++}),[]);if((0,r.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,n,r){if(G(n.id===r.id,"layer id changed"),G(n.type===r.type,"layer type changed"),"custom"!==n.type&&"custom"!==r.type){var o=n.layout,a=void 0===o?{}:o,s=n.paint,u=void 0===s?{}:s,l=n.filter,c=n.minzoom,p=n.maxzoom,d=n.beforeId;if(d!==r.beforeId&&e.moveLayer(t,d),a!==r.layout){var m=r.layout||{};for(var f in a)i(a[f],m[f])||e.setLayoutProperty(t,f,a[f]);for(var g in m)a.hasOwnProperty(g)||e.setLayoutProperty(t,g,void 0)}if(u!==r.paint){var v=r.paint||{};for(var h in u)i(u[h],v[h])||e.setPaintProperty(t,h,u[h]);for(var y in v)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(l,r.filter)||e.setFilter(t,l),c===r.minzoom&&p===r.maxzoom||e.setLayerZoomRange(t,c,p)}}(t,a,e,n.current)}catch(s){console.warn(s)}else!function(e,t,n){if(e.style&&e.style._loaded&&(!("source"in n)||e.getSource(n.source))){var r=Object.assign({},n,{id:t});delete r.beforeId,e.addLayer(r,n.beforeId)}}(t,a,e);return n.current=e,null};var V=0;const q=function(e){var t=(0,r.useContext)(C).map.getMap(),n=(0,r.useRef)(e),o=(0,r.useState)(0)[1],a=(0,r.useMemo)((function(){return e.id||"jsx-source-"+V++}),[]);(0,r.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var n,r=null==(n=t.getStyle())?void 0:n.layers;if(r)for(var o,i=(0,c.Z)(r);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,n){G(t.id===n.id,"source id changed"),G(t.type===n.type,"source type changed");var r="",o=0;for(var a in t)"children"===a||"id"===a||i(n[a],t[a])||(r=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===r)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(r){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+r)}}(s,e,n.current):s=function(e,t,n){if(e.style&&e.style._loaded){var r=Object.assign({},n);return delete r.id,delete r.children,e.addSource(t,r),e.getSource(t)}return null}(t,a,e),n.current=e,s&&r.Children.map(e.children,(function(e){return e&&(0,r.cloneElement)(e,{source:a})}))||null};var Q=n.e(8539).then(n.t.bind(n,8539,23)),X=r.forwardRef((function(e,t){return E(e,t,Q)})),Y=O,K=A,$=N,ee=U,te=Z,ne=J,re=B,oe=q;const ae=X},745:(e,t,n)=>{var r=n(3935);r.createRoot,r.hydrateRoot},1202:(e,t,n)=>{n.d(t,{Z:()=>i});var r=n(1002);function o(e){var t=function(e,t){if("object"!==(0,r.Z)(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t||"default");if("object"!==(0,r.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,r.Z)(t)?t:String(t)}function a(e,t){for(var n=0;n{e.exports=JSON.parse('[{"city":"New York","population":"8,175,133","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/b/b9/Above_Gotham.jpg/240px-Above_Gotham.jpg","state":"New York","latitude":40.6643,"longitude":-73.9385},{"city":"Los Angeles","population":"3,792,621","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/5/57/LA_Skyline_Mountains2.jpg/240px-LA_Skyline_Mountains2.jpg","state":"California","latitude":34.0194,"longitude":-118.4108},{"city":"Chicago","population":"2,695,598","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/8/85/2008-06-10_3000x1000_chicago_skyline.jpg/240px-2008-06-10_3000x1000_chicago_skyline.jpg","state":"Illinois","latitude":41.8376,"longitude":-87.6818},{"city":"Houston","population":"2,100,263","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/6/60/Aerial_views_of_the_Houston%2C_Texas%2C_28005u.jpg/240px-Aerial_views_of_the_Houston%2C_Texas%2C_28005u.jpg","state":"Texas","latitude":29.7805,"longitude":-95.3863},{"city":"Phoenix","population":"1,445,632","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/b/b9/Downtown_Phoenix_Aerial_Looking_Northeast.jpg/207px-Downtown_Phoenix_Aerial_Looking_Northeast.jpg","state":"Arizona","latitude":33.5722,"longitude":-112.088},{"city":"Philadelphia","population":"1,526,006","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/4/4d/Philly_skyline.jpg/240px-Philly_skyline.jpg","state":"Pennsylvania","latitude":40.0094,"longitude":-75.1333},{"city":"San Antonio","population":"1,327,407","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/f/ff/Downtown_San_Antonio_View.JPG/240px-Downtown_San_Antonio_View.JPG","state":"Texas","latitude":29.4724,"longitude":-98.5251},{"city":"San Diego","population":"1,307,402","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/5/53/US_Navy_110604-N-NS602-574_Navy_and_Marine_Corps_personnel%2C_along_with_community_leaders_from_the_greater_San_Diego_area_come_together_to_commemora.jpg/240px-US_Navy_110604-N-NS602-574_Navy_and_Marine_Corps_personnel%2C_along_with_community_leaders_from_the_greater_San_Diego_area_come_together_to_commemora.jpg","state":"California","latitude":32.8153,"longitude":-117.135},{"city":"Dallas","population":"1,197,816","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/a/ab/Dallas_skyline_daytime.jpg/240px-Dallas_skyline_daytime.jpg","state":"Texas","latitude":32.7757,"longitude":-96.7967},{"city":"San Jose","population":"945,942","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/1/1e/Downtown_San_Jose_skyline.PNG/240px-Downtown_San_Jose_skyline.PNG","state":"California","latitude":37.2969,"longitude":-121.8193},{"city":"Austin","population":"790,390","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/9/97/Austin2012-12-01.JPG/240px-Austin2012-12-01.JPG","state":"Texas","latitude":30.3072,"longitude":-97.756},{"city":"Jacksonville","population":"821,784","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/f/f3/Skyline_of_Jacksonville_FL%2C_South_view_20160706_1.jpg/240px-Skyline_of_Jacksonville_FL%2C_South_view_20160706_1.jpg","state":"Florida","latitude":30.337,"longitude":-81.6613},{"city":"San Francisco","population":"805,235","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/6/6a/San_Francisco_skyline_from_Coit_Tower.jpg/240px-San_Francisco_skyline_from_Coit_Tower.jpg","state":"California","latitude":37.7751,"longitude":-122.4193},{"city":"Columbus","population":"787,033","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/f/fc/Columbus-ohio-skyline-panorama.jpg/240px-Columbus-ohio-skyline-panorama.jpg","state":"Ohio","latitude":39.9848,"longitude":-82.985},{"city":"Indianapolis","population":"820,445","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/1/16/Downtown_indy_from_parking_garage_zoom.JPG/213px-Downtown_indy_from_parking_garage_zoom.JPG","state":"Indiana","latitude":39.7767,"longitude":-86.1459},{"city":"Fort Worth","population":"741,206","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/d/db/FortWorthTexasSkylineW.jpg/240px-FortWorthTexasSkylineW.jpg","state":"Texas","latitude":32.7795,"longitude":-97.3463},{"city":"Charlotte","population":"731,424","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/7/7d/Charlotte_skyline45647.jpg/222px-Charlotte_skyline45647.jpg","state":"North Carolina","latitude":35.2087,"longitude":-80.8307},{"city":"Seattle","population":"608,660","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/3/36/SeattleI5Skyline.jpg/240px-SeattleI5Skyline.jpg","state":"Washington","latitude":47.6205,"longitude":-122.3509},{"city":"Denver","population":"600,158","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/0/0b/DenverCP.JPG/240px-DenverCP.JPG","state":"Colorado","latitude":39.7618,"longitude":-104.8806},{"city":"El Paso","population":"649,121","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/6/6d/Downtown_El_Paso_at_sunset.jpeg/240px-Downtown_El_Paso_at_sunset.jpeg","state":"Texas","latitude":31.8484,"longitude":-106.427}]')}}]); \ No newline at end of file diff --git a/assets/js/5990ff10.a9a33e03.js b/assets/js/5990ff10.a9a33e03.js new file mode 100644 index 00000000..97088e7c --- /dev/null +++ b/assets/js/5990ff10.a9a33e03.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkreact_map_gl_website=self.webpackChunkreact_map_gl_website||[]).push([[2344],{3905:(e,t,n)=>{n.d(t,{Zo:()=>c,kt:()=>f});var r=n(7294);function o(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function a(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function i(e){for(var t=1;t=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(r=0;r=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var u=r.createContext({}),l=function(e){var t=r.useContext(u),n=t;return e&&(n="function"==typeof e?e(t):i(i({},t),e)),n},c=function(e){var t=l(e.components);return r.createElement(u.Provider,{value:t},e.children)},p="mdxType",d={inlineCode:"code",wrapper:function(e){var t=e.children;return r.createElement(r.Fragment,{},t)}},m=r.forwardRef((function(e,t){var n=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,c=s(e,["components","mdxType","originalType","parentName"]),p=l(n),m=o,f=p["".concat(u,".").concat(m)]||p[m]||d[m]||a;return n?r.createElement(f,i(i({ref:t},c),{},{components:n})):r.createElement(f,i({ref:t},c))}));function f(e,t){var n=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=n.length,i=new Array(a);i[0]=m;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[p]="string"==typeof e?e:o,i[1]=s;for(var l=2;l{n.r(t),n.d(t,{assets:()=>y,contentTitle:()=>v,default:()=>x,frontMatter:()=>g,metadata:()=>h,toc:()=>_});var r=n(7462),o=n(3366),a=n(7294),i=n(3905),s=(n(745),n(945)),u=n(7971);function l(e){return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Camera Transition"),a.createElement("p",null,"Smooth animate of the viewport."),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/viewport-animation",target:"_new"},"View Code \u2197")),a.createElement("hr",null),u.filter((function(e){return"California"===e.state})).map((function(t,n){return a.createElement("div",{key:"btn-"+n,className:"input"},a.createElement("input",{type:"radio",name:"city",id:"city-"+n,defaultChecked:"San Francisco"===t.city,onClick:function(){return e.onSelectCity(t)}}),a.createElement("label",{htmlFor:"city-"+n},t.city))})))}const c=a.memo(l);var p="",d={latitude:37.7751,longitude:-122.4193,zoom:11,bearing:0,pitch:0};function m(){var e=(0,a.useRef)(),t=(0,a.useCallback)((function(t){var n,r=t.longitude,o=t.latitude;null==(n=e.current)||n.flyTo({center:[r,o],duration:2e3})}),[]);return a.createElement(a.Fragment,null,a.createElement(s.ZP,{ref:e,initialViewState:d,mapStyle:"mapbox://styles/mapbox/light-v9",mapboxAccessToken:p}),a.createElement(c,{onSelectCity:t}))}var f=["components"],g={},v="Camera Transition",h={unversionedId:"viewport-animation",id:"viewport-animation",title:"Camera Transition",description:"",source:"@site/src/examples/viewport-animation.mdx",sourceDirName:".",slug:"/viewport-animation",permalink:"/react-map-gl/examples/viewport-animation",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Limit Map Interaction",permalink:"/react-map-gl/examples/interaction"},next:{title:"Highlight By Filter",permalink:"/react-map-gl/examples/filter"}},y={},_=[],b={toc:_},w="wrapper";function x(e){var t=e.components,n=(0,o.Z)(e,f);return(0,i.kt)(w,(0,r.Z)({},b,n,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"camera-transition"},"Camera Transition"),(0,i.kt)(m,{mdxType:"App"}))}x.isMDXComponent=!0},945:(e,t,n)=>{n.d(t,{ot:()=>$,$j:()=>te,mh:()=>re,D5:()=>X,Jx:()=>Y,Pv:()=>ee,GI:()=>K,jf:()=>ne,Hw:()=>oe,ZP:()=>ae,PE:()=>D});var r=n(7294),o=r.createContext(null);var a=n(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var n=0;n0;)n.appendChild(a.childNodes[0]);o._container=n;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(n)),r.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):r._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),r},t._initialize=function(e){var t=this,n=this.props,r=n.mapStyle,o=void 0===r?m:r,a=Object.assign({},n,n.initialViewState,{accessToken:n.mapboxAccessToken||b()||null,container:e,style:d(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),n.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,n.gl}}var l=new this._MapClass(a);i.padding&&l.setPadding(i.padding),n.cursor&&(l.getCanvas().style.cursor=n.cursor),this._createShadowTransform(l);var c=l._render;l._render=function(e){t._inRender=!0,c.call(l,e),t._inRender=!1};var p=l._renderTaskQueue.run;l._renderTaskQueue.run=function(e){p.call(l._renderTaskQueue,e),t._onBeforeRepaint()},l.on("render",(function(){return t._onAfterRepaint()}));var h=l.fire;for(var y in l.fire=this._fireEvent.bind(this,h),l.on("resize",(function(){t._renderTransform.resize(l.transform.width,l.transform.height)})),l.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(l.transform,t._renderTransform)})),l.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),f)l.on(y,this._onPointerEvent);for(var _ in g)l.on(_,this._onCameraEvent);for(var w in v)l.on(w,this._onEvent);this._map=l},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,n,r=(t=e.transform,(n=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,n);e.painter.transform=r,this._renderTransform=r},t._updateSize=function(e){var t=e.viewState;if(t){var n=this._map;if(t.width!==n.transform.width||t.height!==n.transform.height)return n.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var n=this._map,r=this._renderTransform,o=r.zoom,a=r.pitch,i=r.bearing,s=n.isMoving();s&&(r.cameraElevationReference="sea");var c=l(r,Object.assign({},u(n.transform),e));if(s&&(r.cameraElevationReference="ground"),c&&t){var p=this._deferredEvents;p.move=!0,p.zoom||(p.zoom=o!==r.zoom),p.rotate||(p.rotate=i!==r.bearing),p.pitch||(p.pitch=a!==r.pitch)}return s||l(n.transform,e),c},t._updateSettings=function(e,t){for(var n=this._map,r=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=r}else this._hoveredFeatures=null},t._fireEvent=function(e,t,n){var r=this._map,o=r.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in g&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(r.transform=this._renderTransform,e.call(r,t,n),r.transform=o,r):(e.call(r,t,n),r)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var n in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[n]&&t.fire(n);this._internalUpdate=!1;var r=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,r),t.transform=r}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function b(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(n){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(r){}return e}_.savedMaps=[];var w=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function x(e){if(!e)return null;for(var t,n=e.map,r={getMap:function(){return n},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var r=n.transform;n.transform=e.transform;var o=n.project(t);return n.transform=r,o},unproject:function(t){var r=n.transform;n.transform=e.transform;var o=n.unproject(t);return n.transform=r,o},queryTerrainElevation:function(t,r){var o=n.transform;n.transform=e.transform;var a=n.queryTerrainElevation(t,r);return n.transform=o,a},queryRenderedFeatures:function(t,r){var o=n.transform;n.transform=e.transform;var a=n.queryRenderedFeatures(t,r);return n.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,n=e;for(;n;){for(var r,o=(0,c.Z)(Object.getOwnPropertyNames(n));!(r=o()).done;){var a=r.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}n=Object.getPrototypeOf(n)}return Array.from(t)}(n));!(t=o()).done;){var a=t.value;a in r||w.includes(a)||(r[a]=n[a].bind(n))}return r}const k="undefined"!=typeof document?r.useLayoutEffect:r.useEffect;var S=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var C=r.createContext(null);function E(e,t,n){var a=(0,r.useContext)(o),i=(0,r.useState)(null),s=i[0],u=i[1],l=(0,r.useRef)(),p=(0,r.useRef)({mapLib:null,map:null}).current;(0,r.useEffect)((function(){var t,r=e.mapLib,o=!0;return Promise.resolve(r||n).then((function(n){if(o){if(!n)throw new Error("Invalid mapLib");var r="Map"in n?n:n.default;if(!r.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var n,r=(0,c.Z)(S);!(n=r()).done;){var o=n.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(r,e),r.supported&&!r.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=_.reuse(e,l.current)),t||(t=new _(r.Map,e,l.current)),p.map=x(t),p.mapLib=r,u(t),null==a||a.onMapMount(p.map,e.id)}})).catch((function(t){var n=e.onError;n?n({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),k((function(){s&&s.setProps(e)})),(0,r.useImperativeHandle)(t,(function(){return p.map}),[s]);var d=(0,r.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return r.createElement("div",{id:e.id,ref:l,style:d},s&&r.createElement(C.Provider,{value:p},r.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var P=n(3935),j=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function L(e,t){if(e&&t){var n=e.style;for(var r in t){var o=t[r];Number.isFinite(o)&&!j.test(r)?n[r]=o+"px":n[r]=o}}}function T(e,t){var n=(0,r.useContext)(C),o=n.map,a=n.mapLib,i=(0,r.useRef)({props:e});i.current.props=e;var s=(0,r.useMemo)((function(){var t=!1;r.Children.forEach(e.children,(function(e){e&&(t=!0)}));var n=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(n);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,r.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,l,c,p,d,m,f=e.longitude,g=e.latitude,v=e.offset,h=e.style,y=e.draggable,_=void 0!==y&&y,b=e.popup,w=void 0===b?null:b,x=e.rotation,k=void 0===x?0:x,S=e.rotationAlignment,E=void 0===S?"auto":S,j=e.pitchAlignment,T=void 0===j?"auto":j;return(0,r.useEffect)((function(){L(s.getElement(),h)}),[h]),(0,r.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===f&&s.getLngLat().lat===g||s.setLngLat([f,g]),v&&(u=s.getOffset(),l=v,c=Array.isArray(u)?u[0]:u?u.x:0,p=Array.isArray(u)?u[1]:u?u.y:0,d=Array.isArray(l)?l[0]:l?l.x:0,m=Array.isArray(l)?l[1]:l?l.y:0,c!==d||p!==m)&&s.setOffset(v),s.isDraggable()!==_&&s.setDraggable(_),s.getRotation()!==k&&s.setRotation(k),s.getRotationAlignment()!==E&&s.setRotationAlignment(E),s.getPitchAlignment()!==T&&s.setPitchAlignment(T),s.getPopup()!==w&&s.setPopup(w),(0,P.createPortal)(e.children,s.getElement())}const O=(0,r.memo)((0,r.forwardRef)(T));function M(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var n=(0,r.useContext)(C),o=n.map,a=n.mapLib,s=(0,r.useMemo)((function(){return document.createElement("div")}),[]),u=(0,r.useRef)({props:e});u.current.props=e;var l=(0,r.useMemo)((function(){var t=Object.assign({},e),n=new a.Popup(t);return n.setLngLat([e.longitude,e.latitude]),n.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),n}),[]);if((0,r.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return l.on("close",e),l.setDOMContent(s).addTo(o.getMap()),function(){l.off("close",e),l.isOpen()&&l.remove()}}),[]),(0,r.useEffect)((function(){L(l.getElement(),e.style)}),[e.style]),(0,r.useImperativeHandle)(t,(function(){return l}),[]),l.isOpen()&&(l.getLngLat().lng===e.longitude&&l.getLngLat().lat===e.latitude||l.setLngLat([e.longitude,e.latitude]),e.offset&&!i(l.options.offset,e.offset)&&l.setOffset(e.offset),l.options.anchor===e.anchor&&l.options.maxWidth===e.maxWidth||(l.options.anchor=e.anchor,l.setMaxWidth(e.maxWidth)),l.options.className!==e.className)){for(var p,d=M(l.options.className),m=M(e.className),f=(0,c.Z)(d);!(p=f()).done;){var g=p.value;m.has(g)||l.removeClassName(g)}for(var v,h=(0,c.Z)(m);!(v=h()).done;){var y=v.value;d.has(y)||l.addClassName(y)}l.options.className=e.className}return(0,P.createPortal)(e.children,s)}const A=(0,r.memo)((0,r.forwardRef)(R));const D=function(e,t,n,o){var a=(0,r.useContext)(C),i=(0,r.useMemo)((function(){return e(a)}),[]);return(0,r.useEffect)((function(){var e=o||n||t,r="function"==typeof t&&"function"==typeof n?t:null,s="function"==typeof n?n:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),r&&r(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function z(e){var t=D((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,r.useEffect)((function(){L(t._controlContainer,e.style)}),[e.style]),null}const N=(0,r.memo)(z);function I(e,t){var n=(0,r.useRef)({props:e}),o=D((function(t){var r=new t.mapLib.GeolocateControl(e),o=r._setupUI;return r._setupUI=function(e){r._container.hasChildNodes()||o(e)},r.on("geolocate",(function(e){null==n.current.props.onGeolocate||n.current.props.onGeolocate(e)})),r.on("error",(function(e){null==n.current.props.onError||n.current.props.onError(e)})),r.on("outofmaxbounds",(function(e){null==n.current.props.onOutOfMaxBounds||n.current.props.onOutOfMaxBounds(e)})),r.on("trackuserlocationstart",(function(e){null==n.current.props.onTrackUserLocationStart||n.current.props.onTrackUserLocationStart(e)})),r.on("trackuserlocationend",(function(e){null==n.current.props.onTrackUserLocationEnd||n.current.props.onTrackUserLocationEnd(e)})),r}),{position:e.position});return n.current.props=e,(0,r.useImperativeHandle)(t,(function(){return o}),[]),(0,r.useEffect)((function(){L(o._container,e.style)}),[e.style]),null}const F=(0,r.memo)((0,r.forwardRef)(I));function Z(e){var t=D((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,r.useEffect)((function(){L(t._container,e.style)}),[e.style]),null}const U=(0,r.memo)(Z);function W(e){var t=D((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),n=(0,r.useRef)(e),o=n.current;n.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,r.useEffect)((function(){L(t._container,a)}),[a]),null}const J=(0,r.memo)(W);function G(e,t){if(!e)throw new Error(t)}var H=0;const B=function(e){var t=(0,r.useContext)(C).map.getMap(),n=(0,r.useRef)(e),o=(0,r.useState)(0)[1],a=(0,r.useMemo)((function(){return e.id||"jsx-layer-"+H++}),[]);if((0,r.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,n,r){if(G(n.id===r.id,"layer id changed"),G(n.type===r.type,"layer type changed"),"custom"!==n.type&&"custom"!==r.type){var o=n.layout,a=void 0===o?{}:o,s=n.paint,u=void 0===s?{}:s,l=n.filter,c=n.minzoom,p=n.maxzoom,d=n.beforeId;if(d!==r.beforeId&&e.moveLayer(t,d),a!==r.layout){var m=r.layout||{};for(var f in a)i(a[f],m[f])||e.setLayoutProperty(t,f,a[f]);for(var g in m)a.hasOwnProperty(g)||e.setLayoutProperty(t,g,void 0)}if(u!==r.paint){var v=r.paint||{};for(var h in u)i(u[h],v[h])||e.setPaintProperty(t,h,u[h]);for(var y in v)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(l,r.filter)||e.setFilter(t,l),c===r.minzoom&&p===r.maxzoom||e.setLayerZoomRange(t,c,p)}}(t,a,e,n.current)}catch(s){console.warn(s)}else!function(e,t,n){if(e.style&&e.style._loaded&&(!("source"in n)||e.getSource(n.source))){var r=Object.assign({},n,{id:t});delete r.beforeId,e.addLayer(r,n.beforeId)}}(t,a,e);return n.current=e,null};var V=0;const q=function(e){var t=(0,r.useContext)(C).map.getMap(),n=(0,r.useRef)(e),o=(0,r.useState)(0)[1],a=(0,r.useMemo)((function(){return e.id||"jsx-source-"+V++}),[]);(0,r.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var n,r=null==(n=t.getStyle())?void 0:n.layers;if(r)for(var o,i=(0,c.Z)(r);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,n){G(t.id===n.id,"source id changed"),G(t.type===n.type,"source type changed");var r="",o=0;for(var a in t)"children"===a||"id"===a||i(n[a],t[a])||(r=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===r)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(r){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+r)}}(s,e,n.current):s=function(e,t,n){if(e.style&&e.style._loaded){var r=Object.assign({},n);return delete r.id,delete r.children,e.addSource(t,r),e.getSource(t)}return null}(t,a,e),n.current=e,s&&r.Children.map(e.children,(function(e){return e&&(0,r.cloneElement)(e,{source:a})}))||null};var Q=n.e(8539).then(n.t.bind(n,8539,23)),X=r.forwardRef((function(e,t){return E(e,t,Q)})),Y=O,K=A,$=N,ee=U,te=F,ne=J,re=B,oe=q;const ae=X},745:(e,t,n)=>{var r=n(3935);r.createRoot,r.hydrateRoot},1202:(e,t,n)=>{n.d(t,{Z:()=>i});var r=n(1002);function o(e){var t=function(e,t){if("object"!==(0,r.Z)(e)||null===e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t||"default");if("object"!==(0,r.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,r.Z)(t)?t:String(t)}function a(e,t){for(var n=0;n{e.exports=JSON.parse('[{"city":"New York","population":"8,175,133","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/b/b9/Above_Gotham.jpg/240px-Above_Gotham.jpg","state":"New York","latitude":40.6643,"longitude":-73.9385},{"city":"Los Angeles","population":"3,792,621","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/5/57/LA_Skyline_Mountains2.jpg/240px-LA_Skyline_Mountains2.jpg","state":"California","latitude":34.0194,"longitude":-118.4108},{"city":"Chicago","population":"2,695,598","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/8/85/2008-06-10_3000x1000_chicago_skyline.jpg/240px-2008-06-10_3000x1000_chicago_skyline.jpg","state":"Illinois","latitude":41.8376,"longitude":-87.6818},{"city":"Houston","population":"2,100,263","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/6/60/Aerial_views_of_the_Houston%2C_Texas%2C_28005u.jpg/240px-Aerial_views_of_the_Houston%2C_Texas%2C_28005u.jpg","state":"Texas","latitude":29.7805,"longitude":-95.3863},{"city":"Phoenix","population":"1,445,632","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/b/b9/Downtown_Phoenix_Aerial_Looking_Northeast.jpg/207px-Downtown_Phoenix_Aerial_Looking_Northeast.jpg","state":"Arizona","latitude":33.5722,"longitude":-112.088},{"city":"Philadelphia","population":"1,526,006","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/4/4d/Philly_skyline.jpg/240px-Philly_skyline.jpg","state":"Pennsylvania","latitude":40.0094,"longitude":-75.1333},{"city":"San Antonio","population":"1,327,407","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/f/ff/Downtown_San_Antonio_View.JPG/240px-Downtown_San_Antonio_View.JPG","state":"Texas","latitude":29.4724,"longitude":-98.5251},{"city":"San Diego","population":"1,307,402","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/5/53/US_Navy_110604-N-NS602-574_Navy_and_Marine_Corps_personnel%2C_along_with_community_leaders_from_the_greater_San_Diego_area_come_together_to_commemora.jpg/240px-US_Navy_110604-N-NS602-574_Navy_and_Marine_Corps_personnel%2C_along_with_community_leaders_from_the_greater_San_Diego_area_come_together_to_commemora.jpg","state":"California","latitude":32.8153,"longitude":-117.135},{"city":"Dallas","population":"1,197,816","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/a/ab/Dallas_skyline_daytime.jpg/240px-Dallas_skyline_daytime.jpg","state":"Texas","latitude":32.7757,"longitude":-96.7967},{"city":"San Jose","population":"945,942","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/1/1e/Downtown_San_Jose_skyline.PNG/240px-Downtown_San_Jose_skyline.PNG","state":"California","latitude":37.2969,"longitude":-121.8193},{"city":"Austin","population":"790,390","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/9/97/Austin2012-12-01.JPG/240px-Austin2012-12-01.JPG","state":"Texas","latitude":30.3072,"longitude":-97.756},{"city":"Jacksonville","population":"821,784","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/f/f3/Skyline_of_Jacksonville_FL%2C_South_view_20160706_1.jpg/240px-Skyline_of_Jacksonville_FL%2C_South_view_20160706_1.jpg","state":"Florida","latitude":30.337,"longitude":-81.6613},{"city":"San Francisco","population":"805,235","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/6/6a/San_Francisco_skyline_from_Coit_Tower.jpg/240px-San_Francisco_skyline_from_Coit_Tower.jpg","state":"California","latitude":37.7751,"longitude":-122.4193},{"city":"Columbus","population":"787,033","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/f/fc/Columbus-ohio-skyline-panorama.jpg/240px-Columbus-ohio-skyline-panorama.jpg","state":"Ohio","latitude":39.9848,"longitude":-82.985},{"city":"Indianapolis","population":"820,445","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/1/16/Downtown_indy_from_parking_garage_zoom.JPG/213px-Downtown_indy_from_parking_garage_zoom.JPG","state":"Indiana","latitude":39.7767,"longitude":-86.1459},{"city":"Fort Worth","population":"741,206","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/d/db/FortWorthTexasSkylineW.jpg/240px-FortWorthTexasSkylineW.jpg","state":"Texas","latitude":32.7795,"longitude":-97.3463},{"city":"Charlotte","population":"731,424","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/7/7d/Charlotte_skyline45647.jpg/222px-Charlotte_skyline45647.jpg","state":"North Carolina","latitude":35.2087,"longitude":-80.8307},{"city":"Seattle","population":"608,660","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/3/36/SeattleI5Skyline.jpg/240px-SeattleI5Skyline.jpg","state":"Washington","latitude":47.6205,"longitude":-122.3509},{"city":"Denver","population":"600,158","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/0/0b/DenverCP.JPG/240px-DenverCP.JPG","state":"Colorado","latitude":39.7618,"longitude":-104.8806},{"city":"El Paso","population":"649,121","image":"http://upload.wikimedia.org/wikipedia/commons/thumb/6/6d/Downtown_El_Paso_at_sunset.jpeg/240px-Downtown_El_Paso_at_sunset.jpeg","state":"Texas","latitude":31.8484,"longitude":-106.427}]')}}]); \ No newline at end of file diff --git a/assets/js/65007ee8.4f3b9457.js b/assets/js/65007ee8.4f3b9457.js deleted file mode 100644 index 646cd4db..00000000 --- a/assets/js/65007ee8.4f3b9457.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkreact_map_gl_website=self.webpackChunkreact_map_gl_website||[]).push([[1528],{3905:(e,t,r)=>{r.d(t,{Zo:()=>l,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var u=n.createContext({}),c=function(e){var t=n.useContext(u),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},l=function(e){var t=c(e.components);return n.createElement(u.Provider,{value:t},e.children)},p="mdxType",f={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},d=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,l=s(e,["components","mdxType","originalType","parentName"]),p=c(r),d=o,m=p["".concat(u,".").concat(d)]||p[d]||f[d]||a;return r?n.createElement(m,i(i({ref:t},l),{},{components:r})):n.createElement(m,i({ref:t},l))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=d;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[p]="string"==typeof e?e:o,i[1]=s;for(var c=2;c{r.r(t),r.d(t,{assets:()=>h,contentTitle:()=>v,default:()=>E,frontMatter:()=>m,metadata:()=>g,toc:()=>y});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945));function u(e){return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"3D Terrain"),a.createElement("p",null,"Add 3D terrain and sky to a map."),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/terrain",target:"_new"},"View Code \u2197")))}const c=a.memo(u);var l="",p={id:"sky",type:"sky",paint:{"sky-type":"atmosphere","sky-atmosphere-sun":[0,0],"sky-atmosphere-sun-intensity":15}};function f(){return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:{latitude:32.6141,longitude:-114.34411,zoom:14,bearing:80,pitch:80},maxPitch:85,mapStyle:"mapbox://styles/mapbox/satellite-v9",mapboxAccessToken:l,terrain:{source:"mapbox-dem",exaggeration:1.5}},a.createElement(s.Hw,{id:"mapbox-dem",type:"raster-dem",url:"mapbox://mapbox.mapbox-terrain-dem-v1",tileSize:512,maxzoom:14}),a.createElement(s.mh,p)),a.createElement(c,null))}var d=["components"],m={},v="Terrain",g={unversionedId:"terrain",id:"terrain",title:"Terrain",description:"",source:"@site/src/examples/terrain.mdx",sourceDirName:".",slug:"/terrain",permalink:"/react-map-gl/examples/terrain",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Draw Polygon",permalink:"/react-map-gl/examples/draw-polygon"},next:{title:"Geocoder",permalink:"/react-map-gl/examples/geocoder"}},h={},y=[],b={toc:y},_="wrapper";function E(e){var t=e.components,r=(0,o.Z)(e,d);return(0,i.kt)(_,(0,n.Z)({},b,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"terrain"},"Terrain"),(0,i.kt)(f,{mdxType:"App"}))}E.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>K,Pv:()=>ee,GI:()=>Y,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>Z});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?d:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:f(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var c=new this._MapClass(a);i.padding&&c.setPadding(i.padding),r.cursor&&(c.getCanvas().style.cursor=r.cursor),this._createShadowTransform(c);var l=c._render;c._render=function(e){t._inRender=!0,l.call(c,e),t._inRender=!1};var p=c._renderTaskQueue.run;c._renderTaskQueue.run=function(e){p.call(c._renderTaskQueue,e),t._onBeforeRepaint()},c.on("render",(function(){return t._onAfterRepaint()}));var h=c.fire;for(var y in c.fire=this._fireEvent.bind(this,h),c.on("resize",(function(){t._renderTransform.resize(c.transform.width,c.transform.height)})),c.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(c.transform,t._renderTransform)})),c.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)c.on(y,this._onPointerEvent);for(var b in v)c.on(b,this._onCameraEvent);for(var E in g)c.on(E,this._onEvent);this._map=c},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var l=c(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),l&&t){var p=this._deferredEvents;p.move=!0,p.zoom||(p.zoom=o!==n.zoom),p.rotate||(p.rotate=i!==n.bearing),p.pitch||(p.pitch=a!==n.pitch)}return s||c(r.transform,e),l},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function x(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a}},o=(0,l.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,l.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const w="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var S=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var L=n.createContext(null);function P(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],c=(0,n.useRef)(),p=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,l.Z)(S);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,c.current)),t||(t=new b(n.Map,e,c.current)),p.map=x(t),p.mapLib=n,u(t),null==a||a.onMapMount(p.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),w((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return p.map}),[s]);var f=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:c,style:f},s&&n.createElement(L.Provider,{value:p},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var C=r(3935),O=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function M(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!O.test(n)?r[n]=o+"px":r[n]=o}}}function T(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,c,l,p,f,d,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,b=void 0!==y&&y,_=e.popup,E=void 0===_?null:_,x=e.rotation,w=void 0===x?0:x,S=e.rotationAlignment,P=void 0===S?"auto":S,O=e.pitchAlignment,T=void 0===O?"auto":O;return(0,n.useEffect)((function(){M(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),c=g,l=Array.isArray(u)?u[0]:u?u.x:0,p=Array.isArray(u)?u[1]:u?u.y:0,f=Array.isArray(c)?c[0]:c?c.x:0,d=Array.isArray(c)?c[1]:c?c.y:0,l!==f||p!==d)&&s.setOffset(g),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==w&&s.setRotation(w),s.getRotationAlignment()!==P&&s.setRotationAlignment(P),s.getPitchAlignment()!==T&&s.setPitchAlignment(T),s.getPopup()!==E&&s.setPopup(E),(0,C.createPortal)(e.children,s.getElement())}const j=(0,n.memo)((0,n.forwardRef)(T));function k(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var c=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return c.on("close",e),c.setDOMContent(s).addTo(o.getMap()),function(){c.off("close",e),c.isOpen()&&c.remove()}}),[]),(0,n.useEffect)((function(){M(c.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return c}),[]),c.isOpen()&&(c.getLngLat().lng===e.longitude&&c.getLngLat().lat===e.latitude||c.setLngLat([e.longitude,e.latitude]),e.offset&&!i(c.options.offset,e.offset)&&c.setOffset(e.offset),c.options.anchor===e.anchor&&c.options.maxWidth===e.maxWidth||(c.options.anchor=e.anchor,c.setMaxWidth(e.maxWidth)),c.options.className!==e.className)){for(var p,f=k(c.options.className),d=k(e.className),m=(0,l.Z)(f);!(p=m()).done;){var v=p.value;d.has(v)||c.removeClassName(v)}for(var g,h=(0,l.Z)(d);!(g=h()).done;){var y=g.value;f.has(y)||c.addClassName(y)}c.options.className=e.className}return(0,C.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(R));const Z=function(e,t,r,o){var a=(0,n.useContext)(L),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function I(e){var t=Z((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){M(t._controlContainer,e.style)}),[e.style]),null}const A=(0,n.memo)(I);function D(e,t){var r=(0,n.useRef)({props:e}),o=Z((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){M(o._container,e.style)}),[e.style]),null}const N=(0,n.memo)((0,n.forwardRef)(D));function F(e){var t=Z((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){M(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(F);function B(e){var t=Z((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){M(t._container,a)}),[a]),null}const W=(0,n.memo)(B);function H(e,t){if(!e)throw new Error(t)}var V=0;const q=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+V++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(H(r.id===n.id,"layer id changed"),H(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,c=r.filter,l=r.minzoom,p=r.maxzoom,f=r.beforeId;if(f!==n.beforeId&&e.moveLayer(t,f),a!==n.layout){var d=n.layout||{};for(var m in a)i(a[m],d[m])||e.setLayoutProperty(t,m,a[m]);for(var v in d)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(c,n.filter)||e.setFilter(t,c),l===n.minzoom&&p===n.maxzoom||e.setLayerZoomRange(t,l,p)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var G=0;const J=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+G++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,l.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){H(t.id===r.id,"source id changed"),H(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return P(e,t,Q)})),K=j,Y=z,$=A,ee=U,te=N,re=W,ne=q,oe=J;const ae=X},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{r.d(t,{Zo:()=>l,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var u=n.createContext({}),c=function(e){var t=n.useContext(u),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},l=function(e){var t=c(e.components);return n.createElement(u.Provider,{value:t},e.children)},p="mdxType",f={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},d=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,l=s(e,["components","mdxType","originalType","parentName"]),p=c(r),d=o,m=p["".concat(u,".").concat(d)]||p[d]||f[d]||a;return r?n.createElement(m,i(i({ref:t},l),{},{components:r})):n.createElement(m,i({ref:t},l))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=d;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[p]="string"==typeof e?e:o,i[1]=s;for(var c=2;c{r.r(t),r.d(t,{assets:()=>y,contentTitle:()=>v,default:()=>E,frontMatter:()=>m,metadata:()=>g,toc:()=>h});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945));function u(e){return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"3D Terrain"),a.createElement("p",null,"Add 3D terrain and sky to a map."),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/terrain",target:"_new"},"View Code \u2197")))}const c=a.memo(u);var l="",p={id:"sky",type:"sky",paint:{"sky-type":"atmosphere","sky-atmosphere-sun":[0,0],"sky-atmosphere-sun-intensity":15}};function f(){return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:{latitude:32.6141,longitude:-114.34411,zoom:14,bearing:80,pitch:80},maxPitch:85,mapStyle:"mapbox://styles/mapbox/satellite-v9",mapboxAccessToken:l,terrain:{source:"mapbox-dem",exaggeration:1.5}},a.createElement(s.Hw,{id:"mapbox-dem",type:"raster-dem",url:"mapbox://mapbox.mapbox-terrain-dem-v1",tileSize:512,maxzoom:14}),a.createElement(s.mh,p)),a.createElement(c,null))}var d=["components"],m={},v="Terrain",g={unversionedId:"terrain",id:"terrain",title:"Terrain",description:"",source:"@site/src/examples/terrain.mdx",sourceDirName:".",slug:"/terrain",permalink:"/react-map-gl/examples/terrain",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Draw Polygon",permalink:"/react-map-gl/examples/draw-polygon"},next:{title:"Geocoder",permalink:"/react-map-gl/examples/geocoder"}},y={},h=[],b={toc:h},_="wrapper";function E(e){var t=e.components,r=(0,o.Z)(e,d);return(0,i.kt)(_,(0,n.Z)({},b,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"terrain"},"Terrain"),(0,i.kt)(f,{mdxType:"App"}))}E.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>K,Pv:()=>ee,GI:()=>Y,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>Z});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?d:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:f(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var c=new this._MapClass(a);i.padding&&c.setPadding(i.padding),r.cursor&&(c.getCanvas().style.cursor=r.cursor),this._createShadowTransform(c);var l=c._render;c._render=function(e){t._inRender=!0,l.call(c,e),t._inRender=!1};var p=c._renderTaskQueue.run;c._renderTaskQueue.run=function(e){p.call(c._renderTaskQueue,e),t._onBeforeRepaint()},c.on("render",(function(){return t._onAfterRepaint()}));var y=c.fire;for(var h in c.fire=this._fireEvent.bind(this,y),c.on("resize",(function(){t._renderTransform.resize(c.transform.width,c.transform.height)})),c.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(c.transform,t._renderTransform)})),c.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)c.on(h,this._onPointerEvent);for(var b in v)c.on(b,this._onCameraEvent);for(var E in g)c.on(E,this._onEvent);this._map=c},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var l=c(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),l&&t){var p=this._deferredEvents;p.move=!0,p.zoom||(p.zoom=o!==n.zoom),p.rotate||(p.rotate=i!==n.bearing),p.pitch||(p.pitch=a!==n.pitch)}return s||c(r.transform,e),l},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=y;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function x(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a},queryRenderedFeatures:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryRenderedFeatures(t,n);return r.transform=o,a}},o=(0,l.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,l.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const w="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var S=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var L=n.createContext(null);function P(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],c=(0,n.useRef)(),p=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,l.Z)(S);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,c.current)),t||(t=new b(n.Map,e,c.current)),p.map=x(t),p.mapLib=n,u(t),null==a||a.onMapMount(p.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),w((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return p.map}),[s]);var f=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:c,style:f},s&&n.createElement(L.Provider,{value:p},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var C=r(3935),O=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function M(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!O.test(n)?r[n]=o+"px":r[n]=o}}}function T(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,c,l,p,f,d,m=e.longitude,v=e.latitude,g=e.offset,y=e.style,h=e.draggable,b=void 0!==h&&h,_=e.popup,E=void 0===_?null:_,x=e.rotation,w=void 0===x?0:x,S=e.rotationAlignment,P=void 0===S?"auto":S,O=e.pitchAlignment,T=void 0===O?"auto":O;return(0,n.useEffect)((function(){M(s.getElement(),y)}),[y]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),c=g,l=Array.isArray(u)?u[0]:u?u.x:0,p=Array.isArray(u)?u[1]:u?u.y:0,f=Array.isArray(c)?c[0]:c?c.x:0,d=Array.isArray(c)?c[1]:c?c.y:0,l!==f||p!==d)&&s.setOffset(g),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==w&&s.setRotation(w),s.getRotationAlignment()!==P&&s.setRotationAlignment(P),s.getPitchAlignment()!==T&&s.setPitchAlignment(T),s.getPopup()!==E&&s.setPopup(E),(0,C.createPortal)(e.children,s.getElement())}const j=(0,n.memo)((0,n.forwardRef)(T));function k(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var c=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return c.on("close",e),c.setDOMContent(s).addTo(o.getMap()),function(){c.off("close",e),c.isOpen()&&c.remove()}}),[]),(0,n.useEffect)((function(){M(c.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return c}),[]),c.isOpen()&&(c.getLngLat().lng===e.longitude&&c.getLngLat().lat===e.latitude||c.setLngLat([e.longitude,e.latitude]),e.offset&&!i(c.options.offset,e.offset)&&c.setOffset(e.offset),c.options.anchor===e.anchor&&c.options.maxWidth===e.maxWidth||(c.options.anchor=e.anchor,c.setMaxWidth(e.maxWidth)),c.options.className!==e.className)){for(var p,f=k(c.options.className),d=k(e.className),m=(0,l.Z)(f);!(p=m()).done;){var v=p.value;d.has(v)||c.removeClassName(v)}for(var g,y=(0,l.Z)(d);!(g=y()).done;){var h=g.value;f.has(h)||c.addClassName(h)}c.options.className=e.className}return(0,C.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(R));const Z=function(e,t,r,o){var a=(0,n.useContext)(L),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function I(e){var t=Z((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){M(t._controlContainer,e.style)}),[e.style]),null}const A=(0,n.memo)(I);function D(e,t){var r=(0,n.useRef)({props:e}),o=Z((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){M(o._container,e.style)}),[e.style]),null}const N=(0,n.memo)((0,n.forwardRef)(D));function F(e){var t=Z((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){M(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(F);function B(e){var t=Z((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){M(t._container,a)}),[a]),null}const W=(0,n.memo)(B);function H(e,t){if(!e)throw new Error(t)}var q=0;const V=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+q++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(H(r.id===n.id,"layer id changed"),H(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,c=r.filter,l=r.minzoom,p=r.maxzoom,f=r.beforeId;if(f!==n.beforeId&&e.moveLayer(t,f),a!==n.layout){var d=n.layout||{};for(var m in a)i(a[m],d[m])||e.setLayoutProperty(t,m,a[m]);for(var v in d)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var y in u)i(u[y],g[y])||e.setPaintProperty(t,y,u[y]);for(var h in g)u.hasOwnProperty(h)||e.setPaintProperty(t,h,void 0)}i(c,n.filter)||e.setFilter(t,c),l===n.minzoom&&p===n.maxzoom||e.setLayerZoomRange(t,l,p)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var G=0;const J=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+G++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,l.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){H(t.id===r.id,"source id changed"),H(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return P(e,t,Q)})),K=j,Y=z,$=A,ee=U,te=N,re=W,ne=V,oe=J;const ae=X},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{r.d(t,{Zo:()=>c,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var u=n.createContext({}),l=function(e){var t=n.useContext(u),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},c=function(e){var t=l(e.components);return n.createElement(u.Provider,{value:t},e.children)},f="mdxType",p={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},d=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,c=s(e,["components","mdxType","originalType","parentName"]),f=l(r),d=o,m=f["".concat(u,".").concat(d)]||f[d]||p[d]||a;return r?n.createElement(m,i(i({ref:t},c),{},{components:r})):n.createElement(m,i({ref:t},c))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=d;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[f]="string"==typeof e?e:o,i[1]=s;for(var l=2;l{r.r(t),r.d(t,{assets:()=>x,contentTitle:()=>_,default:()=>C,frontMatter:()=>b,metadata:()=>E,toc:()=>S});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945)),u=["onDragStart","onDrag","onDragEnd"];function l(e){return(Math.round(1e5*e)/1e5).toFixed(5)}function c(e){return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Draggable Marker"),a.createElement("p",null,"Try dragging the marker to another location."),a.createElement("div",null,u.map((function(t){var r=e.events,n=(void 0===r?{}:r)[t];return a.createElement("div",{key:t},a.createElement("strong",null,t,":")," ",n?l(n.lng)+", "+l(n.lat):a.createElement("em",null,"null"))}))),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/draggable-markers",target:"_new"},"View Code \u2197")))}const f=a.memo(c);var p={fill:"#d00",stroke:"none"};function d(e){var t=e.size,r=void 0===t?20:t;return a.createElement("svg",{height:r,viewBox:"0 0 24 24",style:p},a.createElement("path",{d:"M20.2,15.7L20.2,15.7c1.1-1.6,1.8-3.6,1.8-5.7c0-5.6-4.5-10-10-10S2,4.5,2,10c0,2,0.6,3.9,1.6,5.4c0,0.1,0.1,0.2,0.2,0.3\n c0,0,0.1,0.1,0.1,0.2c0.2,0.3,0.4,0.6,0.7,0.9c2.6,3.1,7.4,7.6,7.4,7.6s4.8-4.5,7.4-7.5c0.2-0.3,0.5-0.6,0.7-0.9\n C20.1,15.8,20.2,15.8,20.2,15.7z"}))}const m=a.memo(d);var v="",g={latitude:40,longitude:-100,zoom:3.5};function h(){var e=(0,a.useState)({latitude:40,longitude:-100}),t=e[0],r=e[1],n=(0,a.useState)({}),o=n[0],i=n[1],u=(0,a.useCallback)((function(e){i((function(t){return Object.assign({},t,{onDragStart:e.lngLat})}))}),[]),l=(0,a.useCallback)((function(e){i((function(t){return Object.assign({},t,{onDrag:e.lngLat})})),r({longitude:e.lngLat.lng,latitude:e.lngLat.lat})}),[]),c=(0,a.useCallback)((function(e){i((function(t){return Object.assign({},t,{onDragEnd:e.lngLat})}))}),[]);return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:g,mapStyle:"mapbox://styles/mapbox/dark-v9",mapboxAccessToken:v},a.createElement(s.Jx,{longitude:t.longitude,latitude:t.latitude,anchor:"bottom",draggable:!0,onDragStart:u,onDrag:l,onDragEnd:c},a.createElement(m,{size:20})),a.createElement(s.Pv,null)),a.createElement(f,{events:o}))}var y=["components"],b={},_="Draggable Marker",E={unversionedId:"draggable-markers",id:"draggable-markers",title:"Draggable Marker",description:"",source:"@site/src/examples/draggable-markers.mdx",sourceDirName:".",slug:"/draggable-markers",permalink:"/react-map-gl/examples/draggable-markers",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Custom Cursor",permalink:"/react-map-gl/examples/custom-cursor"},next:{title:"GeoJSON",permalink:"/react-map-gl/examples/geojson"}},x={},S=[],L={toc:S},w="wrapper";function C(e){var t=e.components,r=(0,o.Z)(e,y);return(0,i.kt)(w,(0,n.Z)({},L,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"draggable-marker"},"Draggable Marker"),(0,i.kt)(h,{mdxType:"App"}))}C.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>K,Pv:()=>ee,GI:()=>Y,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>D});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?d:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:p(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var l=new this._MapClass(a);i.padding&&l.setPadding(i.padding),r.cursor&&(l.getCanvas().style.cursor=r.cursor),this._createShadowTransform(l);var c=l._render;l._render=function(e){t._inRender=!0,c.call(l,e),t._inRender=!1};var f=l._renderTaskQueue.run;l._renderTaskQueue.run=function(e){f.call(l._renderTaskQueue,e),t._onBeforeRepaint()},l.on("render",(function(){return t._onAfterRepaint()}));var h=l.fire;for(var y in l.fire=this._fireEvent.bind(this,h),l.on("resize",(function(){t._renderTransform.resize(l.transform.width,l.transform.height)})),l.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(l.transform,t._renderTransform)})),l.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)l.on(y,this._onPointerEvent);for(var b in v)l.on(b,this._onCameraEvent);for(var E in g)l.on(E,this._onEvent);this._map=l},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var c=l(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),c&&t){var f=this._deferredEvents;f.move=!0,f.zoom||(f.zoom=o!==n.zoom),f.rotate||(f.rotate=i!==n.bearing),f.pitch||(f.pitch=a!==n.pitch)}return s||l(r.transform,e),c},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function x(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a},queryRenderedFeatures:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryRenderedFeatures(t,n);return r.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,c.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const S="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var L=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var w=n.createContext(null);function C(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],l=(0,n.useRef)(),f=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,c.Z)(L);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,l.current)),t||(t=new b(n.Map,e,l.current)),f.map=x(t),f.mapLib=n,u(t),null==a||a.onMapMount(f.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),S((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return f.map}),[s]);var p=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:l,style:p},s&&n.createElement(w.Provider,{value:f},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var P=r(3935),O=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function M(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!O.test(n)?r[n]=o+"px":r[n]=o}}}function k(e,t){var r=(0,n.useContext)(w),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,l,c,f,p,d,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,b=void 0!==y&&y,_=e.popup,E=void 0===_?null:_,x=e.rotation,S=void 0===x?0:x,L=e.rotationAlignment,C=void 0===L?"auto":L,O=e.pitchAlignment,k=void 0===O?"auto":O;return(0,n.useEffect)((function(){M(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),l=g,c=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,p=Array.isArray(l)?l[0]:l?l.x:0,d=Array.isArray(l)?l[1]:l?l.y:0,c!==p||f!==d)&&s.setOffset(g),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==S&&s.setRotation(S),s.getRotationAlignment()!==C&&s.setRotationAlignment(C),s.getPitchAlignment()!==k&&s.setPitchAlignment(k),s.getPopup()!==E&&s.setPopup(E),(0,P.createPortal)(e.children,s.getElement())}const j=(0,n.memo)((0,n.forwardRef)(k));function T(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var r=(0,n.useContext)(w),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var l=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return l.on("close",e),l.setDOMContent(s).addTo(o.getMap()),function(){l.off("close",e),l.isOpen()&&l.remove()}}),[]),(0,n.useEffect)((function(){M(l.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return l}),[]),l.isOpen()&&(l.getLngLat().lng===e.longitude&&l.getLngLat().lat===e.latitude||l.setLngLat([e.longitude,e.latitude]),e.offset&&!i(l.options.offset,e.offset)&&l.setOffset(e.offset),l.options.anchor===e.anchor&&l.options.maxWidth===e.maxWidth||(l.options.anchor=e.anchor,l.setMaxWidth(e.maxWidth)),l.options.className!==e.className)){for(var f,p=T(l.options.className),d=T(e.className),m=(0,c.Z)(p);!(f=m()).done;){var v=f.value;d.has(v)||l.removeClassName(v)}for(var g,h=(0,c.Z)(d);!(g=h()).done;){var y=g.value;p.has(y)||l.addClassName(y)}l.options.className=e.className}return(0,P.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(R));const D=function(e,t,r,o){var a=(0,n.useContext)(w),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function Z(e){var t=D((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){M(t._controlContainer,e.style)}),[e.style]),null}const I=(0,n.memo)(Z);function A(e,t){var r=(0,n.useRef)({props:e}),o=D((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){M(o._container,e.style)}),[e.style]),null}const N=(0,n.memo)((0,n.forwardRef)(A));function F(e){var t=D((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){M(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(F);function B(e){var t=D((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){M(t._container,a)}),[a]),null}const W=(0,n.memo)(B);function H(e,t){if(!e)throw new Error(t)}var q=0;const V=function(e){var t=(0,n.useContext)(w).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+q++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(H(r.id===n.id,"layer id changed"),H(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,l=r.filter,c=r.minzoom,f=r.maxzoom,p=r.beforeId;if(p!==n.beforeId&&e.moveLayer(t,p),a!==n.layout){var d=n.layout||{};for(var m in a)i(a[m],d[m])||e.setLayoutProperty(t,m,a[m]);for(var v in d)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(l,n.filter)||e.setFilter(t,l),c===n.minzoom&&f===n.maxzoom||e.setLayerZoomRange(t,c,f)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var G=0;const J=function(e){var t=(0,n.useContext)(w).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+G++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,c.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){H(t.id===r.id,"source id changed"),H(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return C(e,t,Q)})),K=j,Y=z,$=I,ee=U,te=N,re=W,ne=V,oe=J;const ae=X},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{r.d(t,{Zo:()=>c,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var u=n.createContext({}),l=function(e){var t=n.useContext(u),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},c=function(e){var t=l(e.components);return n.createElement(u.Provider,{value:t},e.children)},f="mdxType",p={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},d=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,c=s(e,["components","mdxType","originalType","parentName"]),f=l(r),d=o,m=f["".concat(u,".").concat(d)]||f[d]||p[d]||a;return r?n.createElement(m,i(i({ref:t},c),{},{components:r})):n.createElement(m,i({ref:t},c))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=d;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[f]="string"==typeof e?e:o,i[1]=s;for(var l=2;l{r.r(t),r.d(t,{assets:()=>x,contentTitle:()=>_,default:()=>C,frontMatter:()=>b,metadata:()=>E,toc:()=>S});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945)),u=["onDragStart","onDrag","onDragEnd"];function l(e){return(Math.round(1e5*e)/1e5).toFixed(5)}function c(e){return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Draggable Marker"),a.createElement("p",null,"Try dragging the marker to another location."),a.createElement("div",null,u.map((function(t){var r=e.events,n=(void 0===r?{}:r)[t];return a.createElement("div",{key:t},a.createElement("strong",null,t,":")," ",n?l(n.lng)+", "+l(n.lat):a.createElement("em",null,"null"))}))),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/draggable-markers",target:"_new"},"View Code \u2197")))}const f=a.memo(c);var p={fill:"#d00",stroke:"none"};function d(e){var t=e.size,r=void 0===t?20:t;return a.createElement("svg",{height:r,viewBox:"0 0 24 24",style:p},a.createElement("path",{d:"M20.2,15.7L20.2,15.7c1.1-1.6,1.8-3.6,1.8-5.7c0-5.6-4.5-10-10-10S2,4.5,2,10c0,2,0.6,3.9,1.6,5.4c0,0.1,0.1,0.2,0.2,0.3\n c0,0,0.1,0.1,0.1,0.2c0.2,0.3,0.4,0.6,0.7,0.9c2.6,3.1,7.4,7.6,7.4,7.6s4.8-4.5,7.4-7.5c0.2-0.3,0.5-0.6,0.7-0.9\n C20.1,15.8,20.2,15.8,20.2,15.7z"}))}const m=a.memo(d);var v="",g={latitude:40,longitude:-100,zoom:3.5};function h(){var e=(0,a.useState)({latitude:40,longitude:-100}),t=e[0],r=e[1],n=(0,a.useState)({}),o=n[0],i=n[1],u=(0,a.useCallback)((function(e){i((function(t){return Object.assign({},t,{onDragStart:e.lngLat})}))}),[]),l=(0,a.useCallback)((function(e){i((function(t){return Object.assign({},t,{onDrag:e.lngLat})})),r({longitude:e.lngLat.lng,latitude:e.lngLat.lat})}),[]),c=(0,a.useCallback)((function(e){i((function(t){return Object.assign({},t,{onDragEnd:e.lngLat})}))}),[]);return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:g,mapStyle:"mapbox://styles/mapbox/dark-v9",mapboxAccessToken:v},a.createElement(s.Jx,{longitude:t.longitude,latitude:t.latitude,anchor:"bottom",draggable:!0,onDragStart:u,onDrag:l,onDragEnd:c},a.createElement(m,{size:20})),a.createElement(s.Pv,null)),a.createElement(f,{events:o}))}var y=["components"],b={},_="Draggable Marker",E={unversionedId:"draggable-markers",id:"draggable-markers",title:"Draggable Marker",description:"",source:"@site/src/examples/draggable-markers.mdx",sourceDirName:".",slug:"/draggable-markers",permalink:"/react-map-gl/examples/draggable-markers",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Custom Cursor",permalink:"/react-map-gl/examples/custom-cursor"},next:{title:"GeoJSON",permalink:"/react-map-gl/examples/geojson"}},x={},S=[],L={toc:S},w="wrapper";function C(e){var t=e.components,r=(0,o.Z)(e,y);return(0,i.kt)(w,(0,n.Z)({},L,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"draggable-marker"},"Draggable Marker"),(0,i.kt)(h,{mdxType:"App"}))}C.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>K,Pv:()=>ee,GI:()=>Y,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>D});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?d:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:p(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var l=new this._MapClass(a);i.padding&&l.setPadding(i.padding),r.cursor&&(l.getCanvas().style.cursor=r.cursor),this._createShadowTransform(l);var c=l._render;l._render=function(e){t._inRender=!0,c.call(l,e),t._inRender=!1};var f=l._renderTaskQueue.run;l._renderTaskQueue.run=function(e){f.call(l._renderTaskQueue,e),t._onBeforeRepaint()},l.on("render",(function(){return t._onAfterRepaint()}));var h=l.fire;for(var y in l.fire=this._fireEvent.bind(this,h),l.on("resize",(function(){t._renderTransform.resize(l.transform.width,l.transform.height)})),l.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(l.transform,t._renderTransform)})),l.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)l.on(y,this._onPointerEvent);for(var b in v)l.on(b,this._onCameraEvent);for(var E in g)l.on(E,this._onEvent);this._map=l},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var c=l(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),c&&t){var f=this._deferredEvents;f.move=!0,f.zoom||(f.zoom=o!==n.zoom),f.rotate||(f.rotate=i!==n.bearing),f.pitch||(f.pitch=a!==n.pitch)}return s||l(r.transform,e),c},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function x(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,c.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const S="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var L=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var w=n.createContext(null);function C(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],l=(0,n.useRef)(),f=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,c.Z)(L);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,l.current)),t||(t=new b(n.Map,e,l.current)),f.map=x(t),f.mapLib=n,u(t),null==a||a.onMapMount(f.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),S((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return f.map}),[s]);var p=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:l,style:p},s&&n.createElement(w.Provider,{value:f},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var P=r(3935),O=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function M(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!O.test(n)?r[n]=o+"px":r[n]=o}}}function k(e,t){var r=(0,n.useContext)(w),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,l,c,f,p,d,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,b=void 0!==y&&y,_=e.popup,E=void 0===_?null:_,x=e.rotation,S=void 0===x?0:x,L=e.rotationAlignment,C=void 0===L?"auto":L,O=e.pitchAlignment,k=void 0===O?"auto":O;return(0,n.useEffect)((function(){M(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),l=g,c=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,p=Array.isArray(l)?l[0]:l?l.x:0,d=Array.isArray(l)?l[1]:l?l.y:0,c!==p||f!==d)&&s.setOffset(g),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==S&&s.setRotation(S),s.getRotationAlignment()!==C&&s.setRotationAlignment(C),s.getPitchAlignment()!==k&&s.setPitchAlignment(k),s.getPopup()!==E&&s.setPopup(E),(0,P.createPortal)(e.children,s.getElement())}const j=(0,n.memo)((0,n.forwardRef)(k));function T(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var r=(0,n.useContext)(w),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var l=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return l.on("close",e),l.setDOMContent(s).addTo(o.getMap()),function(){l.off("close",e),l.isOpen()&&l.remove()}}),[]),(0,n.useEffect)((function(){M(l.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return l}),[]),l.isOpen()&&(l.getLngLat().lng===e.longitude&&l.getLngLat().lat===e.latitude||l.setLngLat([e.longitude,e.latitude]),e.offset&&!i(l.options.offset,e.offset)&&l.setOffset(e.offset),l.options.anchor===e.anchor&&l.options.maxWidth===e.maxWidth||(l.options.anchor=e.anchor,l.setMaxWidth(e.maxWidth)),l.options.className!==e.className)){for(var f,p=T(l.options.className),d=T(e.className),m=(0,c.Z)(p);!(f=m()).done;){var v=f.value;d.has(v)||l.removeClassName(v)}for(var g,h=(0,c.Z)(d);!(g=h()).done;){var y=g.value;p.has(y)||l.addClassName(y)}l.options.className=e.className}return(0,P.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(R));const D=function(e,t,r,o){var a=(0,n.useContext)(w),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function Z(e){var t=D((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){M(t._controlContainer,e.style)}),[e.style]),null}const I=(0,n.memo)(Z);function A(e,t){var r=(0,n.useRef)({props:e}),o=D((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){M(o._container,e.style)}),[e.style]),null}const N=(0,n.memo)((0,n.forwardRef)(A));function F(e){var t=D((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){M(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(F);function B(e){var t=D((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){M(t._container,a)}),[a]),null}const W=(0,n.memo)(B);function H(e,t){if(!e)throw new Error(t)}var V=0;const q=function(e){var t=(0,n.useContext)(w).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+V++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(H(r.id===n.id,"layer id changed"),H(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,l=r.filter,c=r.minzoom,f=r.maxzoom,p=r.beforeId;if(p!==n.beforeId&&e.moveLayer(t,p),a!==n.layout){var d=n.layout||{};for(var m in a)i(a[m],d[m])||e.setLayoutProperty(t,m,a[m]);for(var v in d)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(l,n.filter)||e.setFilter(t,l),c===n.minzoom&&f===n.maxzoom||e.setLayerZoomRange(t,c,f)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var G=0;const J=function(e){var t=(0,n.useContext)(w).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+G++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,c.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){H(t.id===r.id,"source id changed"),H(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return C(e,t,Q)})),K=j,Y=z,$=I,ee=U,te=N,re=W,ne=q,oe=J;const ae=X},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{r.r(t),r.d(t,{assets:()=>b,contentTitle:()=>y,default:()=>S,frontMatter:()=>h,metadata:()=>_,toc:()=>L});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945)),u=r(9651),c=r.n(u);function l(e){var t=(0,a.useState)(null),r=t[0],o=t[1],i=(0,s.PE)((function(){var t=new(c())(Object.assign({},e,{marker:!1,accessToken:e.mapboxAccessToken}));return t.on("loading",e.onLoading),t.on("results",e.onResults),t.on("result",(function(t){var r;e.onResult(t);var i=t.result,u=i&&(i.center||"Point"===(null==(r=i.geometry)?void 0:r.type)&&i.geometry.coordinates);u&&e.marker?o(a.createElement(s.Jx,(0,n.Z)({},e.marker,{longitude:u[0],latitude:u[1]}))):o(null)})),t.on("error",e.onError),t}),{position:e.position});return i._map&&(i.getProximity()!==e.proximity&&void 0!==e.proximity&&i.setProximity(e.proximity),i.getRenderFunction()!==e.render&&void 0!==e.render&&i.setRenderFunction(e.render),i.getLanguage()!==e.language&&void 0!==e.language&&i.setLanguage(e.language),i.getZoom()!==e.zoom&&void 0!==e.zoom&&i.setZoom(e.zoom),i.getFlyTo()!==e.flyTo&&void 0!==e.flyTo&&i.setFlyTo(e.flyTo),i.getPlaceholder()!==e.placeholder&&void 0!==e.placeholder&&i.setPlaceholder(e.placeholder),i.getCountries()!==e.countries&&void 0!==e.countries&&i.setCountries(e.countries),i.getTypes()!==e.types&&void 0!==e.types&&i.setTypes(e.types),i.getMinLength()!==e.minLength&&void 0!==e.minLength&&i.setMinLength(e.minLength),i.getLimit()!==e.limit&&void 0!==e.limit&&i.setLimit(e.limit),i.getFilter()!==e.filter&&void 0!==e.filter&&i.setFilter(e.filter),i.getOrigin()!==e.origin&&void 0!==e.origin&&i.setOrigin(e.origin)),r}var d=function(){};function f(e){return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Geocoder"),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/geocoder",target:"_new"},"View Code \u2197")))}l.defaultProps={marker:!0,onLoading:d,onResults:d,onResult:d,onError:d};const p=a.memo(f);var m="pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ";function v(){return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:{longitude:-79.4512,latitude:43.6568,zoom:13},mapStyle:"mapbox://styles/mapbox/streets-v9",mapboxAccessToken:m},a.createElement(l,{mapboxAccessToken:m,position:"top-left"})),a.createElement(p,null))}var g=["components"],h={},y="Geocoder",_={unversionedId:"geocoder",id:"geocoder",title:"Geocoder",description:"",source:"@site/src/examples/geocoder.mdx",sourceDirName:".",slug:"/geocoder",permalink:"/react-map-gl/examples/geocoder",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Terrain",permalink:"/react-map-gl/examples/terrain"},next:{title:"Side by Side",permalink:"/react-map-gl/examples/side-by-side"}},b={},L=[],E={toc:L},x="wrapper";function S(e){var t=e.components,r=(0,o.Z)(e,g);return(0,i.kt)(x,(0,n.Z)({},E,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"geocoder"},"Geocoder"),(0,i.kt)(v,{mdxType:"App"}))}S.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>Y,Pv:()=>ee,GI:()=>K,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>I});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?p:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||b()||null,container:e,style:f(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var c=new this._MapClass(a);i.padding&&c.setPadding(i.padding),r.cursor&&(c.getCanvas().style.cursor=r.cursor),this._createShadowTransform(c);var l=c._render;c._render=function(e){t._inRender=!0,l.call(c,e),t._inRender=!1};var d=c._renderTaskQueue.run;c._renderTaskQueue.run=function(e){d.call(c._renderTaskQueue,e),t._onBeforeRepaint()},c.on("render",(function(){return t._onAfterRepaint()}));var h=c.fire;for(var y in c.fire=this._fireEvent.bind(this,h),c.on("resize",(function(){t._renderTransform.resize(c.transform.width,c.transform.height)})),c.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(c.transform,t._renderTransform)})),c.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)c.on(y,this._onPointerEvent);for(var _ in v)c.on(_,this._onCameraEvent);for(var L in g)c.on(L,this._onEvent);this._map=c},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var l=c(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),l&&t){var d=this._deferredEvents;d.move=!0,d.zoom||(d.zoom=o!==n.zoom),d.rotate||(d.rotate=i!==n.bearing),d.pitch||(d.pitch=a!==n.pitch)}return s||c(r.transform,e),l},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function b(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}_.savedMaps=[];var L=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function E(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a},queryRenderedFeatures:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryRenderedFeatures(t,n);return r.transform=o,a}},o=(0,l.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,l.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||L.includes(a)||(n[a]=r[a].bind(r))}return n}const x="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var S=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var C=n.createContext(null);function w(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],c=(0,n.useRef)(),d=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,l.Z)(S);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=_.reuse(e,c.current)),t||(t=new _(n.Map,e,c.current)),d.map=E(t),d.mapLib=n,u(t),null==a||a.onMapMount(d.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),x((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return d.map}),[s]);var f=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:c,style:f},s&&n.createElement(C.Provider,{value:d},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var M=r(3935),P=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function T(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!P.test(n)?r[n]=o+"px":r[n]=o}}}function R(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,c,l,d,f,p,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,_=void 0!==y&&y,b=e.popup,L=void 0===b?null:b,E=e.rotation,x=void 0===E?0:E,S=e.rotationAlignment,w=void 0===S?"auto":S,P=e.pitchAlignment,R=void 0===P?"auto":P;return(0,n.useEffect)((function(){T(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),c=g,l=Array.isArray(u)?u[0]:u?u.x:0,d=Array.isArray(u)?u[1]:u?u.y:0,f=Array.isArray(c)?c[0]:c?c.x:0,p=Array.isArray(c)?c[1]:c?c.y:0,l!==f||d!==p)&&s.setOffset(g),s.isDraggable()!==_&&s.setDraggable(_),s.getRotation()!==x&&s.setRotation(x),s.getRotationAlignment()!==w&&s.setRotationAlignment(w),s.getPitchAlignment()!==R&&s.setPitchAlignment(R),s.getPopup()!==L&&s.setPopup(L),(0,M.createPortal)(e.children,s.getElement())}const k=(0,n.memo)((0,n.forwardRef)(R));function z(e){return new Set(e?e.trim().split(/\s+/):[])}function j(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var c=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return c.on("close",e),c.setDOMContent(s).addTo(o.getMap()),function(){c.off("close",e),c.isOpen()&&c.remove()}}),[]),(0,n.useEffect)((function(){T(c.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return c}),[]),c.isOpen()&&(c.getLngLat().lng===e.longitude&&c.getLngLat().lat===e.latitude||c.setLngLat([e.longitude,e.latitude]),e.offset&&!i(c.options.offset,e.offset)&&c.setOffset(e.offset),c.options.anchor===e.anchor&&c.options.maxWidth===e.maxWidth||(c.options.anchor=e.anchor,c.setMaxWidth(e.maxWidth)),c.options.className!==e.className)){for(var d,f=z(c.options.className),p=z(e.className),m=(0,l.Z)(f);!(d=m()).done;){var v=d.value;p.has(v)||c.removeClassName(v)}for(var g,h=(0,l.Z)(p);!(g=h()).done;){var y=g.value;f.has(y)||c.addClassName(y)}c.options.className=e.className}return(0,M.createPortal)(e.children,s)}const O=(0,n.memo)((0,n.forwardRef)(j));const I=function(e,t,r,o){var a=(0,n.useContext)(C),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function Z(e){var t=I((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){T(t._controlContainer,e.style)}),[e.style]),null}const A=(0,n.memo)(Z);function F(e,t){var r=(0,n.useRef)({props:e}),o=I((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){T(o._container,e.style)}),[e.style]),null}const N=(0,n.memo)((0,n.forwardRef)(F));function D(e){var t=I((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){T(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(D);function W(e){var t=I((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){T(t._container,a)}),[a]),null}const B=(0,n.memo)(W);function H(e,t){if(!e)throw new Error(t)}var G=0;const q=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+G++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(H(r.id===n.id,"layer id changed"),H(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,c=r.filter,l=r.minzoom,d=r.maxzoom,f=r.beforeId;if(f!==n.beforeId&&e.moveLayer(t,f),a!==n.layout){var p=n.layout||{};for(var m in a)i(a[m],p[m])||e.setLayoutProperty(t,m,a[m]);for(var v in p)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(c,n.filter)||e.setFilter(t,c),l===n.minzoom&&d===n.maxzoom||e.setLayerZoomRange(t,l,d)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var V=0;const J=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+V++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,l.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){H(t.id===r.id,"source id changed"),H(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return w(e,t,Q)})),Y=k,K=O,$=A,ee=U,te=N,re=B,ne=q,oe=J;const ae=X}}]); \ No newline at end of file diff --git a/assets/js/90db1e5e.b810799f.js b/assets/js/90db1e5e.b810799f.js deleted file mode 100644 index 33b09f4f..00000000 --- a/assets/js/90db1e5e.b810799f.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkreact_map_gl_website=self.webpackChunkreact_map_gl_website||[]).push([[1408],{8211:(e,t,r)=>{r.r(t),r.d(t,{assets:()=>b,contentTitle:()=>y,default:()=>S,frontMatter:()=>h,metadata:()=>_,toc:()=>L});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945)),u=r(9651),c=r.n(u);function l(e){var t=(0,a.useState)(null),r=t[0],o=t[1],i=(0,s.PE)((function(){var t=new(c())(Object.assign({},e,{marker:!1,accessToken:e.mapboxAccessToken}));return t.on("loading",e.onLoading),t.on("results",e.onResults),t.on("result",(function(t){var r;e.onResult(t);var i=t.result,u=i&&(i.center||"Point"===(null==(r=i.geometry)?void 0:r.type)&&i.geometry.coordinates);u&&e.marker?o(a.createElement(s.Jx,(0,n.Z)({},e.marker,{longitude:u[0],latitude:u[1]}))):o(null)})),t.on("error",e.onError),t}),{position:e.position});return i._map&&(i.getProximity()!==e.proximity&&void 0!==e.proximity&&i.setProximity(e.proximity),i.getRenderFunction()!==e.render&&void 0!==e.render&&i.setRenderFunction(e.render),i.getLanguage()!==e.language&&void 0!==e.language&&i.setLanguage(e.language),i.getZoom()!==e.zoom&&void 0!==e.zoom&&i.setZoom(e.zoom),i.getFlyTo()!==e.flyTo&&void 0!==e.flyTo&&i.setFlyTo(e.flyTo),i.getPlaceholder()!==e.placeholder&&void 0!==e.placeholder&&i.setPlaceholder(e.placeholder),i.getCountries()!==e.countries&&void 0!==e.countries&&i.setCountries(e.countries),i.getTypes()!==e.types&&void 0!==e.types&&i.setTypes(e.types),i.getMinLength()!==e.minLength&&void 0!==e.minLength&&i.setMinLength(e.minLength),i.getLimit()!==e.limit&&void 0!==e.limit&&i.setLimit(e.limit),i.getFilter()!==e.filter&&void 0!==e.filter&&i.setFilter(e.filter),i.getOrigin()!==e.origin&&void 0!==e.origin&&i.setOrigin(e.origin)),r}var d=function(){};function p(e){return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Geocoder"),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/geocoder",target:"_new"},"View Code \u2197")))}l.defaultProps={marker:!0,onLoading:d,onResults:d,onResult:d,onError:d};const f=a.memo(p);var m="pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ";function v(){return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:{longitude:-79.4512,latitude:43.6568,zoom:13},mapStyle:"mapbox://styles/mapbox/streets-v9",mapboxAccessToken:m},a.createElement(l,{mapboxAccessToken:m,position:"top-left"})),a.createElement(f,null))}var g=["components"],h={},y="Geocoder",_={unversionedId:"geocoder",id:"geocoder",title:"Geocoder",description:"",source:"@site/src/examples/geocoder.mdx",sourceDirName:".",slug:"/geocoder",permalink:"/react-map-gl/examples/geocoder",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Terrain",permalink:"/react-map-gl/examples/terrain"},next:{title:"Side by Side",permalink:"/react-map-gl/examples/side-by-side"}},b={},L=[],E={toc:L},x="wrapper";function S(e){var t=e.components,r=(0,o.Z)(e,g);return(0,i.kt)(x,(0,n.Z)({},E,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"geocoder"},"Geocoder"),(0,i.kt)(v,{mdxType:"App"}))}S.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>Y,Pv:()=>ee,GI:()=>K,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>I});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?f:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||b()||null,container:e,style:p(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var c=new this._MapClass(a);i.padding&&c.setPadding(i.padding),r.cursor&&(c.getCanvas().style.cursor=r.cursor),this._createShadowTransform(c);var l=c._render;c._render=function(e){t._inRender=!0,l.call(c,e),t._inRender=!1};var d=c._renderTaskQueue.run;c._renderTaskQueue.run=function(e){d.call(c._renderTaskQueue,e),t._onBeforeRepaint()},c.on("render",(function(){return t._onAfterRepaint()}));var h=c.fire;for(var y in c.fire=this._fireEvent.bind(this,h),c.on("resize",(function(){t._renderTransform.resize(c.transform.width,c.transform.height)})),c.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(c.transform,t._renderTransform)})),c.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)c.on(y,this._onPointerEvent);for(var _ in v)c.on(_,this._onCameraEvent);for(var L in g)c.on(L,this._onEvent);this._map=c},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var l=c(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),l&&t){var d=this._deferredEvents;d.move=!0,d.zoom||(d.zoom=o!==n.zoom),d.rotate||(d.rotate=i!==n.bearing),d.pitch||(d.pitch=a!==n.pitch)}return s||c(r.transform,e),l},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function b(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}_.savedMaps=[];var L=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function E(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a}},o=(0,l.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,l.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||L.includes(a)||(n[a]=r[a].bind(r))}return n}const x="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var S=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var C=n.createContext(null);function w(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],c=(0,n.useRef)(),d=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,l.Z)(S);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=_.reuse(e,c.current)),t||(t=new _(n.Map,e,c.current)),d.map=E(t),d.mapLib=n,u(t),null==a||a.onMapMount(d.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),x((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return d.map}),[s]);var p=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:c,style:p},s&&n.createElement(C.Provider,{value:d},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var M=r(3935),P=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function T(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!P.test(n)?r[n]=o+"px":r[n]=o}}}function R(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,c,l,d,p,f,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,_=void 0!==y&&y,b=e.popup,L=void 0===b?null:b,E=e.rotation,x=void 0===E?0:E,S=e.rotationAlignment,w=void 0===S?"auto":S,P=e.pitchAlignment,R=void 0===P?"auto":P;return(0,n.useEffect)((function(){T(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),c=g,l=Array.isArray(u)?u[0]:u?u.x:0,d=Array.isArray(u)?u[1]:u?u.y:0,p=Array.isArray(c)?c[0]:c?c.x:0,f=Array.isArray(c)?c[1]:c?c.y:0,l!==p||d!==f)&&s.setOffset(g),s.isDraggable()!==_&&s.setDraggable(_),s.getRotation()!==x&&s.setRotation(x),s.getRotationAlignment()!==w&&s.setRotationAlignment(w),s.getPitchAlignment()!==R&&s.setPitchAlignment(R),s.getPopup()!==L&&s.setPopup(L),(0,M.createPortal)(e.children,s.getElement())}const k=(0,n.memo)((0,n.forwardRef)(R));function z(e){return new Set(e?e.trim().split(/\s+/):[])}function j(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var c=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return c.on("close",e),c.setDOMContent(s).addTo(o.getMap()),function(){c.off("close",e),c.isOpen()&&c.remove()}}),[]),(0,n.useEffect)((function(){T(c.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return c}),[]),c.isOpen()&&(c.getLngLat().lng===e.longitude&&c.getLngLat().lat===e.latitude||c.setLngLat([e.longitude,e.latitude]),e.offset&&!i(c.options.offset,e.offset)&&c.setOffset(e.offset),c.options.anchor===e.anchor&&c.options.maxWidth===e.maxWidth||(c.options.anchor=e.anchor,c.setMaxWidth(e.maxWidth)),c.options.className!==e.className)){for(var d,p=z(c.options.className),f=z(e.className),m=(0,l.Z)(p);!(d=m()).done;){var v=d.value;f.has(v)||c.removeClassName(v)}for(var g,h=(0,l.Z)(f);!(g=h()).done;){var y=g.value;p.has(y)||c.addClassName(y)}c.options.className=e.className}return(0,M.createPortal)(e.children,s)}const O=(0,n.memo)((0,n.forwardRef)(j));const I=function(e,t,r,o){var a=(0,n.useContext)(C),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function Z(e){var t=I((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){T(t._controlContainer,e.style)}),[e.style]),null}const A=(0,n.memo)(Z);function F(e,t){var r=(0,n.useRef)({props:e}),o=I((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){T(o._container,e.style)}),[e.style]),null}const N=(0,n.memo)((0,n.forwardRef)(F));function D(e){var t=I((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){T(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(D);function W(e){var t=I((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){T(t._container,a)}),[a]),null}const B=(0,n.memo)(W);function H(e,t){if(!e)throw new Error(t)}var G=0;const V=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+G++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(H(r.id===n.id,"layer id changed"),H(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,c=r.filter,l=r.minzoom,d=r.maxzoom,p=r.beforeId;if(p!==n.beforeId&&e.moveLayer(t,p),a!==n.layout){var f=n.layout||{};for(var m in a)i(a[m],f[m])||e.setLayoutProperty(t,m,a[m]);for(var v in f)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(c,n.filter)||e.setFilter(t,c),l===n.minzoom&&d===n.maxzoom||e.setLayerZoomRange(t,l,d)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var q=0;const J=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+q++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,l.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){H(t.id===r.id,"source id changed"),H(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return w(e,t,Q)})),Y=k,K=O,$=A,ee=U,te=N,re=B,ne=V,oe=J;const ae=X}}]); \ No newline at end of file diff --git a/assets/js/9e2aef7f.136067b5.js b/assets/js/9e2aef7f.136067b5.js new file mode 100644 index 00000000..367915b3 --- /dev/null +++ b/assets/js/9e2aef7f.136067b5.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkreact_map_gl_website=self.webpackChunkreact_map_gl_website||[]).push([[9086],{3905:(e,t,r)=>{r.d(t,{Zo:()=>c,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var u=n.createContext({}),l=function(e){var t=n.useContext(u),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},c=function(e){var t=l(e.components);return n.createElement(u.Provider,{value:t},e.children)},f="mdxType",p={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},d=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,c=s(e,["components","mdxType","originalType","parentName"]),f=l(r),d=o,m=f["".concat(u,".").concat(d)]||f[d]||p[d]||a;return r?n.createElement(m,i(i({ref:t},c),{},{components:r})):n.createElement(m,i({ref:t},c))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=d;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[f]="string"==typeof e?e:o,i[1]=s;for(var l=2;l{r.r(t),r.d(t,{assets:()=>y,contentTitle:()=>g,default:()=>x,frontMatter:()=>v,metadata:()=>h,toc:()=>b});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945));function u(){return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Highlight Features Containing Similar Data"),a.createElement("p",null,"Hover over counties to highlight counties that share the same name."),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/filter",target:"_new"},"View Code \u2197")))}const l=a.memo(u);var c={id:"counties",type:"fill","source-layer":"original",paint:{"fill-outline-color":"rgba(0,0,0,0.1)","fill-color":"rgba(0,0,0,0.1)"}},f={id:"counties-highlighted",type:"fill",source:"counties","source-layer":"original",paint:{"fill-outline-color":"#484896","fill-color":"#6e599f","fill-opacity":.75}},p="";function d(){var e=(0,a.useState)(null),t=e[0],r=e[1],o=(0,a.useCallback)((function(e){var t=e.features&&e.features[0];r({longitude:e.lngLat.lng,latitude:e.lngLat.lat,countyName:t&&t.properties.COUNTY})}),[]),i=t&&t.countyName||"",u=(0,a.useMemo)((function(){return["in","COUNTY",i]}),[i]);return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:{latitude:38.88,longitude:-98,zoom:3},minZoom:2,mapStyle:"mapbox://styles/mapbox/light-v9",mapboxAccessToken:p,onMouseMove:o,interactiveLayerIds:["counties"]},a.createElement(s.Hw,{type:"vector",url:"mapbox://mapbox.82pkq93d"},a.createElement(s.mh,(0,n.Z)({beforeId:"waterway-label"},c)),a.createElement(s.mh,(0,n.Z)({beforeId:"waterway-label"},f,{filter:u}))),i&&a.createElement(s.GI,{longitude:t.longitude,latitude:t.latitude,offset:[0,-10],closeButton:!1,className:"county-info"},i)),a.createElement(l,null))}var m=["components"],v={},g="Highlight By Filter",h={unversionedId:"filter",id:"filter",title:"Highlight By Filter",description:"",source:"@site/src/examples/filter.mdx",sourceDirName:".",slug:"/filter",permalink:"/react-map-gl/examples/filter",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Camera Transition",permalink:"/react-map-gl/examples/viewport-animation"},next:{title:"Zoom to Bounds",permalink:"/react-map-gl/examples/zoom-to-bounds"}},y={},b=[],_={toc:b},E="wrapper";function x(e){var t=e.components,r=(0,o.Z)(e,m);return(0,i.kt)(E,(0,n.Z)({},_,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"highlight-by-filter"},"Highlight By Filter"),(0,i.kt)(d,{mdxType:"App"}))}x.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>Y,Pv:()=>ee,GI:()=>K,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>Z});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?d:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:p(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var l=new this._MapClass(a);i.padding&&l.setPadding(i.padding),r.cursor&&(l.getCanvas().style.cursor=r.cursor),this._createShadowTransform(l);var c=l._render;l._render=function(e){t._inRender=!0,c.call(l,e),t._inRender=!1};var f=l._renderTaskQueue.run;l._renderTaskQueue.run=function(e){f.call(l._renderTaskQueue,e),t._onBeforeRepaint()},l.on("render",(function(){return t._onAfterRepaint()}));var h=l.fire;for(var y in l.fire=this._fireEvent.bind(this,h),l.on("resize",(function(){t._renderTransform.resize(l.transform.width,l.transform.height)})),l.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(l.transform,t._renderTransform)})),l.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)l.on(y,this._onPointerEvent);for(var b in v)l.on(b,this._onCameraEvent);for(var E in g)l.on(E,this._onEvent);this._map=l},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var c=l(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),c&&t){var f=this._deferredEvents;f.move=!0,f.zoom||(f.zoom=o!==n.zoom),f.rotate||(f.rotate=i!==n.bearing),f.pitch||(f.pitch=a!==n.pitch)}return s||l(r.transform,e),c},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function x(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a},queryRenderedFeatures:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryRenderedFeatures(t,n);return r.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,c.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const w="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var L=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var S=n.createContext(null);function C(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],l=(0,n.useRef)(),f=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,c.Z)(L);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,l.current)),t||(t=new b(n.Map,e,l.current)),f.map=x(t),f.mapLib=n,u(t),null==a||a.onMapMount(f.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),w((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return f.map}),[s]);var p=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:l,style:p},s&&n.createElement(S.Provider,{value:f},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var P=r(3935),O=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function M(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!O.test(n)?r[n]=o+"px":r[n]=o}}}function T(e,t){var r=(0,n.useContext)(S),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,l,c,f,p,d,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,b=void 0!==y&&y,_=e.popup,E=void 0===_?null:_,x=e.rotation,w=void 0===x?0:x,L=e.rotationAlignment,C=void 0===L?"auto":L,O=e.pitchAlignment,T=void 0===O?"auto":O;return(0,n.useEffect)((function(){M(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),l=g,c=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,p=Array.isArray(l)?l[0]:l?l.x:0,d=Array.isArray(l)?l[1]:l?l.y:0,c!==p||f!==d)&&s.setOffset(g),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==w&&s.setRotation(w),s.getRotationAlignment()!==C&&s.setRotationAlignment(C),s.getPitchAlignment()!==T&&s.setPitchAlignment(T),s.getPopup()!==E&&s.setPopup(E),(0,P.createPortal)(e.children,s.getElement())}const j=(0,n.memo)((0,n.forwardRef)(T));function R(e){return new Set(e?e.trim().split(/\s+/):[])}function k(e,t){var r=(0,n.useContext)(S),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var l=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return l.on("close",e),l.setDOMContent(s).addTo(o.getMap()),function(){l.off("close",e),l.isOpen()&&l.remove()}}),[]),(0,n.useEffect)((function(){M(l.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return l}),[]),l.isOpen()&&(l.getLngLat().lng===e.longitude&&l.getLngLat().lat===e.latitude||l.setLngLat([e.longitude,e.latitude]),e.offset&&!i(l.options.offset,e.offset)&&l.setOffset(e.offset),l.options.anchor===e.anchor&&l.options.maxWidth===e.maxWidth||(l.options.anchor=e.anchor,l.setMaxWidth(e.maxWidth)),l.options.className!==e.className)){for(var f,p=R(l.options.className),d=R(e.className),m=(0,c.Z)(p);!(f=m()).done;){var v=f.value;d.has(v)||l.removeClassName(v)}for(var g,h=(0,c.Z)(d);!(g=h()).done;){var y=g.value;p.has(y)||l.addClassName(y)}l.options.className=e.className}return(0,P.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(k));const Z=function(e,t,r,o){var a=(0,n.useContext)(S),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function I(e){var t=Z((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){M(t._controlContainer,e.style)}),[e.style]),null}const N=(0,n.memo)(I);function A(e,t){var r=(0,n.useRef)({props:e}),o=Z((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){M(o._container,e.style)}),[e.style]),null}const D=(0,n.memo)((0,n.forwardRef)(A));function F(e){var t=Z((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){M(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(F);function B(e){var t=Z((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){M(t._container,a)}),[a]),null}const H=(0,n.memo)(B);function W(e,t){if(!e)throw new Error(t)}var q=0;const V=function(e){var t=(0,n.useContext)(S).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+q++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(W(r.id===n.id,"layer id changed"),W(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,l=r.filter,c=r.minzoom,f=r.maxzoom,p=r.beforeId;if(p!==n.beforeId&&e.moveLayer(t,p),a!==n.layout){var d=n.layout||{};for(var m in a)i(a[m],d[m])||e.setLayoutProperty(t,m,a[m]);for(var v in d)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(l,n.filter)||e.setFilter(t,l),c===n.minzoom&&f===n.maxzoom||e.setLayerZoomRange(t,c,f)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var G=0;const J=function(e){var t=(0,n.useContext)(S).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+G++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,c.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){W(t.id===r.id,"source id changed"),W(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return C(e,t,Q)})),Y=j,K=z,$=N,ee=U,te=D,re=H,ne=V,oe=J;const ae=X},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{r.d(t,{Zo:()=>c,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var u=n.createContext({}),l=function(e){var t=n.useContext(u),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},c=function(e){var t=l(e.components);return n.createElement(u.Provider,{value:t},e.children)},f="mdxType",p={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},d=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,c=s(e,["components","mdxType","originalType","parentName"]),f=l(r),d=o,m=f["".concat(u,".").concat(d)]||f[d]||p[d]||a;return r?n.createElement(m,i(i({ref:t},c),{},{components:r})):n.createElement(m,i({ref:t},c))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=d;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[f]="string"==typeof e?e:o,i[1]=s;for(var l=2;l{r.r(t),r.d(t,{assets:()=>y,contentTitle:()=>g,default:()=>x,frontMatter:()=>v,metadata:()=>h,toc:()=>b});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945));function u(){return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Highlight Features Containing Similar Data"),a.createElement("p",null,"Hover over counties to highlight counties that share the same name."),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/filter",target:"_new"},"View Code \u2197")))}const l=a.memo(u);var c={id:"counties",type:"fill","source-layer":"original",paint:{"fill-outline-color":"rgba(0,0,0,0.1)","fill-color":"rgba(0,0,0,0.1)"}},f={id:"counties-highlighted",type:"fill",source:"counties","source-layer":"original",paint:{"fill-outline-color":"#484896","fill-color":"#6e599f","fill-opacity":.75}},p="";function d(){var e=(0,a.useState)(null),t=e[0],r=e[1],o=(0,a.useCallback)((function(e){var t=e.features&&e.features[0];r({longitude:e.lngLat.lng,latitude:e.lngLat.lat,countyName:t&&t.properties.COUNTY})}),[]),i=t&&t.countyName||"",u=(0,a.useMemo)((function(){return["in","COUNTY",i]}),[i]);return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:{latitude:38.88,longitude:-98,zoom:3},minZoom:2,mapStyle:"mapbox://styles/mapbox/light-v9",mapboxAccessToken:p,onMouseMove:o,interactiveLayerIds:["counties"]},a.createElement(s.Hw,{type:"vector",url:"mapbox://mapbox.82pkq93d"},a.createElement(s.mh,(0,n.Z)({beforeId:"waterway-label"},c)),a.createElement(s.mh,(0,n.Z)({beforeId:"waterway-label"},f,{filter:u}))),i&&a.createElement(s.GI,{longitude:t.longitude,latitude:t.latitude,offset:[0,-10],closeButton:!1,className:"county-info"},i)),a.createElement(l,null))}var m=["components"],v={},g="Highlight By Filter",h={unversionedId:"filter",id:"filter",title:"Highlight By Filter",description:"",source:"@site/src/examples/filter.mdx",sourceDirName:".",slug:"/filter",permalink:"/react-map-gl/examples/filter",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Camera Transition",permalink:"/react-map-gl/examples/viewport-animation"},next:{title:"Zoom to Bounds",permalink:"/react-map-gl/examples/zoom-to-bounds"}},y={},b=[],_={toc:b},E="wrapper";function x(e){var t=e.components,r=(0,o.Z)(e,m);return(0,i.kt)(E,(0,n.Z)({},_,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"highlight-by-filter"},"Highlight By Filter"),(0,i.kt)(d,{mdxType:"App"}))}x.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>Y,Pv:()=>ee,GI:()=>K,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>Z});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?d:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:p(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var l=new this._MapClass(a);i.padding&&l.setPadding(i.padding),r.cursor&&(l.getCanvas().style.cursor=r.cursor),this._createShadowTransform(l);var c=l._render;l._render=function(e){t._inRender=!0,c.call(l,e),t._inRender=!1};var f=l._renderTaskQueue.run;l._renderTaskQueue.run=function(e){f.call(l._renderTaskQueue,e),t._onBeforeRepaint()},l.on("render",(function(){return t._onAfterRepaint()}));var h=l.fire;for(var y in l.fire=this._fireEvent.bind(this,h),l.on("resize",(function(){t._renderTransform.resize(l.transform.width,l.transform.height)})),l.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(l.transform,t._renderTransform)})),l.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)l.on(y,this._onPointerEvent);for(var b in v)l.on(b,this._onCameraEvent);for(var E in g)l.on(E,this._onEvent);this._map=l},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var c=l(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),c&&t){var f=this._deferredEvents;f.move=!0,f.zoom||(f.zoom=o!==n.zoom),f.rotate||(f.rotate=i!==n.bearing),f.pitch||(f.pitch=a!==n.pitch)}return s||l(r.transform,e),c},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function x(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,c.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const w="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var L=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var S=n.createContext(null);function C(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],l=(0,n.useRef)(),f=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,c.Z)(L);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,l.current)),t||(t=new b(n.Map,e,l.current)),f.map=x(t),f.mapLib=n,u(t),null==a||a.onMapMount(f.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),w((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return f.map}),[s]);var p=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:l,style:p},s&&n.createElement(S.Provider,{value:f},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var P=r(3935),O=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function M(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!O.test(n)?r[n]=o+"px":r[n]=o}}}function T(e,t){var r=(0,n.useContext)(S),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,l,c,f,p,d,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,b=void 0!==y&&y,_=e.popup,E=void 0===_?null:_,x=e.rotation,w=void 0===x?0:x,L=e.rotationAlignment,C=void 0===L?"auto":L,O=e.pitchAlignment,T=void 0===O?"auto":O;return(0,n.useEffect)((function(){M(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),l=g,c=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,p=Array.isArray(l)?l[0]:l?l.x:0,d=Array.isArray(l)?l[1]:l?l.y:0,c!==p||f!==d)&&s.setOffset(g),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==w&&s.setRotation(w),s.getRotationAlignment()!==C&&s.setRotationAlignment(C),s.getPitchAlignment()!==T&&s.setPitchAlignment(T),s.getPopup()!==E&&s.setPopup(E),(0,P.createPortal)(e.children,s.getElement())}const j=(0,n.memo)((0,n.forwardRef)(T));function k(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var r=(0,n.useContext)(S),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var l=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return l.on("close",e),l.setDOMContent(s).addTo(o.getMap()),function(){l.off("close",e),l.isOpen()&&l.remove()}}),[]),(0,n.useEffect)((function(){M(l.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return l}),[]),l.isOpen()&&(l.getLngLat().lng===e.longitude&&l.getLngLat().lat===e.latitude||l.setLngLat([e.longitude,e.latitude]),e.offset&&!i(l.options.offset,e.offset)&&l.setOffset(e.offset),l.options.anchor===e.anchor&&l.options.maxWidth===e.maxWidth||(l.options.anchor=e.anchor,l.setMaxWidth(e.maxWidth)),l.options.className!==e.className)){for(var f,p=k(l.options.className),d=k(e.className),m=(0,c.Z)(p);!(f=m()).done;){var v=f.value;d.has(v)||l.removeClassName(v)}for(var g,h=(0,c.Z)(d);!(g=h()).done;){var y=g.value;p.has(y)||l.addClassName(y)}l.options.className=e.className}return(0,P.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(R));const Z=function(e,t,r,o){var a=(0,n.useContext)(S),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function I(e){var t=Z((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){M(t._controlContainer,e.style)}),[e.style]),null}const N=(0,n.memo)(I);function A(e,t){var r=(0,n.useRef)({props:e}),o=Z((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){M(o._container,e.style)}),[e.style]),null}const D=(0,n.memo)((0,n.forwardRef)(A));function F(e){var t=Z((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){M(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(F);function B(e){var t=Z((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){M(t._container,a)}),[a]),null}const H=(0,n.memo)(B);function W(e,t){if(!e)throw new Error(t)}var q=0;const V=function(e){var t=(0,n.useContext)(S).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+q++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(W(r.id===n.id,"layer id changed"),W(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,l=r.filter,c=r.minzoom,f=r.maxzoom,p=r.beforeId;if(p!==n.beforeId&&e.moveLayer(t,p),a!==n.layout){var d=n.layout||{};for(var m in a)i(a[m],d[m])||e.setLayoutProperty(t,m,a[m]);for(var v in d)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(l,n.filter)||e.setFilter(t,l),c===n.minzoom&&f===n.maxzoom||e.setLayerZoomRange(t,c,f)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var G=0;const J=function(e){var t=(0,n.useContext)(S).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+G++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,c.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){W(t.id===r.id,"source id changed"),W(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return C(e,t,Q)})),Y=j,K=z,$=N,ee=U,te=D,re=H,ne=V,oe=J;const ae=X},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{r.r(t),r.d(t,{assets:()=>w,contentTitle:()=>_,default:()=>k,frontMatter:()=>b,metadata:()=>x,toc:()=>S});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945)),l=r(1478);function u(e){var t=[1/0,1/0,-1/0,-1/0];return(0,l.pZ)(e,(function(e){t[0]>e[0]&&(t[0]=e[0]),t[1]>e[1]&&(t[1]=e[1]),t[2]{r.d(t,{ot:()=>Y,$j:()=>te,mh:()=>ne,D5:()=>Q,Jx:()=>X,Pv:()=>ee,GI:()=>K,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>Z});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?f:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:d(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var l=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=l,r.gl}}var u=new this._MapClass(a);i.padding&&u.setPadding(i.padding),r.cursor&&(u.getCanvas().style.cursor=r.cursor),this._createShadowTransform(u);var c=u._render;u._render=function(e){t._inRender=!0,c.call(u,e),t._inRender=!1};var p=u._renderTaskQueue.run;u._renderTaskQueue.run=function(e){p.call(u._renderTaskQueue,e),t._onBeforeRepaint()},u.on("render",(function(){return t._onAfterRepaint()}));var h=u.fire;for(var g in u.fire=this._fireEvent.bind(this,h),u.on("resize",(function(){t._renderTransform.resize(u.transform.width,u.transform.height)})),u.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(u.transform,t._renderTransform)})),u.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)u.on(g,this._onPointerEvent);for(var b in v)u.on(b,this._onCameraEvent);for(var x in y)u.on(x,this._onEvent);this._map=u},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var c=u(n,Object.assign({},l(r.transform),e));if(s&&(n.cameraElevationReference="ground"),c&&t){var p=this._deferredEvents;p.move=!0,p.zoom||(p.zoom=o!==n.zoom),p.rotate||(p.rotate=i!==n.bearing),p.pitch||(p.pitch=a!==n.pitch)}return s||u(r.transform,e),c},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=l(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var x=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function w(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,c.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||x.includes(a)||(n[a]=r[a].bind(r))}return n}const S="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var L=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var E=n.createContext(null);function k(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],l=i[1],u=(0,n.useRef)(),p=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,c.Z)(L);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,u.current)),t||(t=new b(n.Map,e,u.current)),p.map=w(t),p.mapLib=n,l(t),null==a||a.onMapMount(p.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),S((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return p.map}),[s]);var d=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:u,style:d},s&&n.createElement(E.Provider,{value:p},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var C=r(3935),M=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function P(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!M.test(n)?r[n]=o+"px":r[n]=o}}}function z(e,t){var r=(0,n.useContext)(E),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var l,u,c,p,d,f,m=e.longitude,v=e.latitude,y=e.offset,h=e.style,g=e.draggable,b=void 0!==g&&g,_=e.popup,x=void 0===_?null:_,w=e.rotation,S=void 0===w?0:w,L=e.rotationAlignment,k=void 0===L?"auto":L,M=e.pitchAlignment,z=void 0===M?"auto":M;return(0,n.useEffect)((function(){P(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),y&&(l=s.getOffset(),u=y,c=Array.isArray(l)?l[0]:l?l.x:0,p=Array.isArray(l)?l[1]:l?l.y:0,d=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,c!==d||p!==f)&&s.setOffset(y),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==S&&s.setRotation(S),s.getRotationAlignment()!==k&&s.setRotationAlignment(k),s.getPitchAlignment()!==z&&s.setPitchAlignment(z),s.getPopup()!==x&&s.setPopup(x),(0,C.createPortal)(e.children,s.getElement())}const j=(0,n.memo)((0,n.forwardRef)(z));function T(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var r=(0,n.useContext)(E),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),l=(0,n.useRef)({props:e});l.current.props=e;var u=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==l.current.props.onOpen||l.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==l.current.props.onClose||l.current.props.onClose(e)};return u.on("close",e),u.setDOMContent(s).addTo(o.getMap()),function(){u.off("close",e),u.isOpen()&&u.remove()}}),[]),(0,n.useEffect)((function(){P(u.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return u}),[]),u.isOpen()&&(u.getLngLat().lng===e.longitude&&u.getLngLat().lat===e.latitude||u.setLngLat([e.longitude,e.latitude]),e.offset&&!i(u.options.offset,e.offset)&&u.setOffset(e.offset),u.options.anchor===e.anchor&&u.options.maxWidth===e.maxWidth||(u.options.anchor=e.anchor,u.setMaxWidth(e.maxWidth)),u.options.className!==e.className)){for(var p,d=T(u.options.className),f=T(e.className),m=(0,c.Z)(d);!(p=m()).done;){var v=p.value;f.has(v)||u.removeClassName(v)}for(var y,h=(0,c.Z)(f);!(y=h()).done;){var g=y.value;d.has(g)||u.addClassName(g)}u.options.className=e.className}return(0,C.createPortal)(e.children,s)}const O=(0,n.memo)((0,n.forwardRef)(R));const Z=function(e,t,r,o){var a=(0,n.useContext)(E),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,l=a.map;return l.hasControl(i)||(l.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),l.hasControl(i)&&l.removeControl(i)}}),[]),i};function A(e){var t=Z((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){P(t._controlContainer,e.style)}),[e.style]),null}const I=(0,n.memo)(A);function B(e,t){var r=(0,n.useRef)({props:e}),o=Z((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){P(o._container,e.style)}),[e.style]),null}const U=(0,n.memo)((0,n.forwardRef)(B));function N(e){var t=Z((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){P(t._container,e.style)}),[e.style]),null}const F=(0,n.memo)(N);function D(e){var t=Z((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){P(t._container,a)}),[a]),null}const H=(0,n.memo)(D);function W(e,t){if(!e)throw new Error(t)}var $=0;const V=function(e){var t=(0,n.useContext)(E).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+$++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(W(r.id===n.id,"layer id changed"),W(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,l=void 0===s?{}:s,u=r.filter,c=r.minzoom,p=r.maxzoom,d=r.beforeId;if(d!==n.beforeId&&e.moveLayer(t,d),a!==n.layout){var f=n.layout||{};for(var m in a)i(a[m],f[m])||e.setLayoutProperty(t,m,a[m]);for(var v in f)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(l!==n.paint){var y=n.paint||{};for(var h in l)i(l[h],y[h])||e.setPaintProperty(t,h,l[h]);for(var g in y)l.hasOwnProperty(g)||e.setPaintProperty(t,g,void 0)}i(u,n.filter)||e.setFilter(t,u),c===n.minzoom&&p===n.maxzoom||e.setLayerZoomRange(t,c,p)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var q=0;const G=function(e){var t=(0,n.useContext)(E).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+q++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,c.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){W(t.id===r.id,"source id changed"),W(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var J=r.e(8539).then(r.t.bind(r,8539,23)),Q=n.forwardRef((function(e,t){return k(e,t,J)})),X=j,K=O,Y=I,ee=F,te=U,re=H,ne=V,oe=G;const ae=Q},2853:e=>{e.exports=JSON.parse('{"version":8,"name":"Basic","metadata":{"mapbox:autocomposite":true},"sources":{"mapbox":{"url":"mapbox://mapbox.mapbox-streets-v7","type":"vector"}},"sprite":"mapbox://sprites/mapbox/basic-v8","glyphs":"mapbox://fonts/mapbox/{fontstack}/{range}.pbf","layers":[{"id":"background","type":"background","paint":{"background-color":"#dedede"},"interactive":true},{"id":"landuse_overlay_national_park","type":"fill","source":"mapbox","source-layer":"landuse_overlay","filter":["==","class","national_park"],"paint":{"fill-color":"#d2edae","fill-opacity":0.75},"interactive":true},{"id":"landuse_park","type":"fill","source":"mapbox","source-layer":"landuse","filter":["==","class","park"],"paint":{"fill-color":"#d2edae"},"interactive":true},{"id":"waterway","type":"line","source":"mapbox","source-layer":"waterway","filter":["all",["==","$type","LineString"],["in","class","river","canal"]],"paint":{"line-color":"#a0cfdf","line-width":{"base":1.4,"stops":[[8,0.5],[20,15]]}},"interactive":true},{"id":"water","type":"fill","source":"mapbox","source-layer":"water","paint":{"fill-color":"#a0cfdf"},"interactive":true},{"id":"building","type":"fill","source":"mapbox","source-layer":"building","paint":{"fill-color":"#d6d6d6"},"interactive":true},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","tunnel"]]],"type":"line","source":"mapbox","id":"tunnel_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]},"line-dasharray":[0.36,0.18]},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","tunnel"]]],"type":"line","source":"mapbox","id":"tunnel_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]},"line-dasharray":[0.28,0.14]},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["in","structure","none","ford"]]],"type":"line","source":"mapbox","id":"road_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["in","structure","none","ford"]]],"type":"line","source":"mapbox","id":"road_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_minor case","paint":{"line-color":"#dedede","line-width":{"base":1.6,"stops":[[12,0.5],[20,10]]},"line-gap-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_major case","paint":{"line-color":"#dedede","line-width":{"base":1.6,"stops":[[12,0.5],[20,10]]},"line-gap-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["<=","admin_level",2],["==","maritime",0]]],"type":"line","source":"mapbox","id":"admin_country","paint":{"line-color":"#8b8a8a","line-width":{"base":1.3,"stops":[[3,0.5],[22,15]]}},"source-layer":"admin"},{"interactive":true,"minzoom":5,"layout":{"icon-image":"{maki}-11","text-offset":[0,0.5],"text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-max-width":8,"text-anchor":"top","text-size":11,"icon-size":1},"filter":["all",["==","$type","Point"],["all",["==","scalerank",1],["==","localrank",1]]],"type":"symbol","source":"mapbox","id":"poi_label","paint":{"text-color":"#666","text-halo-width":1,"text-halo-color":"rgba(255,255,255,0.75)","text-halo-blur":1},"source-layer":"poi_label"},{"interactive":true,"layout":{"symbol-placement":"line","text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-transform":"uppercase","text-letter-spacing":0.1,"text-size":{"base":1.4,"stops":[[10,8],[20,14]]}},"filter":["all",["==","$type","LineString"],["in","class","motorway","primary","secondary","tertiary","trunk"]],"type":"symbol","source":"mapbox","id":"road_major_label","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":2},"source-layer":"road_label"},{"interactive":true,"minzoom":8,"layout":{"text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-max-width":6,"text-size":{"stops":[[6,12],[12,16]]}},"filter":["all",["==","$type","Point"],["in","type","town","village","hamlet","suburb","neighbourhood","island"]],"type":"symbol","source":"mapbox","id":"place_label_other","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"place_label"},{"interactive":true,"layout":{"text-field":"{name_en}","text-font":["Open Sans Bold","Arial Unicode MS Bold"],"text-max-width":10,"text-size":{"stops":[[3,12],[8,16]]}},"maxzoom":16,"filter":["all",["==","$type","Point"],["==","type","city"]],"type":"symbol","source":"mapbox","id":"place_label_city","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"place_label"},{"interactive":true,"layout":{"text-field":"{name_en}","text-font":["Open Sans Regular","Arial Unicode MS Regular"],"text-max-width":10,"text-size":{"stops":[[3,14],[8,22]]}},"maxzoom":12,"filter":["==","$type","Point"],"type":"symbol","source":"mapbox","id":"country_label","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"country_label"}]}')}}]); \ No newline at end of file diff --git a/assets/js/a53bf9a6.6acf0263.js b/assets/js/a53bf9a6.6acf0263.js new file mode 100644 index 00000000..47e1465c --- /dev/null +++ b/assets/js/a53bf9a6.6acf0263.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkreact_map_gl_website=self.webpackChunkreact_map_gl_website||[]).push([[8541],{1966:(e,t,r)=>{r.r(t),r.d(t,{assets:()=>w,contentTitle:()=>_,default:()=>k,frontMatter:()=>b,metadata:()=>x,toc:()=>S});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945)),l=r(1478);function u(e){var t=[1/0,1/0,-1/0,-1/0];return(0,l.pZ)(e,(function(e){t[0]>e[0]&&(t[0]=e[0]),t[1]>e[1]&&(t[1]=e[1]),t[2]{r.d(t,{ot:()=>Y,$j:()=>te,mh:()=>ne,D5:()=>Q,Jx:()=>X,Pv:()=>ee,GI:()=>K,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>Z});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?f:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:p(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var l=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=l,r.gl}}var u=new this._MapClass(a);i.padding&&u.setPadding(i.padding),r.cursor&&(u.getCanvas().style.cursor=r.cursor),this._createShadowTransform(u);var c=u._render;u._render=function(e){t._inRender=!0,c.call(u,e),t._inRender=!1};var d=u._renderTaskQueue.run;u._renderTaskQueue.run=function(e){d.call(u._renderTaskQueue,e),t._onBeforeRepaint()},u.on("render",(function(){return t._onAfterRepaint()}));var h=u.fire;for(var g in u.fire=this._fireEvent.bind(this,h),u.on("resize",(function(){t._renderTransform.resize(u.transform.width,u.transform.height)})),u.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(u.transform,t._renderTransform)})),u.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)u.on(g,this._onPointerEvent);for(var b in v)u.on(b,this._onCameraEvent);for(var x in y)u.on(x,this._onEvent);this._map=u},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var c=u(n,Object.assign({},l(r.transform),e));if(s&&(n.cameraElevationReference="ground"),c&&t){var d=this._deferredEvents;d.move=!0,d.zoom||(d.zoom=o!==n.zoom),d.rotate||(d.rotate=i!==n.bearing),d.pitch||(d.pitch=a!==n.pitch)}return s||u(r.transform,e),c},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=l(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var x=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function w(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a},queryRenderedFeatures:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryRenderedFeatures(t,n);return r.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,c.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||x.includes(a)||(n[a]=r[a].bind(r))}return n}const S="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var L=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var E=n.createContext(null);function k(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],l=i[1],u=(0,n.useRef)(),d=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,c.Z)(L);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,u.current)),t||(t=new b(n.Map,e,u.current)),d.map=w(t),d.mapLib=n,l(t),null==a||a.onMapMount(d.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),S((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return d.map}),[s]);var p=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:u,style:p},s&&n.createElement(E.Provider,{value:d},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var C=r(3935),M=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function P(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!M.test(n)?r[n]=o+"px":r[n]=o}}}function z(e,t){var r=(0,n.useContext)(E),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var l,u,c,d,p,f,m=e.longitude,v=e.latitude,y=e.offset,h=e.style,g=e.draggable,b=void 0!==g&&g,_=e.popup,x=void 0===_?null:_,w=e.rotation,S=void 0===w?0:w,L=e.rotationAlignment,k=void 0===L?"auto":L,M=e.pitchAlignment,z=void 0===M?"auto":M;return(0,n.useEffect)((function(){P(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),y&&(l=s.getOffset(),u=y,c=Array.isArray(l)?l[0]:l?l.x:0,d=Array.isArray(l)?l[1]:l?l.y:0,p=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,c!==p||d!==f)&&s.setOffset(y),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==S&&s.setRotation(S),s.getRotationAlignment()!==k&&s.setRotationAlignment(k),s.getPitchAlignment()!==z&&s.setPitchAlignment(z),s.getPopup()!==x&&s.setPopup(x),(0,C.createPortal)(e.children,s.getElement())}const j=(0,n.memo)((0,n.forwardRef)(z));function T(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var r=(0,n.useContext)(E),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),l=(0,n.useRef)({props:e});l.current.props=e;var u=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==l.current.props.onOpen||l.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==l.current.props.onClose||l.current.props.onClose(e)};return u.on("close",e),u.setDOMContent(s).addTo(o.getMap()),function(){u.off("close",e),u.isOpen()&&u.remove()}}),[]),(0,n.useEffect)((function(){P(u.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return u}),[]),u.isOpen()&&(u.getLngLat().lng===e.longitude&&u.getLngLat().lat===e.latitude||u.setLngLat([e.longitude,e.latitude]),e.offset&&!i(u.options.offset,e.offset)&&u.setOffset(e.offset),u.options.anchor===e.anchor&&u.options.maxWidth===e.maxWidth||(u.options.anchor=e.anchor,u.setMaxWidth(e.maxWidth)),u.options.className!==e.className)){for(var d,p=T(u.options.className),f=T(e.className),m=(0,c.Z)(p);!(d=m()).done;){var v=d.value;f.has(v)||u.removeClassName(v)}for(var y,h=(0,c.Z)(f);!(y=h()).done;){var g=y.value;p.has(g)||u.addClassName(g)}u.options.className=e.className}return(0,C.createPortal)(e.children,s)}const O=(0,n.memo)((0,n.forwardRef)(R));const Z=function(e,t,r,o){var a=(0,n.useContext)(E),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,l=a.map;return l.hasControl(i)||(l.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),l.hasControl(i)&&l.removeControl(i)}}),[]),i};function A(e){var t=Z((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){P(t._controlContainer,e.style)}),[e.style]),null}const I=(0,n.memo)(A);function B(e,t){var r=(0,n.useRef)({props:e}),o=Z((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){P(o._container,e.style)}),[e.style]),null}const F=(0,n.memo)((0,n.forwardRef)(B));function U(e){var t=Z((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){P(t._container,e.style)}),[e.style]),null}const N=(0,n.memo)(U);function D(e){var t=Z((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){P(t._container,a)}),[a]),null}const H=(0,n.memo)(D);function W(e,t){if(!e)throw new Error(t)}var $=0;const q=function(e){var t=(0,n.useContext)(E).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+$++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(W(r.id===n.id,"layer id changed"),W(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,l=void 0===s?{}:s,u=r.filter,c=r.minzoom,d=r.maxzoom,p=r.beforeId;if(p!==n.beforeId&&e.moveLayer(t,p),a!==n.layout){var f=n.layout||{};for(var m in a)i(a[m],f[m])||e.setLayoutProperty(t,m,a[m]);for(var v in f)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(l!==n.paint){var y=n.paint||{};for(var h in l)i(l[h],y[h])||e.setPaintProperty(t,h,l[h]);for(var g in y)l.hasOwnProperty(g)||e.setPaintProperty(t,g,void 0)}i(u,n.filter)||e.setFilter(t,u),c===n.minzoom&&d===n.maxzoom||e.setLayerZoomRange(t,c,d)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var V=0;const G=function(e){var t=(0,n.useContext)(E).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+V++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,c.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){W(t.id===r.id,"source id changed"),W(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var J=r.e(8539).then(r.t.bind(r,8539,23)),Q=n.forwardRef((function(e,t){return k(e,t,J)})),X=j,K=O,Y=I,ee=N,te=F,re=H,ne=q,oe=G;const ae=Q},2853:e=>{e.exports=JSON.parse('{"version":8,"name":"Basic","metadata":{"mapbox:autocomposite":true},"sources":{"mapbox":{"url":"mapbox://mapbox.mapbox-streets-v7","type":"vector"}},"sprite":"mapbox://sprites/mapbox/basic-v8","glyphs":"mapbox://fonts/mapbox/{fontstack}/{range}.pbf","layers":[{"id":"background","type":"background","paint":{"background-color":"#dedede"},"interactive":true},{"id":"landuse_overlay_national_park","type":"fill","source":"mapbox","source-layer":"landuse_overlay","filter":["==","class","national_park"],"paint":{"fill-color":"#d2edae","fill-opacity":0.75},"interactive":true},{"id":"landuse_park","type":"fill","source":"mapbox","source-layer":"landuse","filter":["==","class","park"],"paint":{"fill-color":"#d2edae"},"interactive":true},{"id":"waterway","type":"line","source":"mapbox","source-layer":"waterway","filter":["all",["==","$type","LineString"],["in","class","river","canal"]],"paint":{"line-color":"#a0cfdf","line-width":{"base":1.4,"stops":[[8,0.5],[20,15]]}},"interactive":true},{"id":"water","type":"fill","source":"mapbox","source-layer":"water","paint":{"fill-color":"#a0cfdf"},"interactive":true},{"id":"building","type":"fill","source":"mapbox","source-layer":"building","paint":{"fill-color":"#d6d6d6"},"interactive":true},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","tunnel"]]],"type":"line","source":"mapbox","id":"tunnel_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]},"line-dasharray":[0.36,0.18]},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","tunnel"]]],"type":"line","source":"mapbox","id":"tunnel_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]},"line-dasharray":[0.28,0.14]},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["in","structure","none","ford"]]],"type":"line","source":"mapbox","id":"road_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["in","structure","none","ford"]]],"type":"line","source":"mapbox","id":"road_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_minor case","paint":{"line-color":"#dedede","line-width":{"base":1.6,"stops":[[12,0.5],[20,10]]},"line-gap-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_major case","paint":{"line-color":"#dedede","line-width":{"base":1.6,"stops":[[12,0.5],[20,10]]},"line-gap-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["<=","admin_level",2],["==","maritime",0]]],"type":"line","source":"mapbox","id":"admin_country","paint":{"line-color":"#8b8a8a","line-width":{"base":1.3,"stops":[[3,0.5],[22,15]]}},"source-layer":"admin"},{"interactive":true,"minzoom":5,"layout":{"icon-image":"{maki}-11","text-offset":[0,0.5],"text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-max-width":8,"text-anchor":"top","text-size":11,"icon-size":1},"filter":["all",["==","$type","Point"],["all",["==","scalerank",1],["==","localrank",1]]],"type":"symbol","source":"mapbox","id":"poi_label","paint":{"text-color":"#666","text-halo-width":1,"text-halo-color":"rgba(255,255,255,0.75)","text-halo-blur":1},"source-layer":"poi_label"},{"interactive":true,"layout":{"symbol-placement":"line","text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-transform":"uppercase","text-letter-spacing":0.1,"text-size":{"base":1.4,"stops":[[10,8],[20,14]]}},"filter":["all",["==","$type","LineString"],["in","class","motorway","primary","secondary","tertiary","trunk"]],"type":"symbol","source":"mapbox","id":"road_major_label","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":2},"source-layer":"road_label"},{"interactive":true,"minzoom":8,"layout":{"text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-max-width":6,"text-size":{"stops":[[6,12],[12,16]]}},"filter":["all",["==","$type","Point"],["in","type","town","village","hamlet","suburb","neighbourhood","island"]],"type":"symbol","source":"mapbox","id":"place_label_other","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"place_label"},{"interactive":true,"layout":{"text-field":"{name_en}","text-font":["Open Sans Bold","Arial Unicode MS Bold"],"text-max-width":10,"text-size":{"stops":[[3,12],[8,16]]}},"maxzoom":16,"filter":["all",["==","$type","Point"],["==","type","city"]],"type":"symbol","source":"mapbox","id":"place_label_city","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"place_label"},{"interactive":true,"layout":{"text-field":"{name_en}","text-font":["Open Sans Regular","Arial Unicode MS Regular"],"text-max-width":10,"text-size":{"stops":[[3,14],[8,22]]}},"maxzoom":12,"filter":["==","$type","Point"],"type":"symbol","source":"mapbox","id":"country_label","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"country_label"}]}')}}]); \ No newline at end of file diff --git a/assets/js/a60670d2.155b6fc0.js b/assets/js/a60670d2.155b6fc0.js new file mode 100644 index 00000000..7ea596f8 --- /dev/null +++ b/assets/js/a60670d2.155b6fc0.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkreact_map_gl_website=self.webpackChunkreact_map_gl_website||[]).push([[6181],{3905:(e,t,r)=>{r.d(t,{Zo:()=>l,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var u=n.createContext({}),c=function(e){var t=n.useContext(u),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},l=function(e){var t=c(e.components);return n.createElement(u.Provider,{value:t},e.children)},f="mdxType",p={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},d=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,l=s(e,["components","mdxType","originalType","parentName"]),f=c(r),d=o,m=f["".concat(u,".").concat(d)]||f[d]||p[d]||a;return r?n.createElement(m,i(i({ref:t},l),{},{components:r})):n.createElement(m,i({ref:t},l))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=d;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[f]="string"==typeof e?e:o,i[1]=s;for(var c=2;c{r.r(t),r.d(t,{assets:()=>h,contentTitle:()=>v,default:()=>E,frontMatter:()=>m,metadata:()=>g,toc:()=>y});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945));function u(){return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Animated GeoJSON"),a.createElement("p",null,"Render animation by updating GeoJSON data source."),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/geojson-animation",target:"_new"},"View Code \u2197")))}const c=a.memo(u);var l="",f={id:"point",type:"circle",paint:{"circle-radius":10,"circle-color":"#007cbf"}};function p(){var e=(0,a.useState)(null),t=e[0],r=e[1];return(0,a.useEffect)((function(){var e=window.requestAnimationFrame((function(){return r((e={center:[-100,0],angle:Date.now()/1e3,radius:20},t=e.center,n=e.angle,o=e.radius,{type:"Point",coordinates:[t[0]+Math.cos(n)*o,t[1]+Math.sin(n)*o]}));var e,t,n,o}));return function(){return window.cancelAnimationFrame(e)}})),a.createElement(a.Fragment,null,a.createElement(s.D5,{initialViewState:{latitude:0,longitude:-100,zoom:3},mapStyle:"mapbox://styles/mapbox/light-v9",mapboxAccessToken:l},t&&a.createElement(s.Hw,{type:"geojson",data:t},a.createElement(s.mh,f))),a.createElement(c,null))}var d=["components"],m={},v="GeoJSON Animation",g={unversionedId:"geojson-animation",id:"geojson-animation",title:"GeoJSON Animation",description:"",source:"@site/src/examples/geojson-animation.mdx",sourceDirName:".",slug:"/geojson-animation",permalink:"/react-map-gl/examples/geojson-animation",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"GeoJSON",permalink:"/react-map-gl/examples/geojson"},next:{title:"Clusters",permalink:"/react-map-gl/examples/clusters"}},h={},y=[],b={toc:y},_="wrapper";function E(e){var t=e.components,r=(0,o.Z)(e,d);return(0,i.kt)(_,(0,n.Z)({},b,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"geojson-animation"},"GeoJSON Animation"),(0,i.kt)(p,{mdxType:"App"}))}E.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>K,Pv:()=>ee,GI:()=>Y,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>A});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?d:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:p(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var c=new this._MapClass(a);i.padding&&c.setPadding(i.padding),r.cursor&&(c.getCanvas().style.cursor=r.cursor),this._createShadowTransform(c);var l=c._render;c._render=function(e){t._inRender=!0,l.call(c,e),t._inRender=!1};var f=c._renderTaskQueue.run;c._renderTaskQueue.run=function(e){f.call(c._renderTaskQueue,e),t._onBeforeRepaint()},c.on("render",(function(){return t._onAfterRepaint()}));var h=c.fire;for(var y in c.fire=this._fireEvent.bind(this,h),c.on("resize",(function(){t._renderTransform.resize(c.transform.width,c.transform.height)})),c.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(c.transform,t._renderTransform)})),c.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)c.on(y,this._onPointerEvent);for(var b in v)c.on(b,this._onCameraEvent);for(var E in g)c.on(E,this._onEvent);this._map=c},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var l=c(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),l&&t){var f=this._deferredEvents;f.move=!0,f.zoom||(f.zoom=o!==n.zoom),f.rotate||(f.rotate=i!==n.bearing),f.pitch||(f.pitch=a!==n.pitch)}return s||c(r.transform,e),l},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function w(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a},queryRenderedFeatures:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryRenderedFeatures(t,n);return r.transform=o,a}},o=(0,l.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,l.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const x="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var S=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var L=n.createContext(null);function P(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],c=(0,n.useRef)(),f=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,l.Z)(S);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,c.current)),t||(t=new b(n.Map,e,c.current)),f.map=w(t),f.mapLib=n,u(t),null==a||a.onMapMount(f.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),x((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return f.map}),[s]);var p=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:c,style:p},s&&n.createElement(L.Provider,{value:f},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var O=r(3935),C=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function j(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!C.test(n)?r[n]=o+"px":r[n]=o}}}function M(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,c,l,f,p,d,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,b=void 0!==y&&y,_=e.popup,E=void 0===_?null:_,w=e.rotation,x=void 0===w?0:w,S=e.rotationAlignment,P=void 0===S?"auto":S,C=e.pitchAlignment,M=void 0===C?"auto":C;return(0,n.useEffect)((function(){j(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),c=g,l=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,p=Array.isArray(c)?c[0]:c?c.x:0,d=Array.isArray(c)?c[1]:c?c.y:0,l!==p||f!==d)&&s.setOffset(g),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==x&&s.setRotation(x),s.getRotationAlignment()!==P&&s.setRotationAlignment(P),s.getPitchAlignment()!==M&&s.setPitchAlignment(M),s.getPopup()!==E&&s.setPopup(E),(0,O.createPortal)(e.children,s.getElement())}const T=(0,n.memo)((0,n.forwardRef)(M));function R(e){return new Set(e?e.trim().split(/\s+/):[])}function k(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var c=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return c.on("close",e),c.setDOMContent(s).addTo(o.getMap()),function(){c.off("close",e),c.isOpen()&&c.remove()}}),[]),(0,n.useEffect)((function(){j(c.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return c}),[]),c.isOpen()&&(c.getLngLat().lng===e.longitude&&c.getLngLat().lat===e.latitude||c.setLngLat([e.longitude,e.latitude]),e.offset&&!i(c.options.offset,e.offset)&&c.setOffset(e.offset),c.options.anchor===e.anchor&&c.options.maxWidth===e.maxWidth||(c.options.anchor=e.anchor,c.setMaxWidth(e.maxWidth)),c.options.className!==e.className)){for(var f,p=R(c.options.className),d=R(e.className),m=(0,l.Z)(p);!(f=m()).done;){var v=f.value;d.has(v)||c.removeClassName(v)}for(var g,h=(0,l.Z)(d);!(g=h()).done;){var y=g.value;p.has(y)||c.addClassName(y)}c.options.className=e.className}return(0,O.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(k));const A=function(e,t,r,o){var a=(0,n.useContext)(L),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function Z(e){var t=A((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){j(t._controlContainer,e.style)}),[e.style]),null}const I=(0,n.memo)(Z);function N(e,t){var r=(0,n.useRef)({props:e}),o=A((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){j(o._container,e.style)}),[e.style]),null}const D=(0,n.memo)((0,n.forwardRef)(N));function F(e){var t=A((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){j(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(F);function B(e){var t=A((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){j(t._container,a)}),[a]),null}const W=(0,n.memo)(B);function H(e,t){if(!e)throw new Error(t)}var G=0;const q=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+G++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(H(r.id===n.id,"layer id changed"),H(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,c=r.filter,l=r.minzoom,f=r.maxzoom,p=r.beforeId;if(p!==n.beforeId&&e.moveLayer(t,p),a!==n.layout){var d=n.layout||{};for(var m in a)i(a[m],d[m])||e.setLayoutProperty(t,m,a[m]);for(var v in d)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(c,n.filter)||e.setFilter(t,c),l===n.minzoom&&f===n.maxzoom||e.setLayerZoomRange(t,l,f)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var J=0;const V=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+J++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,l.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){H(t.id===r.id,"source id changed"),H(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return P(e,t,Q)})),K=T,Y=z,$=I,ee=U,te=D,re=W,ne=q,oe=V;const ae=X},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{r.d(t,{Zo:()=>l,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var u=n.createContext({}),c=function(e){var t=n.useContext(u),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},l=function(e){var t=c(e.components);return n.createElement(u.Provider,{value:t},e.children)},f="mdxType",p={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},d=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,l=s(e,["components","mdxType","originalType","parentName"]),f=c(r),d=o,m=f["".concat(u,".").concat(d)]||f[d]||p[d]||a;return r?n.createElement(m,i(i({ref:t},l),{},{components:r})):n.createElement(m,i({ref:t},l))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=d;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[f]="string"==typeof e?e:o,i[1]=s;for(var c=2;c{r.r(t),r.d(t,{assets:()=>h,contentTitle:()=>v,default:()=>E,frontMatter:()=>m,metadata:()=>g,toc:()=>y});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945));function u(){return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Animated GeoJSON"),a.createElement("p",null,"Render animation by updating GeoJSON data source."),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/geojson-animation",target:"_new"},"View Code \u2197")))}const c=a.memo(u);var l="",f={id:"point",type:"circle",paint:{"circle-radius":10,"circle-color":"#007cbf"}};function p(){var e=(0,a.useState)(null),t=e[0],r=e[1];return(0,a.useEffect)((function(){var e=window.requestAnimationFrame((function(){return r((e={center:[-100,0],angle:Date.now()/1e3,radius:20},t=e.center,n=e.angle,o=e.radius,{type:"Point",coordinates:[t[0]+Math.cos(n)*o,t[1]+Math.sin(n)*o]}));var e,t,n,o}));return function(){return window.cancelAnimationFrame(e)}})),a.createElement(a.Fragment,null,a.createElement(s.D5,{initialViewState:{latitude:0,longitude:-100,zoom:3},mapStyle:"mapbox://styles/mapbox/light-v9",mapboxAccessToken:l},t&&a.createElement(s.Hw,{type:"geojson",data:t},a.createElement(s.mh,f))),a.createElement(c,null))}var d=["components"],m={},v="GeoJSON Animation",g={unversionedId:"geojson-animation",id:"geojson-animation",title:"GeoJSON Animation",description:"",source:"@site/src/examples/geojson-animation.mdx",sourceDirName:".",slug:"/geojson-animation",permalink:"/react-map-gl/examples/geojson-animation",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"GeoJSON",permalink:"/react-map-gl/examples/geojson"},next:{title:"Clusters",permalink:"/react-map-gl/examples/clusters"}},h={},y=[],b={toc:y},_="wrapper";function E(e){var t=e.components,r=(0,o.Z)(e,d);return(0,i.kt)(_,(0,n.Z)({},b,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"geojson-animation"},"GeoJSON Animation"),(0,i.kt)(p,{mdxType:"App"}))}E.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>K,Pv:()=>ee,GI:()=>Y,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>A});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?d:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:p(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var c=new this._MapClass(a);i.padding&&c.setPadding(i.padding),r.cursor&&(c.getCanvas().style.cursor=r.cursor),this._createShadowTransform(c);var l=c._render;c._render=function(e){t._inRender=!0,l.call(c,e),t._inRender=!1};var f=c._renderTaskQueue.run;c._renderTaskQueue.run=function(e){f.call(c._renderTaskQueue,e),t._onBeforeRepaint()},c.on("render",(function(){return t._onAfterRepaint()}));var h=c.fire;for(var y in c.fire=this._fireEvent.bind(this,h),c.on("resize",(function(){t._renderTransform.resize(c.transform.width,c.transform.height)})),c.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(c.transform,t._renderTransform)})),c.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)c.on(y,this._onPointerEvent);for(var b in v)c.on(b,this._onCameraEvent);for(var E in g)c.on(E,this._onEvent);this._map=c},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var l=c(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),l&&t){var f=this._deferredEvents;f.move=!0,f.zoom||(f.zoom=o!==n.zoom),f.rotate||(f.rotate=i!==n.bearing),f.pitch||(f.pitch=a!==n.pitch)}return s||c(r.transform,e),l},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function w(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a}},o=(0,l.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,l.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const x="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var S=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var L=n.createContext(null);function P(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],c=(0,n.useRef)(),f=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,l.Z)(S);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,c.current)),t||(t=new b(n.Map,e,c.current)),f.map=w(t),f.mapLib=n,u(t),null==a||a.onMapMount(f.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),x((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return f.map}),[s]);var p=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:c,style:p},s&&n.createElement(L.Provider,{value:f},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var O=r(3935),C=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function j(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!C.test(n)?r[n]=o+"px":r[n]=o}}}function M(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,c,l,f,p,d,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,b=void 0!==y&&y,_=e.popup,E=void 0===_?null:_,w=e.rotation,x=void 0===w?0:w,S=e.rotationAlignment,P=void 0===S?"auto":S,C=e.pitchAlignment,M=void 0===C?"auto":C;return(0,n.useEffect)((function(){j(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),c=g,l=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,p=Array.isArray(c)?c[0]:c?c.x:0,d=Array.isArray(c)?c[1]:c?c.y:0,l!==p||f!==d)&&s.setOffset(g),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==x&&s.setRotation(x),s.getRotationAlignment()!==P&&s.setRotationAlignment(P),s.getPitchAlignment()!==M&&s.setPitchAlignment(M),s.getPopup()!==E&&s.setPopup(E),(0,O.createPortal)(e.children,s.getElement())}const T=(0,n.memo)((0,n.forwardRef)(M));function R(e){return new Set(e?e.trim().split(/\s+/):[])}function k(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var c=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return c.on("close",e),c.setDOMContent(s).addTo(o.getMap()),function(){c.off("close",e),c.isOpen()&&c.remove()}}),[]),(0,n.useEffect)((function(){j(c.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return c}),[]),c.isOpen()&&(c.getLngLat().lng===e.longitude&&c.getLngLat().lat===e.latitude||c.setLngLat([e.longitude,e.latitude]),e.offset&&!i(c.options.offset,e.offset)&&c.setOffset(e.offset),c.options.anchor===e.anchor&&c.options.maxWidth===e.maxWidth||(c.options.anchor=e.anchor,c.setMaxWidth(e.maxWidth)),c.options.className!==e.className)){for(var f,p=R(c.options.className),d=R(e.className),m=(0,l.Z)(p);!(f=m()).done;){var v=f.value;d.has(v)||c.removeClassName(v)}for(var g,h=(0,l.Z)(d);!(g=h()).done;){var y=g.value;p.has(y)||c.addClassName(y)}c.options.className=e.className}return(0,O.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(k));const A=function(e,t,r,o){var a=(0,n.useContext)(L),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function Z(e){var t=A((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){j(t._controlContainer,e.style)}),[e.style]),null}const I=(0,n.memo)(Z);function N(e,t){var r=(0,n.useRef)({props:e}),o=A((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){j(o._container,e.style)}),[e.style]),null}const D=(0,n.memo)((0,n.forwardRef)(N));function F(e){var t=A((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){j(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(F);function B(e){var t=A((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){j(t._container,a)}),[a]),null}const W=(0,n.memo)(B);function H(e,t){if(!e)throw new Error(t)}var G=0;const J=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+G++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(H(r.id===n.id,"layer id changed"),H(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,c=r.filter,l=r.minzoom,f=r.maxzoom,p=r.beforeId;if(p!==n.beforeId&&e.moveLayer(t,p),a!==n.layout){var d=n.layout||{};for(var m in a)i(a[m],d[m])||e.setLayoutProperty(t,m,a[m]);for(var v in d)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(c,n.filter)||e.setFilter(t,c),l===n.minzoom&&f===n.maxzoom||e.setLayerZoomRange(t,l,f)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var q=0;const V=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+q++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,l.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){H(t.id===r.id,"source id changed"),H(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return P(e,t,Q)})),K=T,Y=z,$=I,ee=U,te=D,re=W,ne=J,oe=V;const ae=X},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{r.r(t),r.d(t,{assets:()=>S,contentTitle:()=>x,default:()=>C,frontMatter:()=>_,metadata:()=>w,toc:()=>E});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945)),l=r(3393),u=r(2853),c=(0,l.fromJS)(u),p=c.get("layers"),d=["labels","roads","buildings","parks","water","background"],f={background:/background/,water:/water/,parks:/park/,buildings:/building/,roads:/bridge|road|tunnel/,labels:/label|place|poi/},m={line:"line-color",fill:"fill-color",background:"background-color",symbol:"text-color"};function y(e){var t=(0,a.useState)({water:!0,parks:!0,buildings:!0,roads:!0,labels:!0,background:!0}),r=t[0],n=t[1],o=(0,a.useState)({water:"#DBE2E6",parks:"#E6EAE9",buildings:"#c0c0c8",roads:"#ffffff",labels:"#78888a",background:"#EBF0F0"}),i=o[0],s=o[1];(0,a.useEffect)((function(){e.onChange(function(e){var t=e.visibility,r=e.color,n=p.filter((function(e){var r=e.get("id");return d.every((function(e){return t[e]||!f[e].test(r)}))})).map((function(e){var t=e.get("id"),n=e.get("type"),o=d.find((function(e){return f[e].test(t)}));return o&&m[n]?e.setIn(["paint",m[n]],r[o]):e}));return c.set("layers",n)}({visibility:r,color:i}))}),[r,i]);return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Dynamic Styling"),a.createElement("p",null,"Dynamically show/hide map layers and change color with Immutable map style."),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/layers",target:"_new"},"View Code \u2197")),a.createElement("hr",null),d.map((function(e){return a.createElement("div",{key:e,className:"input"},a.createElement("label",null,e),a.createElement("input",{type:"checkbox",checked:r[e],onChange:function(t){return function(e,t){var o;n(Object.assign({},r,((o={})[e]=t,o)))}(e,t.target.checked)}}),a.createElement("input",{type:"color",value:i[e],disabled:!r[e],onChange:function(t){return function(e,t){var r;s(Object.assign({},i,((r={})[e]=t,r)))}(e,t.target.value)}}))})))}const v=a.memo(y);var g="";function h(){var e=(0,a.useState)(null),t=e[0],r=e[1];return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:{latitude:37.805,longitude:-122.447,zoom:15.5},mapStyle:t&&t.toJS(),styleDiffing:!0,mapboxAccessToken:g}),a.createElement(v,{onChange:r}))}var b=["components"],_={},x="Dynamic Styling",w={unversionedId:"layers",id:"layers",title:"Dynamic Styling",description:"",source:"@site/src/examples/layers.mdx",sourceDirName:".",slug:"/layers",permalink:"/react-map-gl/examples/layers",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"index",permalink:"/react-map-gl/examples/"},next:{title:"Markers, Popups and Controls",permalink:"/react-map-gl/examples/controls"}},S={},E=[],L={toc:E},k="wrapper";function C(e){var t=e.components,r=(0,o.Z)(e,b);return(0,i.kt)(k,(0,n.Z)({},L,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"dynamic-styling"},"Dynamic Styling"),(0,i.kt)(h,{mdxType:"App"}))}C.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>Y,$j:()=>te,mh:()=>ne,D5:()=>Q,Jx:()=>X,Pv:()=>ee,GI:()=>K,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>A});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?f:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:d(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var l=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=l,r.gl}}var u=new this._MapClass(a);i.padding&&u.setPadding(i.padding),r.cursor&&(u.getCanvas().style.cursor=r.cursor),this._createShadowTransform(u);var c=u._render;u._render=function(e){t._inRender=!0,c.call(u,e),t._inRender=!1};var p=u._renderTaskQueue.run;u._renderTaskQueue.run=function(e){p.call(u._renderTaskQueue,e),t._onBeforeRepaint()},u.on("render",(function(){return t._onAfterRepaint()}));var g=u.fire;for(var h in u.fire=this._fireEvent.bind(this,g),u.on("resize",(function(){t._renderTransform.resize(u.transform.width,u.transform.height)})),u.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(u.transform,t._renderTransform)})),u.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)u.on(h,this._onPointerEvent);for(var b in y)u.on(b,this._onCameraEvent);for(var x in v)u.on(x,this._onEvent);this._map=u},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var c=u(n,Object.assign({},l(r.transform),e));if(s&&(n.cameraElevationReference="ground"),c&&t){var p=this._deferredEvents;p.move=!0,p.zoom||(p.zoom=o!==n.zoom),p.rotate||(p.rotate=i!==n.bearing),p.pitch||(p.pitch=a!==n.pitch)}return s||u(r.transform,e),c},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=g;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in y&&("object"==typeof t&&(t.viewState=l(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var x=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function w(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,c.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||x.includes(a)||(n[a]=r[a].bind(r))}return n}const S="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var E=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var L=n.createContext(null);function k(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],l=i[1],u=(0,n.useRef)(),p=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,c.Z)(E);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,u.current)),t||(t=new b(n.Map,e,u.current)),p.map=w(t),p.mapLib=n,l(t),null==a||a.onMapMount(p.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),S((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return p.map}),[s]);var d=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:u,style:d},s&&n.createElement(L.Provider,{value:p},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var C=r(3935),M=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function P(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!M.test(n)?r[n]=o+"px":r[n]=o}}}function j(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var l,u,c,p,d,f,m=e.longitude,y=e.latitude,v=e.offset,g=e.style,h=e.draggable,b=void 0!==h&&h,_=e.popup,x=void 0===_?null:_,w=e.rotation,S=void 0===w?0:w,E=e.rotationAlignment,k=void 0===E?"auto":E,M=e.pitchAlignment,j=void 0===M?"auto":M;return(0,n.useEffect)((function(){P(s.getElement(),g)}),[g]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===y||s.setLngLat([m,y]),v&&(l=s.getOffset(),u=v,c=Array.isArray(l)?l[0]:l?l.x:0,p=Array.isArray(l)?l[1]:l?l.y:0,d=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,c!==d||p!==f)&&s.setOffset(v),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==S&&s.setRotation(S),s.getRotationAlignment()!==k&&s.setRotationAlignment(k),s.getPitchAlignment()!==j&&s.setPitchAlignment(j),s.getPopup()!==x&&s.setPopup(x),(0,C.createPortal)(e.children,s.getElement())}const z=(0,n.memo)((0,n.forwardRef)(j));function T(e){return new Set(e?e.trim().split(/\s+/):[])}function O(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),l=(0,n.useRef)({props:e});l.current.props=e;var u=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==l.current.props.onOpen||l.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==l.current.props.onClose||l.current.props.onClose(e)};return u.on("close",e),u.setDOMContent(s).addTo(o.getMap()),function(){u.off("close",e),u.isOpen()&&u.remove()}}),[]),(0,n.useEffect)((function(){P(u.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return u}),[]),u.isOpen()&&(u.getLngLat().lng===e.longitude&&u.getLngLat().lat===e.latitude||u.setLngLat([e.longitude,e.latitude]),e.offset&&!i(u.options.offset,e.offset)&&u.setOffset(e.offset),u.options.anchor===e.anchor&&u.options.maxWidth===e.maxWidth||(u.options.anchor=e.anchor,u.setMaxWidth(e.maxWidth)),u.options.className!==e.className)){for(var p,d=T(u.options.className),f=T(e.className),m=(0,c.Z)(d);!(p=m()).done;){var y=p.value;f.has(y)||u.removeClassName(y)}for(var v,g=(0,c.Z)(f);!(v=g()).done;){var h=v.value;d.has(h)||u.addClassName(h)}u.options.className=e.className}return(0,C.createPortal)(e.children,s)}const R=(0,n.memo)((0,n.forwardRef)(O));const A=function(e,t,r,o){var a=(0,n.useContext)(L),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,l=a.map;return l.hasControl(i)||(l.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),l.hasControl(i)&&l.removeControl(i)}}),[]),i};function I(e){var t=A((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){P(t._controlContainer,e.style)}),[e.style]),null}const Z=(0,n.memo)(I);function D(e,t){var r=(0,n.useRef)({props:e}),o=A((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){P(o._container,e.style)}),[e.style]),null}const U=(0,n.memo)((0,n.forwardRef)(D));function N(e){var t=A((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){P(t._container,e.style)}),[e.style]),null}const F=(0,n.memo)(N);function B(e){var t=A((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){P(t._container,a)}),[a]),null}const W=(0,n.memo)(B);function $(e,t){if(!e)throw new Error(t)}var H=0;const V=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+H++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if($(r.id===n.id,"layer id changed"),$(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,l=void 0===s?{}:s,u=r.filter,c=r.minzoom,p=r.maxzoom,d=r.beforeId;if(d!==n.beforeId&&e.moveLayer(t,d),a!==n.layout){var f=n.layout||{};for(var m in a)i(a[m],f[m])||e.setLayoutProperty(t,m,a[m]);for(var y in f)a.hasOwnProperty(y)||e.setLayoutProperty(t,y,void 0)}if(l!==n.paint){var v=n.paint||{};for(var g in l)i(l[g],v[g])||e.setPaintProperty(t,g,l[g]);for(var h in v)l.hasOwnProperty(h)||e.setPaintProperty(t,h,void 0)}i(u,n.filter)||e.setFilter(t,u),c===n.minzoom&&p===n.maxzoom||e.setLayerZoomRange(t,c,p)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var q=0;const J=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+q++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,c.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){$(t.id===r.id,"source id changed"),$(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var G=r.e(8539).then(r.t.bind(r,8539,23)),Q=n.forwardRef((function(e,t){return k(e,t,G)})),X=z,K=R,Y=Z,ee=F,te=U,re=W,ne=V,oe=J;const ae=Q},2853:e=>{e.exports=JSON.parse('{"version":8,"name":"Basic","metadata":{"mapbox:autocomposite":true},"sources":{"mapbox":{"url":"mapbox://mapbox.mapbox-streets-v7","type":"vector"}},"sprite":"mapbox://sprites/mapbox/basic-v8","glyphs":"mapbox://fonts/mapbox/{fontstack}/{range}.pbf","layers":[{"id":"background","type":"background","paint":{"background-color":"#dedede"},"interactive":true},{"id":"landuse_overlay_national_park","type":"fill","source":"mapbox","source-layer":"landuse_overlay","filter":["==","class","national_park"],"paint":{"fill-color":"#d2edae","fill-opacity":0.75},"interactive":true},{"id":"landuse_park","type":"fill","source":"mapbox","source-layer":"landuse","filter":["==","class","park"],"paint":{"fill-color":"#d2edae"},"interactive":true},{"id":"waterway","type":"line","source":"mapbox","source-layer":"waterway","filter":["all",["==","$type","LineString"],["in","class","river","canal"]],"paint":{"line-color":"#a0cfdf","line-width":{"base":1.4,"stops":[[8,0.5],[20,15]]}},"interactive":true},{"id":"water","type":"fill","source":"mapbox","source-layer":"water","paint":{"fill-color":"#a0cfdf"},"interactive":true},{"id":"building","type":"fill","source":"mapbox","source-layer":"building","paint":{"fill-color":"#d6d6d6"},"interactive":true},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","tunnel"]]],"type":"line","source":"mapbox","id":"tunnel_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]},"line-dasharray":[0.36,0.18]},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","tunnel"]]],"type":"line","source":"mapbox","id":"tunnel_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]},"line-dasharray":[0.28,0.14]},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["in","structure","none","ford"]]],"type":"line","source":"mapbox","id":"road_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["in","structure","none","ford"]]],"type":"line","source":"mapbox","id":"road_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_minor case","paint":{"line-color":"#dedede","line-width":{"base":1.6,"stops":[[12,0.5],[20,10]]},"line-gap-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_major case","paint":{"line-color":"#dedede","line-width":{"base":1.6,"stops":[[12,0.5],[20,10]]},"line-gap-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["<=","admin_level",2],["==","maritime",0]]],"type":"line","source":"mapbox","id":"admin_country","paint":{"line-color":"#8b8a8a","line-width":{"base":1.3,"stops":[[3,0.5],[22,15]]}},"source-layer":"admin"},{"interactive":true,"minzoom":5,"layout":{"icon-image":"{maki}-11","text-offset":[0,0.5],"text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-max-width":8,"text-anchor":"top","text-size":11,"icon-size":1},"filter":["all",["==","$type","Point"],["all",["==","scalerank",1],["==","localrank",1]]],"type":"symbol","source":"mapbox","id":"poi_label","paint":{"text-color":"#666","text-halo-width":1,"text-halo-color":"rgba(255,255,255,0.75)","text-halo-blur":1},"source-layer":"poi_label"},{"interactive":true,"layout":{"symbol-placement":"line","text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-transform":"uppercase","text-letter-spacing":0.1,"text-size":{"base":1.4,"stops":[[10,8],[20,14]]}},"filter":["all",["==","$type","LineString"],["in","class","motorway","primary","secondary","tertiary","trunk"]],"type":"symbol","source":"mapbox","id":"road_major_label","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":2},"source-layer":"road_label"},{"interactive":true,"minzoom":8,"layout":{"text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-max-width":6,"text-size":{"stops":[[6,12],[12,16]]}},"filter":["all",["==","$type","Point"],["in","type","town","village","hamlet","suburb","neighbourhood","island"]],"type":"symbol","source":"mapbox","id":"place_label_other","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"place_label"},{"interactive":true,"layout":{"text-field":"{name_en}","text-font":["Open Sans Bold","Arial Unicode MS Bold"],"text-max-width":10,"text-size":{"stops":[[3,12],[8,16]]}},"maxzoom":16,"filter":["all",["==","$type","Point"],["==","type","city"]],"type":"symbol","source":"mapbox","id":"place_label_city","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"place_label"},{"interactive":true,"layout":{"text-field":"{name_en}","text-font":["Open Sans Regular","Arial Unicode MS Regular"],"text-max-width":10,"text-size":{"stops":[[3,14],[8,22]]}},"maxzoom":12,"filter":["==","$type","Point"],"type":"symbol","source":"mapbox","id":"country_label","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"country_label"}]}')}}]); \ No newline at end of file diff --git a/assets/js/b12b2772.cf8799a9.js b/assets/js/b12b2772.cf8799a9.js new file mode 100644 index 00000000..c2524543 --- /dev/null +++ b/assets/js/b12b2772.cf8799a9.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkreact_map_gl_website=self.webpackChunkreact_map_gl_website||[]).push([[7572],{2854:(e,t,r)=>{r.r(t),r.d(t,{assets:()=>S,contentTitle:()=>x,default:()=>C,frontMatter:()=>_,metadata:()=>w,toc:()=>E});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945)),l=r(3393),u=r(2853),c=(0,l.fromJS)(u),p=c.get("layers"),d=["labels","roads","buildings","parks","water","background"],f={background:/background/,water:/water/,parks:/park/,buildings:/building/,roads:/bridge|road|tunnel/,labels:/label|place|poi/},m={line:"line-color",fill:"fill-color",background:"background-color",symbol:"text-color"};function y(e){var t=(0,a.useState)({water:!0,parks:!0,buildings:!0,roads:!0,labels:!0,background:!0}),r=t[0],n=t[1],o=(0,a.useState)({water:"#DBE2E6",parks:"#E6EAE9",buildings:"#c0c0c8",roads:"#ffffff",labels:"#78888a",background:"#EBF0F0"}),i=o[0],s=o[1];(0,a.useEffect)((function(){e.onChange(function(e){var t=e.visibility,r=e.color,n=p.filter((function(e){var r=e.get("id");return d.every((function(e){return t[e]||!f[e].test(r)}))})).map((function(e){var t=e.get("id"),n=e.get("type"),o=d.find((function(e){return f[e].test(t)}));return o&&m[n]?e.setIn(["paint",m[n]],r[o]):e}));return c.set("layers",n)}({visibility:r,color:i}))}),[r,i]);return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Dynamic Styling"),a.createElement("p",null,"Dynamically show/hide map layers and change color with Immutable map style."),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/layers",target:"_new"},"View Code \u2197")),a.createElement("hr",null),d.map((function(e){return a.createElement("div",{key:e,className:"input"},a.createElement("label",null,e),a.createElement("input",{type:"checkbox",checked:r[e],onChange:function(t){return function(e,t){var o;n(Object.assign({},r,((o={})[e]=t,o)))}(e,t.target.checked)}}),a.createElement("input",{type:"color",value:i[e],disabled:!r[e],onChange:function(t){return function(e,t){var r;s(Object.assign({},i,((r={})[e]=t,r)))}(e,t.target.value)}}))})))}const v=a.memo(y);var g="";function h(){var e=(0,a.useState)(null),t=e[0],r=e[1];return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:{latitude:37.805,longitude:-122.447,zoom:15.5},mapStyle:t&&t.toJS(),styleDiffing:!0,mapboxAccessToken:g}),a.createElement(v,{onChange:r}))}var b=["components"],_={},x="Dynamic Styling",w={unversionedId:"layers",id:"layers",title:"Dynamic Styling",description:"",source:"@site/src/examples/layers.mdx",sourceDirName:".",slug:"/layers",permalink:"/react-map-gl/examples/layers",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"index",permalink:"/react-map-gl/examples/"},next:{title:"Markers, Popups and Controls",permalink:"/react-map-gl/examples/controls"}},S={},E=[],L={toc:E},k="wrapper";function C(e){var t=e.components,r=(0,o.Z)(e,b);return(0,i.kt)(k,(0,n.Z)({},L,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"dynamic-styling"},"Dynamic Styling"),(0,i.kt)(h,{mdxType:"App"}))}C.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>Y,$j:()=>te,mh:()=>ne,D5:()=>Q,Jx:()=>X,Pv:()=>ee,GI:()=>K,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>A});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?f:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:d(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var l=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=l,r.gl}}var u=new this._MapClass(a);i.padding&&u.setPadding(i.padding),r.cursor&&(u.getCanvas().style.cursor=r.cursor),this._createShadowTransform(u);var c=u._render;u._render=function(e){t._inRender=!0,c.call(u,e),t._inRender=!1};var p=u._renderTaskQueue.run;u._renderTaskQueue.run=function(e){p.call(u._renderTaskQueue,e),t._onBeforeRepaint()},u.on("render",(function(){return t._onAfterRepaint()}));var g=u.fire;for(var h in u.fire=this._fireEvent.bind(this,g),u.on("resize",(function(){t._renderTransform.resize(u.transform.width,u.transform.height)})),u.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(u.transform,t._renderTransform)})),u.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)u.on(h,this._onPointerEvent);for(var b in y)u.on(b,this._onCameraEvent);for(var x in v)u.on(x,this._onEvent);this._map=u},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var c=u(n,Object.assign({},l(r.transform),e));if(s&&(n.cameraElevationReference="ground"),c&&t){var p=this._deferredEvents;p.move=!0,p.zoom||(p.zoom=o!==n.zoom),p.rotate||(p.rotate=i!==n.bearing),p.pitch||(p.pitch=a!==n.pitch)}return s||u(r.transform,e),c},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=g;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in y&&("object"==typeof t&&(t.viewState=l(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var x=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function w(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a},queryRenderedFeatures:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryRenderedFeatures(t,n);return r.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,c.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||x.includes(a)||(n[a]=r[a].bind(r))}return n}const S="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var E=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var L=n.createContext(null);function k(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],l=i[1],u=(0,n.useRef)(),p=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,c.Z)(E);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,u.current)),t||(t=new b(n.Map,e,u.current)),p.map=w(t),p.mapLib=n,l(t),null==a||a.onMapMount(p.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),S((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return p.map}),[s]);var d=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:u,style:d},s&&n.createElement(L.Provider,{value:p},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var C=r(3935),M=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function P(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!M.test(n)?r[n]=o+"px":r[n]=o}}}function j(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var l,u,c,p,d,f,m=e.longitude,y=e.latitude,v=e.offset,g=e.style,h=e.draggable,b=void 0!==h&&h,_=e.popup,x=void 0===_?null:_,w=e.rotation,S=void 0===w?0:w,E=e.rotationAlignment,k=void 0===E?"auto":E,M=e.pitchAlignment,j=void 0===M?"auto":M;return(0,n.useEffect)((function(){P(s.getElement(),g)}),[g]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===y||s.setLngLat([m,y]),v&&(l=s.getOffset(),u=v,c=Array.isArray(l)?l[0]:l?l.x:0,p=Array.isArray(l)?l[1]:l?l.y:0,d=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,c!==d||p!==f)&&s.setOffset(v),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==S&&s.setRotation(S),s.getRotationAlignment()!==k&&s.setRotationAlignment(k),s.getPitchAlignment()!==j&&s.setPitchAlignment(j),s.getPopup()!==x&&s.setPopup(x),(0,C.createPortal)(e.children,s.getElement())}const z=(0,n.memo)((0,n.forwardRef)(j));function T(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),l=(0,n.useRef)({props:e});l.current.props=e;var u=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==l.current.props.onOpen||l.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==l.current.props.onClose||l.current.props.onClose(e)};return u.on("close",e),u.setDOMContent(s).addTo(o.getMap()),function(){u.off("close",e),u.isOpen()&&u.remove()}}),[]),(0,n.useEffect)((function(){P(u.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return u}),[]),u.isOpen()&&(u.getLngLat().lng===e.longitude&&u.getLngLat().lat===e.latitude||u.setLngLat([e.longitude,e.latitude]),e.offset&&!i(u.options.offset,e.offset)&&u.setOffset(e.offset),u.options.anchor===e.anchor&&u.options.maxWidth===e.maxWidth||(u.options.anchor=e.anchor,u.setMaxWidth(e.maxWidth)),u.options.className!==e.className)){for(var p,d=T(u.options.className),f=T(e.className),m=(0,c.Z)(d);!(p=m()).done;){var y=p.value;f.has(y)||u.removeClassName(y)}for(var v,g=(0,c.Z)(f);!(v=g()).done;){var h=v.value;d.has(h)||u.addClassName(h)}u.options.className=e.className}return(0,C.createPortal)(e.children,s)}const O=(0,n.memo)((0,n.forwardRef)(R));const A=function(e,t,r,o){var a=(0,n.useContext)(L),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,l=a.map;return l.hasControl(i)||(l.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),l.hasControl(i)&&l.removeControl(i)}}),[]),i};function I(e){var t=A((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){P(t._controlContainer,e.style)}),[e.style]),null}const Z=(0,n.memo)(I);function D(e,t){var r=(0,n.useRef)({props:e}),o=A((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){P(o._container,e.style)}),[e.style]),null}const F=(0,n.memo)((0,n.forwardRef)(D));function U(e){var t=A((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){P(t._container,e.style)}),[e.style]),null}const N=(0,n.memo)(U);function B(e){var t=A((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){P(t._container,a)}),[a]),null}const W=(0,n.memo)(B);function $(e,t){if(!e)throw new Error(t)}var H=0;const q=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+H++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if($(r.id===n.id,"layer id changed"),$(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,l=void 0===s?{}:s,u=r.filter,c=r.minzoom,p=r.maxzoom,d=r.beforeId;if(d!==n.beforeId&&e.moveLayer(t,d),a!==n.layout){var f=n.layout||{};for(var m in a)i(a[m],f[m])||e.setLayoutProperty(t,m,a[m]);for(var y in f)a.hasOwnProperty(y)||e.setLayoutProperty(t,y,void 0)}if(l!==n.paint){var v=n.paint||{};for(var g in l)i(l[g],v[g])||e.setPaintProperty(t,g,l[g]);for(var h in v)l.hasOwnProperty(h)||e.setPaintProperty(t,h,void 0)}i(u,n.filter)||e.setFilter(t,u),c===n.minzoom&&p===n.maxzoom||e.setLayerZoomRange(t,c,p)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var V=0;const J=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+V++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,c.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){$(t.id===r.id,"source id changed"),$(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var G=r.e(8539).then(r.t.bind(r,8539,23)),Q=n.forwardRef((function(e,t){return k(e,t,G)})),X=z,K=O,Y=Z,ee=N,te=F,re=W,ne=q,oe=J;const ae=Q},2853:e=>{e.exports=JSON.parse('{"version":8,"name":"Basic","metadata":{"mapbox:autocomposite":true},"sources":{"mapbox":{"url":"mapbox://mapbox.mapbox-streets-v7","type":"vector"}},"sprite":"mapbox://sprites/mapbox/basic-v8","glyphs":"mapbox://fonts/mapbox/{fontstack}/{range}.pbf","layers":[{"id":"background","type":"background","paint":{"background-color":"#dedede"},"interactive":true},{"id":"landuse_overlay_national_park","type":"fill","source":"mapbox","source-layer":"landuse_overlay","filter":["==","class","national_park"],"paint":{"fill-color":"#d2edae","fill-opacity":0.75},"interactive":true},{"id":"landuse_park","type":"fill","source":"mapbox","source-layer":"landuse","filter":["==","class","park"],"paint":{"fill-color":"#d2edae"},"interactive":true},{"id":"waterway","type":"line","source":"mapbox","source-layer":"waterway","filter":["all",["==","$type","LineString"],["in","class","river","canal"]],"paint":{"line-color":"#a0cfdf","line-width":{"base":1.4,"stops":[[8,0.5],[20,15]]}},"interactive":true},{"id":"water","type":"fill","source":"mapbox","source-layer":"water","paint":{"fill-color":"#a0cfdf"},"interactive":true},{"id":"building","type":"fill","source":"mapbox","source-layer":"building","paint":{"fill-color":"#d6d6d6"},"interactive":true},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","tunnel"]]],"type":"line","source":"mapbox","id":"tunnel_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]},"line-dasharray":[0.36,0.18]},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","tunnel"]]],"type":"line","source":"mapbox","id":"tunnel_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]},"line-dasharray":[0.28,0.14]},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["in","structure","none","ford"]]],"type":"line","source":"mapbox","id":"road_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["in","structure","none","ford"]]],"type":"line","source":"mapbox","id":"road_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_minor case","paint":{"line-color":"#dedede","line-width":{"base":1.6,"stops":[[12,0.5],[20,10]]},"line-gap-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_major case","paint":{"line-color":"#dedede","line-width":{"base":1.6,"stops":[[12,0.5],[20,10]]},"line-gap-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["<=","admin_level",2],["==","maritime",0]]],"type":"line","source":"mapbox","id":"admin_country","paint":{"line-color":"#8b8a8a","line-width":{"base":1.3,"stops":[[3,0.5],[22,15]]}},"source-layer":"admin"},{"interactive":true,"minzoom":5,"layout":{"icon-image":"{maki}-11","text-offset":[0,0.5],"text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-max-width":8,"text-anchor":"top","text-size":11,"icon-size":1},"filter":["all",["==","$type","Point"],["all",["==","scalerank",1],["==","localrank",1]]],"type":"symbol","source":"mapbox","id":"poi_label","paint":{"text-color":"#666","text-halo-width":1,"text-halo-color":"rgba(255,255,255,0.75)","text-halo-blur":1},"source-layer":"poi_label"},{"interactive":true,"layout":{"symbol-placement":"line","text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-transform":"uppercase","text-letter-spacing":0.1,"text-size":{"base":1.4,"stops":[[10,8],[20,14]]}},"filter":["all",["==","$type","LineString"],["in","class","motorway","primary","secondary","tertiary","trunk"]],"type":"symbol","source":"mapbox","id":"road_major_label","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":2},"source-layer":"road_label"},{"interactive":true,"minzoom":8,"layout":{"text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-max-width":6,"text-size":{"stops":[[6,12],[12,16]]}},"filter":["all",["==","$type","Point"],["in","type","town","village","hamlet","suburb","neighbourhood","island"]],"type":"symbol","source":"mapbox","id":"place_label_other","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"place_label"},{"interactive":true,"layout":{"text-field":"{name_en}","text-font":["Open Sans Bold","Arial Unicode MS Bold"],"text-max-width":10,"text-size":{"stops":[[3,12],[8,16]]}},"maxzoom":16,"filter":["all",["==","$type","Point"],["==","type","city"]],"type":"symbol","source":"mapbox","id":"place_label_city","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"place_label"},{"interactive":true,"layout":{"text-field":"{name_en}","text-font":["Open Sans Regular","Arial Unicode MS Regular"],"text-max-width":10,"text-size":{"stops":[[3,14],[8,22]]}},"maxzoom":12,"filter":["==","$type","Point"],"type":"symbol","source":"mapbox","id":"country_label","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"country_label"}]}')}}]); \ No newline at end of file diff --git a/assets/js/c708b2bd.19234b46.js b/assets/js/c708b2bd.19234b46.js new file mode 100644 index 00000000..0b0c4d08 --- /dev/null +++ b/assets/js/c708b2bd.19234b46.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkreact_map_gl_website=self.webpackChunkreact_map_gl_website||[]).push([[81],{3905:(e,t,r)=>{r.d(t,{Zo:()=>c,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var u=n.createContext({}),l=function(e){var t=n.useContext(u),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},c=function(e){var t=l(e.components);return n.createElement(u.Provider,{value:t},e.children)},p="mdxType",f={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},d=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,c=s(e,["components","mdxType","originalType","parentName"]),p=l(r),d=o,m=p["".concat(u,".").concat(d)]||p[d]||f[d]||a;return r?n.createElement(m,i(i({ref:t},c),{},{components:r})):n.createElement(m,i({ref:t},c))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=d;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[p]="string"==typeof e?e:o,i[1]=s;for(var l=2;l{r.r(t),r.d(t,{assets:()=>y,contentTitle:()=>g,default:()=>x,frontMatter:()=>v,metadata:()=>h,toc:()=>b});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945));function u(e){var t=new Date(e);return t.getMonth()+1+"/"+t.getDate()+"/"+t.getFullYear()}function l(e){var t=e.startTime,r=e.endTime,n=e.onChangeTime,o=e.allDays,i=e.onChangeAllDays,s=e.selectedTime,l=864e5,c=Math.round((r-t)/l),p=Math.round((s-t)/l);return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Heatmap"),a.createElement("p",null,"Map showing earthquakes",a.createElement("br",null),"from ",a.createElement("b",null,u(t))," to ",a.createElement("b",null,u(r)),"."),a.createElement("hr",null),a.createElement("div",{className:"input"},a.createElement("label",null,"All Days"),a.createElement("input",{type:"checkbox",name:"allday",checked:o,onChange:function(e){return i(e.target.checked)}})),a.createElement("div",{className:"input "+(o?"disabled":"")},a.createElement("label",null,"Each Day: ",u(s)),a.createElement("input",{type:"range",disabled:o,min:1,max:c,value:p,step:1,onChange:function(e){var r=e.target.value;n(t+r*l)}})),a.createElement("hr",null),a.createElement("p",null,"Data source:"," ",a.createElement("a",{href:"https://docs.mapbox.com/mapbox-gl-js/assets/earthquakes.geojson"},"earthquakes.geojson")),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/heatmap",target:"_new"},"View Code \u2197")))}const c=a.memo(l);var p={id:"heatmap",maxzoom:9,type:"heatmap",paint:{"heatmap-weight":["interpolate",["linear"],["get","mag"],0,0,6,1],"heatmap-intensity":["interpolate",["linear"],["zoom"],0,1,9,3],"heatmap-color":["interpolate",["linear"],["heatmap-density"],0,"rgba(33,102,172,0)",.2,"rgb(103,169,207)",.4,"rgb(209,229,240)",.6,"rgb(253,219,199)",.8,"rgb(239,138,98)",.9,"rgb(255,201,101)"],"heatmap-radius":["interpolate",["linear"],["zoom"],0,2,9,20],"heatmap-opacity":["interpolate",["linear"],["zoom"],7,1,9,0]}},f="";function d(){var e=(0,a.useState)(!0),t=e[0],r=e[1],n=(0,a.useState)([0,0]),o=n[0],i=n[1],u=(0,a.useState)(0),l=u[0],d=u[1],m=(0,a.useState)(null),v=m[0],g=m[1];(0,a.useEffect)((function(){fetch("https://docs.mapbox.com/mapbox-gl-js/assets/earthquakes.geojson").then((function(e){return e.json()})).then((function(e){var t=e.features,r=t[0].properties.time,n=t[t.length-1].properties.time;i([n,r]),g(e),d(r)})).catch((function(e){return console.error("Could not load data",e)}))}),[]);var h=(0,a.useMemo)((function(){return t?v:(e=v,r=new Date(l),n=r.getFullYear(),o=r.getMonth(),a=r.getDate(),{type:"FeatureCollection",features:e.features.filter((function(e){var t=new Date(e.properties.time);return t.getFullYear()===n&&t.getMonth()===o&&t.getDate()===a}))});var e,r,n,o,a}),[v,t,l]);return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:{latitude:40,longitude:-100,zoom:3},mapStyle:"mapbox://styles/mapbox/dark-v9",mapboxAccessToken:f},h&&a.createElement(s.Hw,{type:"geojson",data:h},a.createElement(s.mh,p))),a.createElement(c,{startTime:o[0],endTime:o[1],selectedTime:l,allDays:t,onChangeTime:d,onChangeAllDays:r}))}var m=["components"],v={},g="Heatmap",h={unversionedId:"heatmap",id:"heatmap",title:"Heatmap",description:"",source:"@site/src/examples/heatmap.mdx",sourceDirName:".",slug:"/heatmap",permalink:"/react-map-gl/examples/heatmap",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Zoom to Bounds",permalink:"/react-map-gl/examples/zoom-to-bounds"},next:{title:"Draw Polygon",permalink:"/react-map-gl/examples/draw-polygon"}},y={},b=[],_={toc:b},E="wrapper";function x(e){var t=e.components,r=(0,o.Z)(e,m);return(0,i.kt)(E,(0,n.Z)({},_,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"heatmap"},"Heatmap"),(0,i.kt)(d,{mdxType:"App"}))}x.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>Y,Pv:()=>ee,GI:()=>K,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>D});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?d:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:f(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var l=new this._MapClass(a);i.padding&&l.setPadding(i.padding),r.cursor&&(l.getCanvas().style.cursor=r.cursor),this._createShadowTransform(l);var c=l._render;l._render=function(e){t._inRender=!0,c.call(l,e),t._inRender=!1};var p=l._renderTaskQueue.run;l._renderTaskQueue.run=function(e){p.call(l._renderTaskQueue,e),t._onBeforeRepaint()},l.on("render",(function(){return t._onAfterRepaint()}));var h=l.fire;for(var y in l.fire=this._fireEvent.bind(this,h),l.on("resize",(function(){t._renderTransform.resize(l.transform.width,l.transform.height)})),l.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(l.transform,t._renderTransform)})),l.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)l.on(y,this._onPointerEvent);for(var b in v)l.on(b,this._onCameraEvent);for(var E in g)l.on(E,this._onEvent);this._map=l},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var c=l(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),c&&t){var p=this._deferredEvents;p.move=!0,p.zoom||(p.zoom=o!==n.zoom),p.rotate||(p.rotate=i!==n.bearing),p.pitch||(p.pitch=a!==n.pitch)}return s||l(r.transform,e),c},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function x(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a},queryRenderedFeatures:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryRenderedFeatures(t,n);return r.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,c.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const w="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var S=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var C=n.createContext(null);function L(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],l=(0,n.useRef)(),p=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,c.Z)(S);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,l.current)),t||(t=new b(n.Map,e,l.current)),p.map=x(t),p.mapLib=n,u(t),null==a||a.onMapMount(p.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),w((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return p.map}),[s]);var f=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:l,style:f},s&&n.createElement(C.Provider,{value:p},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var P=r(3935),M=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function O(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!M.test(n)?r[n]=o+"px":r[n]=o}}}function T(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,l,c,p,f,d,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,b=void 0!==y&&y,_=e.popup,E=void 0===_?null:_,x=e.rotation,w=void 0===x?0:x,S=e.rotationAlignment,L=void 0===S?"auto":S,M=e.pitchAlignment,T=void 0===M?"auto":M;return(0,n.useEffect)((function(){O(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),l=g,c=Array.isArray(u)?u[0]:u?u.x:0,p=Array.isArray(u)?u[1]:u?u.y:0,f=Array.isArray(l)?l[0]:l?l.x:0,d=Array.isArray(l)?l[1]:l?l.y:0,c!==f||p!==d)&&s.setOffset(g),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==w&&s.setRotation(w),s.getRotationAlignment()!==L&&s.setRotationAlignment(L),s.getPitchAlignment()!==T&&s.setPitchAlignment(T),s.getPopup()!==E&&s.setPopup(E),(0,P.createPortal)(e.children,s.getElement())}const j=(0,n.memo)((0,n.forwardRef)(T));function k(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var l=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return l.on("close",e),l.setDOMContent(s).addTo(o.getMap()),function(){l.off("close",e),l.isOpen()&&l.remove()}}),[]),(0,n.useEffect)((function(){O(l.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return l}),[]),l.isOpen()&&(l.getLngLat().lng===e.longitude&&l.getLngLat().lat===e.latitude||l.setLngLat([e.longitude,e.latitude]),e.offset&&!i(l.options.offset,e.offset)&&l.setOffset(e.offset),l.options.anchor===e.anchor&&l.options.maxWidth===e.maxWidth||(l.options.anchor=e.anchor,l.setMaxWidth(e.maxWidth)),l.options.className!==e.className)){for(var p,f=k(l.options.className),d=k(e.className),m=(0,c.Z)(f);!(p=m()).done;){var v=p.value;d.has(v)||l.removeClassName(v)}for(var g,h=(0,c.Z)(d);!(g=h()).done;){var y=g.value;f.has(y)||l.addClassName(y)}l.options.className=e.className}return(0,P.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(R));const D=function(e,t,r,o){var a=(0,n.useContext)(C),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function Z(e){var t=D((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){O(t._controlContainer,e.style)}),[e.style]),null}const A=(0,n.memo)(Z);function I(e,t){var r=(0,n.useRef)({props:e}),o=D((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){O(o._container,e.style)}),[e.style]),null}const F=(0,n.memo)((0,n.forwardRef)(I));function N(e){var t=D((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){O(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(N);function H(e){var t=D((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){O(t._container,a)}),[a]),null}const B=(0,n.memo)(H);function q(e,t){if(!e)throw new Error(t)}var W=0;const V=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+W++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(q(r.id===n.id,"layer id changed"),q(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,l=r.filter,c=r.minzoom,p=r.maxzoom,f=r.beforeId;if(f!==n.beforeId&&e.moveLayer(t,f),a!==n.layout){var d=n.layout||{};for(var m in a)i(a[m],d[m])||e.setLayoutProperty(t,m,a[m]);for(var v in d)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(l,n.filter)||e.setFilter(t,l),c===n.minzoom&&p===n.maxzoom||e.setLayerZoomRange(t,c,p)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var G=0;const J=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+G++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,c.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){q(t.id===r.id,"source id changed"),q(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return L(e,t,Q)})),Y=j,K=z,$=A,ee=U,te=F,re=B,ne=V,oe=J;const ae=X},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{r.d(t,{Zo:()=>c,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var u=n.createContext({}),l=function(e){var t=n.useContext(u),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},c=function(e){var t=l(e.components);return n.createElement(u.Provider,{value:t},e.children)},p="mdxType",f={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},d=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,c=s(e,["components","mdxType","originalType","parentName"]),p=l(r),d=o,m=p["".concat(u,".").concat(d)]||p[d]||f[d]||a;return r?n.createElement(m,i(i({ref:t},c),{},{components:r})):n.createElement(m,i({ref:t},c))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=d;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[p]="string"==typeof e?e:o,i[1]=s;for(var l=2;l{r.r(t),r.d(t,{assets:()=>y,contentTitle:()=>g,default:()=>x,frontMatter:()=>v,metadata:()=>h,toc:()=>b});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945));function u(e){var t=new Date(e);return t.getMonth()+1+"/"+t.getDate()+"/"+t.getFullYear()}function l(e){var t=e.startTime,r=e.endTime,n=e.onChangeTime,o=e.allDays,i=e.onChangeAllDays,s=e.selectedTime,l=864e5,c=Math.round((r-t)/l),p=Math.round((s-t)/l);return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Heatmap"),a.createElement("p",null,"Map showing earthquakes",a.createElement("br",null),"from ",a.createElement("b",null,u(t))," to ",a.createElement("b",null,u(r)),"."),a.createElement("hr",null),a.createElement("div",{className:"input"},a.createElement("label",null,"All Days"),a.createElement("input",{type:"checkbox",name:"allday",checked:o,onChange:function(e){return i(e.target.checked)}})),a.createElement("div",{className:"input "+(o?"disabled":"")},a.createElement("label",null,"Each Day: ",u(s)),a.createElement("input",{type:"range",disabled:o,min:1,max:c,value:p,step:1,onChange:function(e){var r=e.target.value;n(t+r*l)}})),a.createElement("hr",null),a.createElement("p",null,"Data source:"," ",a.createElement("a",{href:"https://docs.mapbox.com/mapbox-gl-js/assets/earthquakes.geojson"},"earthquakes.geojson")),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/heatmap",target:"_new"},"View Code \u2197")))}const c=a.memo(l);var p={id:"heatmap",maxzoom:9,type:"heatmap",paint:{"heatmap-weight":["interpolate",["linear"],["get","mag"],0,0,6,1],"heatmap-intensity":["interpolate",["linear"],["zoom"],0,1,9,3],"heatmap-color":["interpolate",["linear"],["heatmap-density"],0,"rgba(33,102,172,0)",.2,"rgb(103,169,207)",.4,"rgb(209,229,240)",.6,"rgb(253,219,199)",.8,"rgb(239,138,98)",.9,"rgb(255,201,101)"],"heatmap-radius":["interpolate",["linear"],["zoom"],0,2,9,20],"heatmap-opacity":["interpolate",["linear"],["zoom"],7,1,9,0]}},f="";function d(){var e=(0,a.useState)(!0),t=e[0],r=e[1],n=(0,a.useState)([0,0]),o=n[0],i=n[1],u=(0,a.useState)(0),l=u[0],d=u[1],m=(0,a.useState)(null),v=m[0],g=m[1];(0,a.useEffect)((function(){fetch("https://docs.mapbox.com/mapbox-gl-js/assets/earthquakes.geojson").then((function(e){return e.json()})).then((function(e){var t=e.features,r=t[0].properties.time,n=t[t.length-1].properties.time;i([n,r]),g(e),d(r)})).catch((function(e){return console.error("Could not load data",e)}))}),[]);var h=(0,a.useMemo)((function(){return t?v:(e=v,r=new Date(l),n=r.getFullYear(),o=r.getMonth(),a=r.getDate(),{type:"FeatureCollection",features:e.features.filter((function(e){var t=new Date(e.properties.time);return t.getFullYear()===n&&t.getMonth()===o&&t.getDate()===a}))});var e,r,n,o,a}),[v,t,l]);return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:{latitude:40,longitude:-100,zoom:3},mapStyle:"mapbox://styles/mapbox/dark-v9",mapboxAccessToken:f},h&&a.createElement(s.Hw,{type:"geojson",data:h},a.createElement(s.mh,p))),a.createElement(c,{startTime:o[0],endTime:o[1],selectedTime:l,allDays:t,onChangeTime:d,onChangeAllDays:r}))}var m=["components"],v={},g="Heatmap",h={unversionedId:"heatmap",id:"heatmap",title:"Heatmap",description:"",source:"@site/src/examples/heatmap.mdx",sourceDirName:".",slug:"/heatmap",permalink:"/react-map-gl/examples/heatmap",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Zoom to Bounds",permalink:"/react-map-gl/examples/zoom-to-bounds"},next:{title:"Draw Polygon",permalink:"/react-map-gl/examples/draw-polygon"}},y={},b=[],_={toc:b},E="wrapper";function x(e){var t=e.components,r=(0,o.Z)(e,m);return(0,i.kt)(E,(0,n.Z)({},_,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"heatmap"},"Heatmap"),(0,i.kt)(d,{mdxType:"App"}))}x.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>Y,Pv:()=>ee,GI:()=>K,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>D});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?d:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:f(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var l=new this._MapClass(a);i.padding&&l.setPadding(i.padding),r.cursor&&(l.getCanvas().style.cursor=r.cursor),this._createShadowTransform(l);var c=l._render;l._render=function(e){t._inRender=!0,c.call(l,e),t._inRender=!1};var p=l._renderTaskQueue.run;l._renderTaskQueue.run=function(e){p.call(l._renderTaskQueue,e),t._onBeforeRepaint()},l.on("render",(function(){return t._onAfterRepaint()}));var h=l.fire;for(var y in l.fire=this._fireEvent.bind(this,h),l.on("resize",(function(){t._renderTransform.resize(l.transform.width,l.transform.height)})),l.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(l.transform,t._renderTransform)})),l.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)l.on(y,this._onPointerEvent);for(var b in v)l.on(b,this._onCameraEvent);for(var E in g)l.on(E,this._onEvent);this._map=l},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var c=l(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),c&&t){var p=this._deferredEvents;p.move=!0,p.zoom||(p.zoom=o!==n.zoom),p.rotate||(p.rotate=i!==n.bearing),p.pitch||(p.pitch=a!==n.pitch)}return s||l(r.transform,e),c},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function x(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,c.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const w="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var S=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var C=n.createContext(null);function L(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],l=(0,n.useRef)(),p=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,c.Z)(S);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,l.current)),t||(t=new b(n.Map,e,l.current)),p.map=x(t),p.mapLib=n,u(t),null==a||a.onMapMount(p.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),w((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return p.map}),[s]);var f=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:l,style:f},s&&n.createElement(C.Provider,{value:p},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var P=r(3935),M=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function O(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!M.test(n)?r[n]=o+"px":r[n]=o}}}function j(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,l,c,p,f,d,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,b=void 0!==y&&y,_=e.popup,E=void 0===_?null:_,x=e.rotation,w=void 0===x?0:x,S=e.rotationAlignment,L=void 0===S?"auto":S,M=e.pitchAlignment,j=void 0===M?"auto":M;return(0,n.useEffect)((function(){O(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),l=g,c=Array.isArray(u)?u[0]:u?u.x:0,p=Array.isArray(u)?u[1]:u?u.y:0,f=Array.isArray(l)?l[0]:l?l.x:0,d=Array.isArray(l)?l[1]:l?l.y:0,c!==f||p!==d)&&s.setOffset(g),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==w&&s.setRotation(w),s.getRotationAlignment()!==L&&s.setRotationAlignment(L),s.getPitchAlignment()!==j&&s.setPitchAlignment(j),s.getPopup()!==E&&s.setPopup(E),(0,P.createPortal)(e.children,s.getElement())}const T=(0,n.memo)((0,n.forwardRef)(j));function k(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var l=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return l.on("close",e),l.setDOMContent(s).addTo(o.getMap()),function(){l.off("close",e),l.isOpen()&&l.remove()}}),[]),(0,n.useEffect)((function(){O(l.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return l}),[]),l.isOpen()&&(l.getLngLat().lng===e.longitude&&l.getLngLat().lat===e.latitude||l.setLngLat([e.longitude,e.latitude]),e.offset&&!i(l.options.offset,e.offset)&&l.setOffset(e.offset),l.options.anchor===e.anchor&&l.options.maxWidth===e.maxWidth||(l.options.anchor=e.anchor,l.setMaxWidth(e.maxWidth)),l.options.className!==e.className)){for(var p,f=k(l.options.className),d=k(e.className),m=(0,c.Z)(f);!(p=m()).done;){var v=p.value;d.has(v)||l.removeClassName(v)}for(var g,h=(0,c.Z)(d);!(g=h()).done;){var y=g.value;f.has(y)||l.addClassName(y)}l.options.className=e.className}return(0,P.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(R));const D=function(e,t,r,o){var a=(0,n.useContext)(C),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function Z(e){var t=D((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){O(t._controlContainer,e.style)}),[e.style]),null}const A=(0,n.memo)(Z);function I(e,t){var r=(0,n.useRef)({props:e}),o=D((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){O(o._container,e.style)}),[e.style]),null}const N=(0,n.memo)((0,n.forwardRef)(I));function F(e){var t=D((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){O(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(F);function H(e){var t=D((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){O(t._container,a)}),[a]),null}const B=(0,n.memo)(H);function W(e,t){if(!e)throw new Error(t)}var q=0;const V=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+q++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(W(r.id===n.id,"layer id changed"),W(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,l=r.filter,c=r.minzoom,p=r.maxzoom,f=r.beforeId;if(f!==n.beforeId&&e.moveLayer(t,f),a!==n.layout){var d=n.layout||{};for(var m in a)i(a[m],d[m])||e.setLayoutProperty(t,m,a[m]);for(var v in d)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(l,n.filter)||e.setFilter(t,l),c===n.minzoom&&p===n.maxzoom||e.setLayerZoomRange(t,c,p)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var G=0;const J=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+G++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,c.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){W(t.id===r.id,"source id changed"),W(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return L(e,t,Q)})),Y=T,K=z,$=A,ee=U,te=N,re=B,ne=V,oe=J;const ae=X},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{r.d(t,{Zo:()=>l,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var u=n.createContext({}),c=function(e){var t=n.useContext(u),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},l=function(e){var t=c(e.components);return n.createElement(u.Provider,{value:t},e.children)},f="mdxType",p={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},d=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,l=s(e,["components","mdxType","originalType","parentName"]),f=c(r),d=o,m=f["".concat(u,".").concat(d)]||f[d]||p[d]||a;return r?n.createElement(m,i(i({ref:t},l),{},{components:r})):n.createElement(m,i({ref:t},l))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=d;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[f]="string"==typeof e?e:o,i[1]=s;for(var c=2;c{r.r(t),r.d(t,{assets:()=>E,contentTitle:()=>b,default:()=>L,frontMatter:()=>y,metadata:()=>_,toc:()=>x});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945)),u=/(^|[A-Z])[a-z]*/g;function c(e){return e.match(u).join(" ")}function l(e){var t=e.name,r=e.value,n=e.onChange;return a.createElement("div",{className:"input"},a.createElement("label",null,c(t)),a.createElement("input",{type:"checkbox",checked:r,onChange:function(e){return n(t,e.target.checked)}}))}function f(e){var t=e.name,r=e.value,n=e.onChange;return a.createElement("div",{className:"input"},a.createElement("label",null,c(t)),a.createElement("input",{type:"number",value:r,onChange:function(e){return n(t,Number(e.target.value))}}))}function p(e){var t=e.settings,r=e.onChange;return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Limit Map Interaction"),a.createElement("p",null,"Turn interactive features off/on."),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/interaction",target:"_new"},"View Code \u2197")),a.createElement("hr",null),Object.keys(t).map((function(e){return function(e,t){switch(typeof t){case"boolean":return a.createElement(l,{key:e,name:e,value:t,onChange:r});case"number":return a.createElement(f,{key:e,name:e,value:t,onChange:r});default:return null}}(e,t[e])})),a.createElement("hr",null))}const d=a.memo(p);var m="",v={latitude:37.729,longitude:-122.36,zoom:11,bearing:0,pitch:50};function g(){var e=(0,a.useState)({scrollZoom:!0,boxZoom:!0,dragRotate:!0,dragPan:!0,keyboard:!0,doubleClickZoom:!0,touchZoomRotate:!0,touchPitch:!0,minZoom:0,maxZoom:20,minPitch:0,maxPitch:85}),t=e[0],r=e[1],o=(0,a.useCallback)((function(e,t){return r((function(r){var n;return Object.assign({},r,((n={})[e]=t,n))}))}),[]);return a.createElement(a.Fragment,null,a.createElement(s.ZP,(0,n.Z)({initialViewState:v},t,{mapStyle:"mapbox://styles/mapbox/dark-v9",mapboxAccessToken:m})),a.createElement(d,{settings:t,onChange:o}))}var h=["components"],y={},b="Limit Map Interaction",_={unversionedId:"interaction",id:"interaction",title:"Limit Map Interaction",description:"",source:"@site/src/examples/interaction.mdx",sourceDirName:".",slug:"/interaction",permalink:"/react-map-gl/examples/interaction",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Clusters",permalink:"/react-map-gl/examples/clusters"},next:{title:"Camera Transition",permalink:"/react-map-gl/examples/viewport-animation"}},E={},x=[],w={toc:x},C="wrapper";function L(e){var t=e.components,r=(0,o.Z)(e,h);return(0,i.kt)(C,(0,n.Z)({},w,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"limit-map-interaction"},"Limit Map Interaction"),(0,i.kt)(g,{mdxType:"App"}))}L.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>K,Pv:()=>ee,GI:()=>Y,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>Z});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?d:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:p(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var c=new this._MapClass(a);i.padding&&c.setPadding(i.padding),r.cursor&&(c.getCanvas().style.cursor=r.cursor),this._createShadowTransform(c);var l=c._render;c._render=function(e){t._inRender=!0,l.call(c,e),t._inRender=!1};var f=c._renderTaskQueue.run;c._renderTaskQueue.run=function(e){f.call(c._renderTaskQueue,e),t._onBeforeRepaint()},c.on("render",(function(){return t._onAfterRepaint()}));var h=c.fire;for(var y in c.fire=this._fireEvent.bind(this,h),c.on("resize",(function(){t._renderTransform.resize(c.transform.width,c.transform.height)})),c.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(c.transform,t._renderTransform)})),c.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)c.on(y,this._onPointerEvent);for(var b in v)c.on(b,this._onCameraEvent);for(var E in g)c.on(E,this._onEvent);this._map=c},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var l=c(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),l&&t){var f=this._deferredEvents;f.move=!0,f.zoom||(f.zoom=o!==n.zoom),f.rotate||(f.rotate=i!==n.bearing),f.pitch||(f.pitch=a!==n.pitch)}return s||c(r.transform,e),l},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function x(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a},queryRenderedFeatures:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryRenderedFeatures(t,n);return r.transform=o,a}},o=(0,l.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,l.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const w="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var C=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var L=n.createContext(null);function P(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],c=(0,n.useRef)(),f=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,l.Z)(C);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,c.current)),t||(t=new b(n.Map,e,c.current)),f.map=x(t),f.mapLib=n,u(t),null==a||a.onMapMount(f.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),w((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return f.map}),[s]);var p=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:c,style:p},s&&n.createElement(L.Provider,{value:f},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var S=r(3935),O=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function M(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!O.test(n)?r[n]=o+"px":r[n]=o}}}function j(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,c,l,f,p,d,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,b=void 0!==y&&y,_=e.popup,E=void 0===_?null:_,x=e.rotation,w=void 0===x?0:x,C=e.rotationAlignment,P=void 0===C?"auto":C,O=e.pitchAlignment,j=void 0===O?"auto":O;return(0,n.useEffect)((function(){M(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),c=g,l=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,p=Array.isArray(c)?c[0]:c?c.x:0,d=Array.isArray(c)?c[1]:c?c.y:0,l!==p||f!==d)&&s.setOffset(g),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==w&&s.setRotation(w),s.getRotationAlignment()!==P&&s.setRotationAlignment(P),s.getPitchAlignment()!==j&&s.setPitchAlignment(j),s.getPopup()!==E&&s.setPopup(E),(0,S.createPortal)(e.children,s.getElement())}const T=(0,n.memo)((0,n.forwardRef)(j));function k(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var c=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return c.on("close",e),c.setDOMContent(s).addTo(o.getMap()),function(){c.off("close",e),c.isOpen()&&c.remove()}}),[]),(0,n.useEffect)((function(){M(c.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return c}),[]),c.isOpen()&&(c.getLngLat().lng===e.longitude&&c.getLngLat().lat===e.latitude||c.setLngLat([e.longitude,e.latitude]),e.offset&&!i(c.options.offset,e.offset)&&c.setOffset(e.offset),c.options.anchor===e.anchor&&c.options.maxWidth===e.maxWidth||(c.options.anchor=e.anchor,c.setMaxWidth(e.maxWidth)),c.options.className!==e.className)){for(var f,p=k(c.options.className),d=k(e.className),m=(0,l.Z)(p);!(f=m()).done;){var v=f.value;d.has(v)||c.removeClassName(v)}for(var g,h=(0,l.Z)(d);!(g=h()).done;){var y=g.value;p.has(y)||c.addClassName(y)}c.options.className=e.className}return(0,S.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(R));const Z=function(e,t,r,o){var a=(0,n.useContext)(L),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function I(e){var t=Z((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){M(t._controlContainer,e.style)}),[e.style]),null}const A=(0,n.memo)(I);function N(e,t){var r=(0,n.useRef)({props:e}),o=Z((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){M(o._container,e.style)}),[e.style]),null}const D=(0,n.memo)((0,n.forwardRef)(N));function F(e){var t=Z((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){M(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(F);function B(e){var t=Z((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){M(t._container,a)}),[a]),null}const W=(0,n.memo)(B);function H(e,t){if(!e)throw new Error(t)}var q=0;const V=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+q++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(H(r.id===n.id,"layer id changed"),H(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,c=r.filter,l=r.minzoom,f=r.maxzoom,p=r.beforeId;if(p!==n.beforeId&&e.moveLayer(t,p),a!==n.layout){var d=n.layout||{};for(var m in a)i(a[m],d[m])||e.setLayoutProperty(t,m,a[m]);for(var v in d)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(c,n.filter)||e.setFilter(t,c),l===n.minzoom&&f===n.maxzoom||e.setLayerZoomRange(t,l,f)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var G=0;const J=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+G++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,l.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){H(t.id===r.id,"source id changed"),H(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return P(e,t,Q)})),K=T,Y=z,$=A,ee=U,te=D,re=W,ne=V,oe=J;const ae=X},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{r.d(t,{Zo:()=>l,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var u=n.createContext({}),c=function(e){var t=n.useContext(u),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},l=function(e){var t=c(e.components);return n.createElement(u.Provider,{value:t},e.children)},f="mdxType",p={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},d=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,u=e.parentName,l=s(e,["components","mdxType","originalType","parentName"]),f=c(r),d=o,m=f["".concat(u,".").concat(d)]||f[d]||p[d]||a;return r?n.createElement(m,i(i({ref:t},l),{},{components:r})):n.createElement(m,i({ref:t},l))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=d;var s={};for(var u in t)hasOwnProperty.call(t,u)&&(s[u]=t[u]);s.originalType=e,s[f]="string"==typeof e?e:o,i[1]=s;for(var c=2;c{r.r(t),r.d(t,{assets:()=>E,contentTitle:()=>b,default:()=>L,frontMatter:()=>y,metadata:()=>_,toc:()=>x});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945)),u=/(^|[A-Z])[a-z]*/g;function c(e){return e.match(u).join(" ")}function l(e){var t=e.name,r=e.value,n=e.onChange;return a.createElement("div",{className:"input"},a.createElement("label",null,c(t)),a.createElement("input",{type:"checkbox",checked:r,onChange:function(e){return n(t,e.target.checked)}}))}function f(e){var t=e.name,r=e.value,n=e.onChange;return a.createElement("div",{className:"input"},a.createElement("label",null,c(t)),a.createElement("input",{type:"number",value:r,onChange:function(e){return n(t,Number(e.target.value))}}))}function p(e){var t=e.settings,r=e.onChange;return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Limit Map Interaction"),a.createElement("p",null,"Turn interactive features off/on."),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/interaction",target:"_new"},"View Code \u2197")),a.createElement("hr",null),Object.keys(t).map((function(e){return function(e,t){switch(typeof t){case"boolean":return a.createElement(l,{key:e,name:e,value:t,onChange:r});case"number":return a.createElement(f,{key:e,name:e,value:t,onChange:r});default:return null}}(e,t[e])})),a.createElement("hr",null))}const d=a.memo(p);var m="",v={latitude:37.729,longitude:-122.36,zoom:11,bearing:0,pitch:50};function g(){var e=(0,a.useState)({scrollZoom:!0,boxZoom:!0,dragRotate:!0,dragPan:!0,keyboard:!0,doubleClickZoom:!0,touchZoomRotate:!0,touchPitch:!0,minZoom:0,maxZoom:20,minPitch:0,maxPitch:85}),t=e[0],r=e[1],o=(0,a.useCallback)((function(e,t){return r((function(r){var n;return Object.assign({},r,((n={})[e]=t,n))}))}),[]);return a.createElement(a.Fragment,null,a.createElement(s.ZP,(0,n.Z)({initialViewState:v},t,{mapStyle:"mapbox://styles/mapbox/dark-v9",mapboxAccessToken:m})),a.createElement(d,{settings:t,onChange:o}))}var h=["components"],y={},b="Limit Map Interaction",_={unversionedId:"interaction",id:"interaction",title:"Limit Map Interaction",description:"",source:"@site/src/examples/interaction.mdx",sourceDirName:".",slug:"/interaction",permalink:"/react-map-gl/examples/interaction",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Clusters",permalink:"/react-map-gl/examples/clusters"},next:{title:"Camera Transition",permalink:"/react-map-gl/examples/viewport-animation"}},E={},x=[],w={toc:x},C="wrapper";function L(e){var t=e.components,r=(0,o.Z)(e,h);return(0,i.kt)(C,(0,n.Z)({},w,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"limit-map-interaction"},"Limit Map Interaction"),(0,i.kt)(g,{mdxType:"App"}))}L.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>$,$j:()=>te,mh:()=>ne,D5:()=>X,Jx:()=>K,Pv:()=>ee,GI:()=>Y,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>Z});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?d:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:p(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var u=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=u,r.gl}}var c=new this._MapClass(a);i.padding&&c.setPadding(i.padding),r.cursor&&(c.getCanvas().style.cursor=r.cursor),this._createShadowTransform(c);var l=c._render;c._render=function(e){t._inRender=!0,l.call(c,e),t._inRender=!1};var f=c._renderTaskQueue.run;c._renderTaskQueue.run=function(e){f.call(c._renderTaskQueue,e),t._onBeforeRepaint()},c.on("render",(function(){return t._onAfterRepaint()}));var h=c.fire;for(var y in c.fire=this._fireEvent.bind(this,h),c.on("resize",(function(){t._renderTransform.resize(c.transform.width,c.transform.height)})),c.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(c.transform,t._renderTransform)})),c.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)c.on(y,this._onPointerEvent);for(var b in v)c.on(b,this._onCameraEvent);for(var E in g)c.on(E,this._onEvent);this._map=c},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var l=c(n,Object.assign({},u(r.transform),e));if(s&&(n.cameraElevationReference="ground"),l&&t){var f=this._deferredEvents;f.move=!0,f.zoom||(f.zoom=o!==n.zoom),f.rotate||(f.rotate=i!==n.bearing),f.pitch||(f.pitch=a!==n.pitch)}return s||c(r.transform,e),l},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=h;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=u(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var E=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function x(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a}},o=(0,l.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,l.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||E.includes(a)||(n[a]=r[a].bind(r))}return n}const w="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var C=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var L=n.createContext(null);function P(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],u=i[1],c=(0,n.useRef)(),f=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,l.Z)(C);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,c.current)),t||(t=new b(n.Map,e,c.current)),f.map=x(t),f.mapLib=n,u(t),null==a||a.onMapMount(f.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),w((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return f.map}),[s]);var p=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:c,style:p},s&&n.createElement(L.Provider,{value:f},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var S=r(3935),O=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function M(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!O.test(n)?r[n]=o+"px":r[n]=o}}}function j(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var u,c,l,f,p,d,m=e.longitude,v=e.latitude,g=e.offset,h=e.style,y=e.draggable,b=void 0!==y&&y,_=e.popup,E=void 0===_?null:_,x=e.rotation,w=void 0===x?0:x,C=e.rotationAlignment,P=void 0===C?"auto":C,O=e.pitchAlignment,j=void 0===O?"auto":O;return(0,n.useEffect)((function(){M(s.getElement(),h)}),[h]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),g&&(u=s.getOffset(),c=g,l=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,p=Array.isArray(c)?c[0]:c?c.x:0,d=Array.isArray(c)?c[1]:c?c.y:0,l!==p||f!==d)&&s.setOffset(g),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==w&&s.setRotation(w),s.getRotationAlignment()!==P&&s.setRotationAlignment(P),s.getPitchAlignment()!==j&&s.setPitchAlignment(j),s.getPopup()!==E&&s.setPopup(E),(0,S.createPortal)(e.children,s.getElement())}const T=(0,n.memo)((0,n.forwardRef)(j));function k(e){return new Set(e?e.trim().split(/\s+/):[])}function R(e,t){var r=(0,n.useContext)(L),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),u=(0,n.useRef)({props:e});u.current.props=e;var c=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==u.current.props.onOpen||u.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==u.current.props.onClose||u.current.props.onClose(e)};return c.on("close",e),c.setDOMContent(s).addTo(o.getMap()),function(){c.off("close",e),c.isOpen()&&c.remove()}}),[]),(0,n.useEffect)((function(){M(c.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return c}),[]),c.isOpen()&&(c.getLngLat().lng===e.longitude&&c.getLngLat().lat===e.latitude||c.setLngLat([e.longitude,e.latitude]),e.offset&&!i(c.options.offset,e.offset)&&c.setOffset(e.offset),c.options.anchor===e.anchor&&c.options.maxWidth===e.maxWidth||(c.options.anchor=e.anchor,c.setMaxWidth(e.maxWidth)),c.options.className!==e.className)){for(var f,p=k(c.options.className),d=k(e.className),m=(0,l.Z)(p);!(f=m()).done;){var v=f.value;d.has(v)||c.removeClassName(v)}for(var g,h=(0,l.Z)(d);!(g=h()).done;){var y=g.value;p.has(y)||c.addClassName(y)}c.options.className=e.className}return(0,S.createPortal)(e.children,s)}const z=(0,n.memo)((0,n.forwardRef)(R));const Z=function(e,t,r,o){var a=(0,n.useContext)(L),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,u=a.map;return u.hasControl(i)||(u.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),u.hasControl(i)&&u.removeControl(i)}}),[]),i};function I(e){var t=Z((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){M(t._controlContainer,e.style)}),[e.style]),null}const A=(0,n.memo)(I);function N(e,t){var r=(0,n.useRef)({props:e}),o=Z((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){M(o._container,e.style)}),[e.style]),null}const D=(0,n.memo)((0,n.forwardRef)(N));function F(e){var t=Z((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){M(t._container,e.style)}),[e.style]),null}const U=(0,n.memo)(F);function B(e){var t=Z((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){M(t._container,a)}),[a]),null}const W=(0,n.memo)(B);function H(e,t){if(!e)throw new Error(t)}var V=0;const q=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+V++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if(H(r.id===n.id,"layer id changed"),H(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,u=void 0===s?{}:s,c=r.filter,l=r.minzoom,f=r.maxzoom,p=r.beforeId;if(p!==n.beforeId&&e.moveLayer(t,p),a!==n.layout){var d=n.layout||{};for(var m in a)i(a[m],d[m])||e.setLayoutProperty(t,m,a[m]);for(var v in d)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(u!==n.paint){var g=n.paint||{};for(var h in u)i(u[h],g[h])||e.setPaintProperty(t,h,u[h]);for(var y in g)u.hasOwnProperty(y)||e.setPaintProperty(t,y,void 0)}i(c,n.filter)||e.setFilter(t,c),l===n.minzoom&&f===n.maxzoom||e.setLayerZoomRange(t,l,f)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var G=0;const J=function(e){var t=(0,n.useContext)(L).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+G++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,l.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){H(t.id===r.id,"source id changed"),H(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var Q=r.e(8539).then(r.t.bind(r,8539,23)),X=n.forwardRef((function(e,t){return P(e,t,Q)})),K=T,Y=z,$=A,ee=U,te=D,re=W,ne=q,oe=J;const ae=X},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{r.d(t,{Zo:()=>c,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var l=n.createContext({}),u=function(e){var t=n.useContext(l),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},c=function(e){var t=u(e.components);return n.createElement(l.Provider,{value:t},e.children)},p="mdxType",d={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},f=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,l=e.parentName,c=s(e,["components","mdxType","originalType","parentName"]),p=u(r),f=o,m=p["".concat(l,".").concat(f)]||p[f]||d[f]||a;return r?n.createElement(m,i(i({ref:t},c),{},{components:r})):n.createElement(m,i({ref:t},c))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=f;var s={};for(var l in t)hasOwnProperty.call(t,l)&&(s[l]=t[l]);s.originalType=e,s[p]="string"==typeof e?e:o,i[1]=s;for(var u=2;u{r.r(t),r.d(t,{assets:()=>_,contentTitle:()=>h,default:()=>E,frontMatter:()=>g,metadata:()=>b,toc:()=>x});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945)),l={parks:/park/,buildings:/building/,roads:/bridge|road|tunnel/,labels:/label|place|poi/};function u(e){var t=e.name,r=e.value,n=e.onChange;return a.createElement("div",{key:t,className:"input"},a.createElement("label",null,t),a.createElement("input",{type:"checkbox",checked:r,onChange:function(e){return n(t,e.target.checked)}}))}function c(e){var t=(0,a.useState)({parks:!0,buildings:!0,roads:!0,labels:!0}),r=t[0],n=t[1];(0,a.useEffect)((function(){e.onChange((function(e){return function(e,t){for(var r in e)if(e[r]&&l[r].test(t))return!0;return!1}(r,e)}))}),[r]);var o=function(e,t){var o;n(Object.assign({},r,((o={})[e]=t,o)))};return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Custom Cursor"),a.createElement("p",null,"Customize the cursor based on interactivity."),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/custom-cursor",target:"_new"},"View Code \u2197")),a.createElement("hr",null),a.createElement("p",null,"Clickable layers"),Object.keys(l).map((function(e){return a.createElement(u,{key:e,name:e,value:r[e],onChange:o})})))}const p=a.memo(c);var d=r(2853),f="",m={longitude:-122.48,latitude:37.78,zoom:15.5,bearing:0,pitch:0};function v(){var e=(0,a.useState)("auto"),t=e[0],r=e[1],n=(0,a.useState)(["nonexist"]),o=n[0],i=n[1],l=(0,a.useCallback)((function(e){i(d.layers.map((function(e){return e.id})).filter(e))}),[]),u=(0,a.useCallback)((function(e){var t=e.features&&e.features[0];t&&window.alert("Clicked layer "+t.layer.id)}),[]),c=(0,a.useCallback)((function(){return r("pointer")}),[]),v=(0,a.useCallback)((function(){return r("auto")}),[]);return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:m,mapStyle:d,onClick:u,onMouseEnter:c,onMouseLeave:v,cursor:t,interactiveLayerIds:o,mapboxAccessToken:f}),a.createElement(p,{onChange:l}))}var y=["components"],g={},h="Custom Cursor",b={unversionedId:"custom-cursor",id:"custom-cursor",title:"Custom Cursor",description:"",source:"@site/src/examples/custom-cursor.mdx",sourceDirName:".",slug:"/custom-cursor",permalink:"/react-map-gl/examples/custom-cursor",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Markers, Popups and Controls",permalink:"/react-map-gl/examples/controls"},next:{title:"Draggable Marker",permalink:"/react-map-gl/examples/draggable-markers"}},_={},x=[],w={toc:x},S="wrapper";function E(e){var t=e.components,r=(0,o.Z)(e,y);return(0,i.kt)(S,(0,n.Z)({},w,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"custom-cursor"},"Custom Cursor"),(0,i.kt)(v,{mdxType:"App"}))}E.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>Y,$j:()=>te,mh:()=>ne,D5:()=>Q,Jx:()=>X,Pv:()=>ee,GI:()=>K,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>A});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?f:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||_()||null,container:e,style:d(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var l=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=l,r.gl}}var u=new this._MapClass(a);i.padding&&u.setPadding(i.padding),r.cursor&&(u.getCanvas().style.cursor=r.cursor),this._createShadowTransform(u);var c=u._render;u._render=function(e){t._inRender=!0,c.call(u,e),t._inRender=!1};var p=u._renderTaskQueue.run;u._renderTaskQueue.run=function(e){p.call(u._renderTaskQueue,e),t._onBeforeRepaint()},u.on("render",(function(){return t._onAfterRepaint()}));var g=u.fire;for(var h in u.fire=this._fireEvent.bind(this,g),u.on("resize",(function(){t._renderTransform.resize(u.transform.width,u.transform.height)})),u.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(u.transform,t._renderTransform)})),u.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)u.on(h,this._onPointerEvent);for(var b in v)u.on(b,this._onCameraEvent);for(var x in y)u.on(x,this._onEvent);this._map=u},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var c=u(n,Object.assign({},l(r.transform),e));if(s&&(n.cameraElevationReference="ground"),c&&t){var p=this._deferredEvents;p.move=!0,p.zoom||(p.zoom=o!==n.zoom),p.rotate||(p.rotate=i!==n.bearing),p.pitch||(p.pitch=a!==n.pitch)}return s||u(r.transform,e),c},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=g;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=l(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function _(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var x=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function w(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a},queryRenderedFeatures:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryRenderedFeatures(t,n);return r.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,c.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||x.includes(a)||(n[a]=r[a].bind(r))}return n}const S="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var E=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var C=n.createContext(null);function k(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],l=i[1],u=(0,n.useRef)(),p=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,c.Z)(E);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,u.current)),t||(t=new b(n.Map,e,u.current)),p.map=w(t),p.mapLib=n,l(t),null==a||a.onMapMount(p.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),S((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return p.map}),[s]);var d=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:u,style:d},s&&n.createElement(C.Provider,{value:p},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var L=r(3935),P=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function O(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!P.test(n)?r[n]=o+"px":r[n]=o}}}function j(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var l,u,c,p,d,f,m=e.longitude,v=e.latitude,y=e.offset,g=e.style,h=e.draggable,b=void 0!==h&&h,_=e.popup,x=void 0===_?null:_,w=e.rotation,S=void 0===w?0:w,E=e.rotationAlignment,k=void 0===E?"auto":E,P=e.pitchAlignment,j=void 0===P?"auto":P;return(0,n.useEffect)((function(){O(s.getElement(),g)}),[g]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),y&&(l=s.getOffset(),u=y,c=Array.isArray(l)?l[0]:l?l.x:0,p=Array.isArray(l)?l[1]:l?l.y:0,d=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,c!==d||p!==f)&&s.setOffset(y),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==S&&s.setRotation(S),s.getRotationAlignment()!==k&&s.setRotationAlignment(k),s.getPitchAlignment()!==j&&s.setPitchAlignment(j),s.getPopup()!==x&&s.setPopup(x),(0,L.createPortal)(e.children,s.getElement())}const M=(0,n.memo)((0,n.forwardRef)(j));function T(e){return new Set(e?e.trim().split(/\s+/):[])}function z(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),l=(0,n.useRef)({props:e});l.current.props=e;var u=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==l.current.props.onOpen||l.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==l.current.props.onClose||l.current.props.onClose(e)};return u.on("close",e),u.setDOMContent(s).addTo(o.getMap()),function(){u.off("close",e),u.isOpen()&&u.remove()}}),[]),(0,n.useEffect)((function(){O(u.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return u}),[]),u.isOpen()&&(u.getLngLat().lng===e.longitude&&u.getLngLat().lat===e.latitude||u.setLngLat([e.longitude,e.latitude]),e.offset&&!i(u.options.offset,e.offset)&&u.setOffset(e.offset),u.options.anchor===e.anchor&&u.options.maxWidth===e.maxWidth||(u.options.anchor=e.anchor,u.setMaxWidth(e.maxWidth)),u.options.className!==e.className)){for(var p,d=T(u.options.className),f=T(e.className),m=(0,c.Z)(d);!(p=m()).done;){var v=p.value;f.has(v)||u.removeClassName(v)}for(var y,g=(0,c.Z)(f);!(y=g()).done;){var h=y.value;d.has(h)||u.addClassName(h)}u.options.className=e.className}return(0,L.createPortal)(e.children,s)}const R=(0,n.memo)((0,n.forwardRef)(z));const A=function(e,t,r,o){var a=(0,n.useContext)(C),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,l=a.map;return l.hasControl(i)||(l.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),l.hasControl(i)&&l.removeControl(i)}}),[]),i};function Z(e){var t=A((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){O(t._controlContainer,e.style)}),[e.style]),null}const I=(0,n.memo)(Z);function D(e,t){var r=(0,n.useRef)({props:e}),o=A((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){O(o._container,e.style)}),[e.style]),null}const N=(0,n.memo)((0,n.forwardRef)(D));function U(e){var t=A((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){O(t._container,e.style)}),[e.style]),null}const F=(0,n.memo)(U);function B(e){var t=A((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){O(t._container,a)}),[a]),null}const W=(0,n.memo)(B);function $(e,t){if(!e)throw new Error(t)}var H=0;const q=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+H++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if($(r.id===n.id,"layer id changed"),$(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,l=void 0===s?{}:s,u=r.filter,c=r.minzoom,p=r.maxzoom,d=r.beforeId;if(d!==n.beforeId&&e.moveLayer(t,d),a!==n.layout){var f=n.layout||{};for(var m in a)i(a[m],f[m])||e.setLayoutProperty(t,m,a[m]);for(var v in f)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(l!==n.paint){var y=n.paint||{};for(var g in l)i(l[g],y[g])||e.setPaintProperty(t,g,l[g]);for(var h in y)l.hasOwnProperty(h)||e.setPaintProperty(t,h,void 0)}i(u,n.filter)||e.setFilter(t,u),c===n.minzoom&&p===n.maxzoom||e.setLayerZoomRange(t,c,p)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var V=0;const G=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+V++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,c.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){$(t.id===r.id,"source id changed"),$(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var J=r.e(8539).then(r.t.bind(r,8539,23)),Q=n.forwardRef((function(e,t){return k(e,t,J)})),X=M,K=R,Y=I,ee=F,te=N,re=W,ne=q,oe=G;const ae=Q},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{e.exports=JSON.parse('{"version":8,"name":"Basic","metadata":{"mapbox:autocomposite":true},"sources":{"mapbox":{"url":"mapbox://mapbox.mapbox-streets-v7","type":"vector"}},"sprite":"mapbox://sprites/mapbox/basic-v8","glyphs":"mapbox://fonts/mapbox/{fontstack}/{range}.pbf","layers":[{"id":"background","type":"background","paint":{"background-color":"#dedede"},"interactive":true},{"id":"landuse_overlay_national_park","type":"fill","source":"mapbox","source-layer":"landuse_overlay","filter":["==","class","national_park"],"paint":{"fill-color":"#d2edae","fill-opacity":0.75},"interactive":true},{"id":"landuse_park","type":"fill","source":"mapbox","source-layer":"landuse","filter":["==","class","park"],"paint":{"fill-color":"#d2edae"},"interactive":true},{"id":"waterway","type":"line","source":"mapbox","source-layer":"waterway","filter":["all",["==","$type","LineString"],["in","class","river","canal"]],"paint":{"line-color":"#a0cfdf","line-width":{"base":1.4,"stops":[[8,0.5],[20,15]]}},"interactive":true},{"id":"water","type":"fill","source":"mapbox","source-layer":"water","paint":{"fill-color":"#a0cfdf"},"interactive":true},{"id":"building","type":"fill","source":"mapbox","source-layer":"building","paint":{"fill-color":"#d6d6d6"},"interactive":true},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","tunnel"]]],"type":"line","source":"mapbox","id":"tunnel_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]},"line-dasharray":[0.36,0.18]},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","tunnel"]]],"type":"line","source":"mapbox","id":"tunnel_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]},"line-dasharray":[0.28,0.14]},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["in","structure","none","ford"]]],"type":"line","source":"mapbox","id":"road_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["in","structure","none","ford"]]],"type":"line","source":"mapbox","id":"road_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_minor case","paint":{"line-color":"#dedede","line-width":{"base":1.6,"stops":[[12,0.5],[20,10]]},"line-gap-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_major case","paint":{"line-color":"#dedede","line-width":{"base":1.6,"stops":[[12,0.5],[20,10]]},"line-gap-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["<=","admin_level",2],["==","maritime",0]]],"type":"line","source":"mapbox","id":"admin_country","paint":{"line-color":"#8b8a8a","line-width":{"base":1.3,"stops":[[3,0.5],[22,15]]}},"source-layer":"admin"},{"interactive":true,"minzoom":5,"layout":{"icon-image":"{maki}-11","text-offset":[0,0.5],"text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-max-width":8,"text-anchor":"top","text-size":11,"icon-size":1},"filter":["all",["==","$type","Point"],["all",["==","scalerank",1],["==","localrank",1]]],"type":"symbol","source":"mapbox","id":"poi_label","paint":{"text-color":"#666","text-halo-width":1,"text-halo-color":"rgba(255,255,255,0.75)","text-halo-blur":1},"source-layer":"poi_label"},{"interactive":true,"layout":{"symbol-placement":"line","text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-transform":"uppercase","text-letter-spacing":0.1,"text-size":{"base":1.4,"stops":[[10,8],[20,14]]}},"filter":["all",["==","$type","LineString"],["in","class","motorway","primary","secondary","tertiary","trunk"]],"type":"symbol","source":"mapbox","id":"road_major_label","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":2},"source-layer":"road_label"},{"interactive":true,"minzoom":8,"layout":{"text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-max-width":6,"text-size":{"stops":[[6,12],[12,16]]}},"filter":["all",["==","$type","Point"],["in","type","town","village","hamlet","suburb","neighbourhood","island"]],"type":"symbol","source":"mapbox","id":"place_label_other","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"place_label"},{"interactive":true,"layout":{"text-field":"{name_en}","text-font":["Open Sans Bold","Arial Unicode MS Bold"],"text-max-width":10,"text-size":{"stops":[[3,12],[8,16]]}},"maxzoom":16,"filter":["all",["==","$type","Point"],["==","type","city"]],"type":"symbol","source":"mapbox","id":"place_label_city","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"place_label"},{"interactive":true,"layout":{"text-field":"{name_en}","text-font":["Open Sans Regular","Arial Unicode MS Regular"],"text-max-width":10,"text-size":{"stops":[[3,14],[8,22]]}},"maxzoom":12,"filter":["==","$type","Point"],"type":"symbol","source":"mapbox","id":"country_label","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"country_label"}]}')}}]); \ No newline at end of file diff --git a/assets/js/f96a57ac.f48a8a18.js b/assets/js/f96a57ac.f48a8a18.js deleted file mode 100644 index 69b188a5..00000000 --- a/assets/js/f96a57ac.f48a8a18.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkreact_map_gl_website=self.webpackChunkreact_map_gl_website||[]).push([[6701],{3905:(e,t,r)=>{r.d(t,{Zo:()=>c,kt:()=>m});var n=r(7294);function o(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function a(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function i(e){for(var t=1;t=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}var l=n.createContext({}),u=function(e){var t=n.useContext(l),r=t;return e&&(r="function"==typeof e?e(t):i(i({},t),e)),r},c=function(e){var t=u(e.components);return n.createElement(l.Provider,{value:t},e.children)},p="mdxType",d={inlineCode:"code",wrapper:function(e){var t=e.children;return n.createElement(n.Fragment,{},t)}},f=n.forwardRef((function(e,t){var r=e.components,o=e.mdxType,a=e.originalType,l=e.parentName,c=s(e,["components","mdxType","originalType","parentName"]),p=u(r),f=o,m=p["".concat(l,".").concat(f)]||p[f]||d[f]||a;return r?n.createElement(m,i(i({ref:t},c),{},{components:r})):n.createElement(m,i({ref:t},c))}));function m(e,t){var r=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var a=r.length,i=new Array(a);i[0]=f;var s={};for(var l in t)hasOwnProperty.call(t,l)&&(s[l]=t[l]);s.originalType=e,s[p]="string"==typeof e?e:o,i[1]=s;for(var u=2;u{r.r(t),r.d(t,{assets:()=>x,contentTitle:()=>h,default:()=>E,frontMatter:()=>g,metadata:()=>b,toc:()=>_});var n=r(7462),o=r(3366),a=r(7294),i=r(3905),s=(r(745),r(945)),l={parks:/park/,buildings:/building/,roads:/bridge|road|tunnel/,labels:/label|place|poi/};function u(e){var t=e.name,r=e.value,n=e.onChange;return a.createElement("div",{key:t,className:"input"},a.createElement("label",null,t),a.createElement("input",{type:"checkbox",checked:r,onChange:function(e){return n(t,e.target.checked)}}))}function c(e){var t=(0,a.useState)({parks:!0,buildings:!0,roads:!0,labels:!0}),r=t[0],n=t[1];(0,a.useEffect)((function(){e.onChange((function(e){return function(e,t){for(var r in e)if(e[r]&&l[r].test(t))return!0;return!1}(r,e)}))}),[r]);var o=function(e,t){var o;n(Object.assign({},r,((o={})[e]=t,o)))};return a.createElement("div",{className:"control-panel"},a.createElement("h3",null,"Custom Cursor"),a.createElement("p",null,"Customize the cursor based on interactivity."),a.createElement("div",{className:"source-link"},a.createElement("a",{href:"https://github.com/visgl/react-map-gl/tree/7.1-release/examples/custom-cursor",target:"_new"},"View Code \u2197")),a.createElement("hr",null),a.createElement("p",null,"Clickable layers"),Object.keys(l).map((function(e){return a.createElement(u,{key:e,name:e,value:r[e],onChange:o})})))}const p=a.memo(c);var d=r(2853),f="",m={longitude:-122.48,latitude:37.78,zoom:15.5,bearing:0,pitch:0};function v(){var e=(0,a.useState)("auto"),t=e[0],r=e[1],n=(0,a.useState)(["nonexist"]),o=n[0],i=n[1],l=(0,a.useCallback)((function(e){i(d.layers.map((function(e){return e.id})).filter(e))}),[]),u=(0,a.useCallback)((function(e){var t=e.features&&e.features[0];t&&window.alert("Clicked layer "+t.layer.id)}),[]),c=(0,a.useCallback)((function(){return r("pointer")}),[]),v=(0,a.useCallback)((function(){return r("auto")}),[]);return a.createElement(a.Fragment,null,a.createElement(s.ZP,{initialViewState:m,mapStyle:d,onClick:u,onMouseEnter:c,onMouseLeave:v,cursor:t,interactiveLayerIds:o,mapboxAccessToken:f}),a.createElement(p,{onChange:l}))}var y=["components"],g={},h="Custom Cursor",b={unversionedId:"custom-cursor",id:"custom-cursor",title:"Custom Cursor",description:"",source:"@site/src/examples/custom-cursor.mdx",sourceDirName:".",slug:"/custom-cursor",permalink:"/react-map-gl/examples/custom-cursor",draft:!1,tags:[],version:"current",frontMatter:{},sidebar:"examplesSidebar",previous:{title:"Markers, Popups and Controls",permalink:"/react-map-gl/examples/controls"},next:{title:"Draggable Marker",permalink:"/react-map-gl/examples/draggable-markers"}},x={},_=[],w={toc:_},S="wrapper";function E(e){var t=e.components,r=(0,o.Z)(e,y);return(0,i.kt)(S,(0,n.Z)({},w,r,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"custom-cursor"},"Custom Cursor"),(0,i.kt)(v,{mdxType:"App"}))}E.isMDXComponent=!0},945:(e,t,r)=>{r.d(t,{ot:()=>Y,$j:()=>te,mh:()=>ne,D5:()=>Q,Jx:()=>X,Pv:()=>ee,GI:()=>K,jf:()=>re,Hw:()=>oe,ZP:()=>ae,PE:()=>A});var n=r(7294),o=n.createContext(null);var a=r(1202);function i(e,t){if(e===t)return!0;if(!e||!t)return!1;if(Array.isArray(e)){if(!Array.isArray(t)||e.length!==t.length)return!1;for(var r=0;r0;)r.appendChild(a.childNodes[0]);o._container=r;var i=o._resizeObserver;i&&(i.disconnect(),i.observe(r)),n.setProps(Object.assign({},t,{styleDiffing:!1})),o.resize();var s=t.initialViewState;return s&&(s.bounds?o.fitBounds(s.bounds,Object.assign({},s.fitBoundsOptions,{duration:0})):n._updateViewState(s,!1)),o.isStyleLoaded()?o.fire("load"):o.once("styledata",(function(){return o.fire("load")})),o._update(),n},t._initialize=function(e){var t=this,r=this.props,n=r.mapStyle,o=void 0===n?f:n,a=Object.assign({},r,r.initialViewState,{accessToken:r.mapboxAccessToken||x()||null,container:e,style:d(o)}),i=a.initialViewState||a.viewState||a;if(Object.assign(a,{center:[i.longitude||0,i.latitude||0],zoom:i.zoom||0,pitch:i.pitch||0,bearing:i.bearing||0}),r.gl){var l=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(){return HTMLCanvasElement.prototype.getContext=l,r.gl}}var u=new this._MapClass(a);i.padding&&u.setPadding(i.padding),r.cursor&&(u.getCanvas().style.cursor=r.cursor),this._createShadowTransform(u);var c=u._render;u._render=function(e){t._inRender=!0,c.call(u,e),t._inRender=!1};var p=u._renderTaskQueue.run;u._renderTaskQueue.run=function(e){p.call(u._renderTaskQueue,e),t._onBeforeRepaint()},u.on("render",(function(){return t._onAfterRepaint()}));var g=u.fire;for(var h in u.fire=this._fireEvent.bind(this,g),u.on("resize",(function(){t._renderTransform.resize(u.transform.width,u.transform.height)})),u.on("styledata",(function(){t._updateStyleComponents(t.props,{}),s(u.transform,t._renderTransform)})),u.on("sourcedata",(function(){return t._updateStyleComponents(t.props,{})})),m)u.on(h,this._onPointerEvent);for(var b in v)u.on(b,this._onCameraEvent);for(var _ in y)u.on(_,this._onEvent);this._map=u},t.recycle=function(){var t=this.map.getContainer().querySelector("[mapboxgl-children]");null==t||t.remove(),e.savedMaps.push(this)},t.destroy=function(){this._map.remove()},t.redraw=function(){var e=this._map;!this._inRender&&e.style&&(e._frame&&(e._frame.cancel(),e._frame=null),e._render())},t._createShadowTransform=function(e){var t,r,n=(t=e.transform,(r=t.clone()).pixelsToGLUnits=t.pixelsToGLUnits,r);e.painter.transform=n,this._renderTransform=n},t._updateSize=function(e){var t=e.viewState;if(t){var r=this._map;if(t.width!==r.transform.width||t.height!==r.transform.height)return r.resize(),!0}return!1},t._updateViewState=function(e,t){if(this._internalUpdate)return!1;var r=this._map,n=this._renderTransform,o=n.zoom,a=n.pitch,i=n.bearing,s=r.isMoving();s&&(n.cameraElevationReference="sea");var c=u(n,Object.assign({},l(r.transform),e));if(s&&(n.cameraElevationReference="ground"),c&&t){var p=this._deferredEvents;p.move=!0,p.zoom||(p.zoom=o!==n.zoom),p.rotate||(p.rotate=i!==n.bearing),p.pitch||(p.pitch=a!==n.pitch)}return s||u(r.transform,e),c},t._updateSettings=function(e,t){for(var r=this._map,n=!1,o=0,a=g;o0,a=this._queryRenderedFeatures(e.point),i=a.length>0;!i&&o&&(e.type="mouseleave",this._onPointerEvent(e)),this._hoveredFeatures=a,i&&!o&&(e.type="mouseenter",this._onPointerEvent(e)),e.type=n}else this._hoveredFeatures=null},t._fireEvent=function(e,t,r){var n=this._map,o=n.transform,a="string"==typeof t?t:t.type;return"move"===a&&this._updateViewState(this.props,!1),a in v&&("object"==typeof t&&(t.viewState=l(o)),this._map.isMoving())?(n.transform=this._renderTransform,e.call(n,t,r),n.transform=o,n):(e.call(n,t,r),n)},t._onBeforeRepaint=function(){var e=this,t=this._map;for(var r in this._internalUpdate=!0,this._deferredEvents)this._deferredEvents[r]&&t.fire(r);this._internalUpdate=!1;var n=this._map.transform;t.transform=this._renderTransform,this._onAfterRepaint=function(){s(e._renderTransform,n),t.transform=n}},(0,a.Z)(e,[{key:"map",get:function(){return this._map}},{key:"transform",get:function(){return this._renderTransform}}]),e}();function x(){var e=null;if("undefined"!=typeof location){var t=/access_token=([^&\/]*)/.exec(location.search);e=t&&t[1]}try{e=e||"pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyNHQzdnIzYmNnMndwZGI3djNzdjVyIn0.xgCXV9mLZ47q7easx6WLCQ"}catch(r){}try{e=e||process.env.REACT_APP_MAPBOX_ACCESS_TOKEN}catch(n){}return e}b.savedMaps=[];var _=["setMaxBounds","setMinZoom","setMaxZoom","setMinPitch","setMaxPitch","setRenderWorldCopies","setProjection","setStyle","addSource","removeSource","addLayer","removeLayer","setLayerZoomRange","setFilter","setPaintProperty","setLayoutProperty","setLight","setTerrain","setFog","remove"];function w(e){if(!e)return null;for(var t,r=e.map,n={getMap:function(){return r},getCenter:function(){return e.transform.center},getZoom:function(){return e.transform.zoom},getBearing:function(){return e.transform.bearing},getPitch:function(){return e.transform.pitch},getPadding:function(){return e.transform.padding},getBounds:function(){return e.transform.getBounds()},project:function(t){var n=r.transform;r.transform=e.transform;var o=r.project(t);return r.transform=n,o},unproject:function(t){var n=r.transform;r.transform=e.transform;var o=r.unproject(t);return r.transform=n,o},queryTerrainElevation:function(t,n){var o=r.transform;r.transform=e.transform;var a=r.queryTerrainElevation(t,n);return r.transform=o,a}},o=(0,c.Z)(function(e){var t=new Set,r=e;for(;r;){for(var n,o=(0,c.Z)(Object.getOwnPropertyNames(r));!(n=o()).done;){var a=n.value;"_"!==a[0]&&"function"==typeof e[a]&&"fire"!==a&&"setEventedParent"!==a&&t.add(a)}r=Object.getPrototypeOf(r)}return Array.from(t)}(r));!(t=o()).done;){var a=t.value;a in n||_.includes(a)||(n[a]=r[a].bind(r))}return n}const S="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;var E=["baseApiUrl","maxParallelImageRequests","workerClass","workerCount","workerUrl"];var C=n.createContext(null);function k(e,t,r){var a=(0,n.useContext)(o),i=(0,n.useState)(null),s=i[0],l=i[1],u=(0,n.useRef)(),p=(0,n.useRef)({mapLib:null,map:null}).current;(0,n.useEffect)((function(){var t,n=e.mapLib,o=!0;return Promise.resolve(n||r).then((function(r){if(o){if(!r)throw new Error("Invalid mapLib");var n="Map"in r?r:r.default;if(!n.Map)throw new Error("Invalid mapLib");if(function(e,t){for(var r,n=(0,c.Z)(E);!(r=n()).done;){var o=r.value;o in t&&(e[o]=t[o])}var a=t.RTLTextPlugin,i=void 0===a?"https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js":a;i&&e.getRTLTextPluginStatus&&"unavailable"===e.getRTLTextPluginStatus()&&e.setRTLTextPlugin(i,(function(e){e&&console.error(e)}),!1)}(n,e),n.supported&&!n.supported(e))throw new Error("Map is not supported by this browser");e.reuseMaps&&(t=b.reuse(e,u.current)),t||(t=new b(n.Map,e,u.current)),p.map=w(t),p.mapLib=n,l(t),null==a||a.onMapMount(p.map,e.id)}})).catch((function(t){var r=e.onError;r?r({type:"error",target:null,originalEvent:null,error:t}):console.error(t)})),function(){o=!1,t&&(null==a||a.onMapUnmount(e.id),e.reuseMaps?t.recycle():t.destroy())}}),[]),S((function(){s&&s.setProps(e)})),(0,n.useImperativeHandle)(t,(function(){return p.map}),[s]);var d=(0,n.useMemo)((function(){return Object.assign({position:"relative",width:"100%",height:"100%"},e.style)}),[e.style]);return n.createElement("div",{id:e.id,ref:u,style:d},s&&n.createElement(C.Provider,{value:p},n.createElement("div",{"mapboxgl-children":"",style:{height:"100%"}},e.children)))}var L=r(3935),P=/box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;function O(e,t){if(e&&t){var r=e.style;for(var n in t){var o=t[n];Number.isFinite(o)&&!P.test(n)?r[n]=o+"px":r[n]=o}}}function j(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,i=(0,n.useRef)({props:e});i.current.props=e;var s=(0,n.useMemo)((function(){var t=!1;n.Children.forEach(e.children,(function(e){e&&(t=!0)}));var r=Object.assign({},e,{element:t?document.createElement("div"):null}),o=new a.Marker(r);return o.setLngLat([e.longitude,e.latitude]),o.getElement().addEventListener("click",(function(e){null==i.current.props.onClick||i.current.props.onClick({type:"click",target:o,originalEvent:e})})),o.on("dragstart",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragStart||i.current.props.onDragStart(t)})),o.on("drag",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDrag||i.current.props.onDrag(t)})),o.on("dragend",(function(e){var t=e;t.lngLat=s.getLngLat(),null==i.current.props.onDragEnd||i.current.props.onDragEnd(t)})),o}),[]);(0,n.useEffect)((function(){return s.addTo(o.getMap()),function(){s.remove()}}),[]);var l,u,c,p,d,f,m=e.longitude,v=e.latitude,y=e.offset,g=e.style,h=e.draggable,b=void 0!==h&&h,x=e.popup,_=void 0===x?null:x,w=e.rotation,S=void 0===w?0:w,E=e.rotationAlignment,k=void 0===E?"auto":E,P=e.pitchAlignment,j=void 0===P?"auto":P;return(0,n.useEffect)((function(){O(s.getElement(),g)}),[g]),(0,n.useImperativeHandle)(t,(function(){return s}),[]),s.getLngLat().lng===m&&s.getLngLat().lat===v||s.setLngLat([m,v]),y&&(l=s.getOffset(),u=y,c=Array.isArray(l)?l[0]:l?l.x:0,p=Array.isArray(l)?l[1]:l?l.y:0,d=Array.isArray(u)?u[0]:u?u.x:0,f=Array.isArray(u)?u[1]:u?u.y:0,c!==d||p!==f)&&s.setOffset(y),s.isDraggable()!==b&&s.setDraggable(b),s.getRotation()!==S&&s.setRotation(S),s.getRotationAlignment()!==k&&s.setRotationAlignment(k),s.getPitchAlignment()!==j&&s.setPitchAlignment(j),s.getPopup()!==_&&s.setPopup(_),(0,L.createPortal)(e.children,s.getElement())}const M=(0,n.memo)((0,n.forwardRef)(j));function T(e){return new Set(e?e.trim().split(/\s+/):[])}function z(e,t){var r=(0,n.useContext)(C),o=r.map,a=r.mapLib,s=(0,n.useMemo)((function(){return document.createElement("div")}),[]),l=(0,n.useRef)({props:e});l.current.props=e;var u=(0,n.useMemo)((function(){var t=Object.assign({},e),r=new a.Popup(t);return r.setLngLat([e.longitude,e.latitude]),r.once("open",(function(e){null==l.current.props.onOpen||l.current.props.onOpen(e)})),r}),[]);if((0,n.useEffect)((function(){var e=function(e){null==l.current.props.onClose||l.current.props.onClose(e)};return u.on("close",e),u.setDOMContent(s).addTo(o.getMap()),function(){u.off("close",e),u.isOpen()&&u.remove()}}),[]),(0,n.useEffect)((function(){O(u.getElement(),e.style)}),[e.style]),(0,n.useImperativeHandle)(t,(function(){return u}),[]),u.isOpen()&&(u.getLngLat().lng===e.longitude&&u.getLngLat().lat===e.latitude||u.setLngLat([e.longitude,e.latitude]),e.offset&&!i(u.options.offset,e.offset)&&u.setOffset(e.offset),u.options.anchor===e.anchor&&u.options.maxWidth===e.maxWidth||(u.options.anchor=e.anchor,u.setMaxWidth(e.maxWidth)),u.options.className!==e.className)){for(var p,d=T(u.options.className),f=T(e.className),m=(0,c.Z)(d);!(p=m()).done;){var v=p.value;f.has(v)||u.removeClassName(v)}for(var y,g=(0,c.Z)(f);!(y=g()).done;){var h=y.value;d.has(h)||u.addClassName(h)}u.options.className=e.className}return(0,L.createPortal)(e.children,s)}const R=(0,n.memo)((0,n.forwardRef)(z));const A=function(e,t,r,o){var a=(0,n.useContext)(C),i=(0,n.useMemo)((function(){return e(a)}),[]);return(0,n.useEffect)((function(){var e=o||r||t,n="function"==typeof t&&"function"==typeof r?t:null,s="function"==typeof r?r:"function"==typeof t?t:null,l=a.map;return l.hasControl(i)||(l.addControl(i,null==e?void 0:e.position),n&&n(a)),function(){s&&s(a),l.hasControl(i)&&l.removeControl(i)}}),[]),i};function Z(e){var t=A((function(t){return new t.mapLib.FullscreenControl({container:e.containerId&&document.getElementById(e.containerId)})}),{position:e.position});return(0,n.useEffect)((function(){O(t._controlContainer,e.style)}),[e.style]),null}const I=(0,n.memo)(Z);function D(e,t){var r=(0,n.useRef)({props:e}),o=A((function(t){var n=new t.mapLib.GeolocateControl(e),o=n._setupUI;return n._setupUI=function(e){n._container.hasChildNodes()||o(e)},n.on("geolocate",(function(e){null==r.current.props.onGeolocate||r.current.props.onGeolocate(e)})),n.on("error",(function(e){null==r.current.props.onError||r.current.props.onError(e)})),n.on("outofmaxbounds",(function(e){null==r.current.props.onOutOfMaxBounds||r.current.props.onOutOfMaxBounds(e)})),n.on("trackuserlocationstart",(function(e){null==r.current.props.onTrackUserLocationStart||r.current.props.onTrackUserLocationStart(e)})),n.on("trackuserlocationend",(function(e){null==r.current.props.onTrackUserLocationEnd||r.current.props.onTrackUserLocationEnd(e)})),n}),{position:e.position});return r.current.props=e,(0,n.useImperativeHandle)(t,(function(){return o}),[]),(0,n.useEffect)((function(){O(o._container,e.style)}),[e.style]),null}const N=(0,n.memo)((0,n.forwardRef)(D));function U(e){var t=A((function(t){return new t.mapLib.NavigationControl(e)}),{position:e.position});return(0,n.useEffect)((function(){O(t._container,e.style)}),[e.style]),null}const F=(0,n.memo)(U);function B(e){var t=A((function(t){return new t.mapLib.ScaleControl(e)}),{position:e.position}),r=(0,n.useRef)(e),o=r.current;r.current=e;var a=e.style;return void 0!==e.maxWidth&&e.maxWidth!==o.maxWidth&&(t.options.maxWidth=e.maxWidth),void 0!==e.unit&&e.unit!==o.unit&&t.setUnit(e.unit),(0,n.useEffect)((function(){O(t._container,a)}),[a]),null}const W=(0,n.memo)(B);function $(e,t){if(!e)throw new Error(t)}var H=0;const V=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-layer-"+H++}),[]);if((0,n.useEffect)((function(){if(t){var e=function(){return o((function(e){return e+1}))};return t.on("styledata",e),e(),function(){t.off("styledata",e),t.style&&t.style._loaded&&t.getLayer(a)&&t.removeLayer(a)}}}),[t]),t&&t.style&&t.getLayer(a))try{!function(e,t,r,n){if($(r.id===n.id,"layer id changed"),$(r.type===n.type,"layer type changed"),"custom"!==r.type&&"custom"!==n.type){var o=r.layout,a=void 0===o?{}:o,s=r.paint,l=void 0===s?{}:s,u=r.filter,c=r.minzoom,p=r.maxzoom,d=r.beforeId;if(d!==n.beforeId&&e.moveLayer(t,d),a!==n.layout){var f=n.layout||{};for(var m in a)i(a[m],f[m])||e.setLayoutProperty(t,m,a[m]);for(var v in f)a.hasOwnProperty(v)||e.setLayoutProperty(t,v,void 0)}if(l!==n.paint){var y=n.paint||{};for(var g in l)i(l[g],y[g])||e.setPaintProperty(t,g,l[g]);for(var h in y)l.hasOwnProperty(h)||e.setPaintProperty(t,h,void 0)}i(u,n.filter)||e.setFilter(t,u),c===n.minzoom&&p===n.maxzoom||e.setLayerZoomRange(t,c,p)}}(t,a,e,r.current)}catch(s){console.warn(s)}else!function(e,t,r){if(e.style&&e.style._loaded&&(!("source"in r)||e.getSource(r.source))){var n=Object.assign({},r,{id:t});delete n.beforeId,e.addLayer(n,r.beforeId)}}(t,a,e);return r.current=e,null};var q=0;const G=function(e){var t=(0,n.useContext)(C).map.getMap(),r=(0,n.useRef)(e),o=(0,n.useState)(0)[1],a=(0,n.useMemo)((function(){return e.id||"jsx-source-"+q++}),[]);(0,n.useEffect)((function(){if(t){var e=function(){return setTimeout((function(){return o((function(e){return e+1}))}),0)};return t.on("styledata",e),e(),function(){if(t.off("styledata",e),t.style&&t.style._loaded&&t.getSource(a)){var r,n=null==(r=t.getStyle())?void 0:r.layers;if(n)for(var o,i=(0,c.Z)(n);!(o=i()).done;){var s=o.value;s.source===a&&t.removeLayer(s.id)}t.removeSource(a)}}}}),[t]);var s=t&&t.style&&t.getSource(a);return s?function(e,t,r){$(t.id===r.id,"source id changed"),$(t.type===r.type,"source type changed");var n="",o=0;for(var a in t)"children"===a||"id"===a||i(r[a],t[a])||(n=a,o++);if(o){var s=t.type;if("geojson"===s)e.setData(t.data);else if("image"===s)e.updateImage({url:t.url,coordinates:t.coordinates});else if("setCoordinates"in e&&1===o&&"coordinates"===n)e.setCoordinates(t.coordinates);else if("setUrl"in e)switch(n){case"url":e.setUrl(t.url);break;case"tiles":e.setTiles(t.tiles)}else console.warn("Unable to update prop: "+n)}}(s,e,r.current):s=function(e,t,r){if(e.style&&e.style._loaded){var n=Object.assign({},r);return delete n.id,delete n.children,e.addSource(t,n),e.getSource(t)}return null}(t,a,e),r.current=e,s&&n.Children.map(e.children,(function(e){return e&&(0,n.cloneElement)(e,{source:a})}))||null};var J=r.e(8539).then(r.t.bind(r,8539,23)),Q=n.forwardRef((function(e,t){return k(e,t,J)})),X=M,K=R,Y=I,ee=F,te=N,re=W,ne=V,oe=G;const ae=Q},745:(e,t,r)=>{var n=r(3935);n.createRoot,n.hydrateRoot},1202:(e,t,r)=>{r.d(t,{Z:()=>i});var n=r(1002);function o(e){var t=function(e,t){if("object"!==(0,n.Z)(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,t||"default");if("object"!==(0,n.Z)(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"===(0,n.Z)(t)?t:String(t)}function a(e,t){for(var r=0;r{e.exports=JSON.parse('{"version":8,"name":"Basic","metadata":{"mapbox:autocomposite":true},"sources":{"mapbox":{"url":"mapbox://mapbox.mapbox-streets-v7","type":"vector"}},"sprite":"mapbox://sprites/mapbox/basic-v8","glyphs":"mapbox://fonts/mapbox/{fontstack}/{range}.pbf","layers":[{"id":"background","type":"background","paint":{"background-color":"#dedede"},"interactive":true},{"id":"landuse_overlay_national_park","type":"fill","source":"mapbox","source-layer":"landuse_overlay","filter":["==","class","national_park"],"paint":{"fill-color":"#d2edae","fill-opacity":0.75},"interactive":true},{"id":"landuse_park","type":"fill","source":"mapbox","source-layer":"landuse","filter":["==","class","park"],"paint":{"fill-color":"#d2edae"},"interactive":true},{"id":"waterway","type":"line","source":"mapbox","source-layer":"waterway","filter":["all",["==","$type","LineString"],["in","class","river","canal"]],"paint":{"line-color":"#a0cfdf","line-width":{"base":1.4,"stops":[[8,0.5],[20,15]]}},"interactive":true},{"id":"water","type":"fill","source":"mapbox","source-layer":"water","paint":{"fill-color":"#a0cfdf"},"interactive":true},{"id":"building","type":"fill","source":"mapbox","source-layer":"building","paint":{"fill-color":"#d6d6d6"},"interactive":true},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","tunnel"]]],"type":"line","source":"mapbox","id":"tunnel_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]},"line-dasharray":[0.36,0.18]},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","tunnel"]]],"type":"line","source":"mapbox","id":"tunnel_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]},"line-dasharray":[0.28,0.14]},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["in","structure","none","ford"]]],"type":"line","source":"mapbox","id":"road_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["in","structure","none","ford"]]],"type":"line","source":"mapbox","id":"road_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_minor case","paint":{"line-color":"#dedede","line-width":{"base":1.6,"stops":[[12,0.5],[20,10]]},"line-gap-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"butt","line-join":"miter"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_major case","paint":{"line-color":"#dedede","line-width":{"base":1.6,"stops":[[12,0.5],[20,10]]},"line-gap-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway_link","street","street_limited","service","track","pedestrian","path","link"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_minor","paint":{"line-color":"#efefef","line-width":{"base":1.55,"stops":[[4,0.25],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["in","class","motorway","primary","secondary","tertiary","trunk"],["==","structure","bridge"]]],"type":"line","source":"mapbox","id":"bridge_major","paint":{"line-color":"#fff","line-width":{"base":1.4,"stops":[[6,0.5],[20,30]]}},"source-layer":"road"},{"interactive":true,"layout":{"line-cap":"round","line-join":"round"},"filter":["all",["==","$type","LineString"],["all",["<=","admin_level",2],["==","maritime",0]]],"type":"line","source":"mapbox","id":"admin_country","paint":{"line-color":"#8b8a8a","line-width":{"base":1.3,"stops":[[3,0.5],[22,15]]}},"source-layer":"admin"},{"interactive":true,"minzoom":5,"layout":{"icon-image":"{maki}-11","text-offset":[0,0.5],"text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-max-width":8,"text-anchor":"top","text-size":11,"icon-size":1},"filter":["all",["==","$type","Point"],["all",["==","scalerank",1],["==","localrank",1]]],"type":"symbol","source":"mapbox","id":"poi_label","paint":{"text-color":"#666","text-halo-width":1,"text-halo-color":"rgba(255,255,255,0.75)","text-halo-blur":1},"source-layer":"poi_label"},{"interactive":true,"layout":{"symbol-placement":"line","text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-transform":"uppercase","text-letter-spacing":0.1,"text-size":{"base":1.4,"stops":[[10,8],[20,14]]}},"filter":["all",["==","$type","LineString"],["in","class","motorway","primary","secondary","tertiary","trunk"]],"type":"symbol","source":"mapbox","id":"road_major_label","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":2},"source-layer":"road_label"},{"interactive":true,"minzoom":8,"layout":{"text-field":"{name_en}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-max-width":6,"text-size":{"stops":[[6,12],[12,16]]}},"filter":["all",["==","$type","Point"],["in","type","town","village","hamlet","suburb","neighbourhood","island"]],"type":"symbol","source":"mapbox","id":"place_label_other","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"place_label"},{"interactive":true,"layout":{"text-field":"{name_en}","text-font":["Open Sans Bold","Arial Unicode MS Bold"],"text-max-width":10,"text-size":{"stops":[[3,12],[8,16]]}},"maxzoom":16,"filter":["all",["==","$type","Point"],["==","type","city"]],"type":"symbol","source":"mapbox","id":"place_label_city","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"place_label"},{"interactive":true,"layout":{"text-field":"{name_en}","text-font":["Open Sans Regular","Arial Unicode MS Regular"],"text-max-width":10,"text-size":{"stops":[[3,14],[8,22]]}},"maxzoom":12,"filter":["==","$type","Point"],"type":"symbol","source":"mapbox","id":"country_label","paint":{"text-color":"#666","text-halo-color":"rgba(255,255,255,0.75)","text-halo-width":1,"text-halo-blur":1},"source-layer":"country_label"}]}')}}]); \ No newline at end of file diff --git a/assets/js/runtime~main.00fe898c.js b/assets/js/runtime~main.89c84524.js similarity index 51% rename from assets/js/runtime~main.00fe898c.js rename to assets/js/runtime~main.89c84524.js index c31de2ad..5abfddee 100644 --- a/assets/js/runtime~main.00fe898c.js +++ b/assets/js/runtime~main.89c84524.js @@ -1 +1 @@ -(()=>{"use strict";var e,a,t,f,r,c={},d={};function o(e){var a=d[e];if(void 0!==a)return a.exports;var t=d[e]={id:e,loaded:!1,exports:{}};return c[e].call(t.exports,t,t.exports,o),t.loaded=!0,t.exports}o.m=c,o.c=d,e=[],o.O=(a,t,f,r)=>{if(!t){var c=1/0;for(i=0;i=r)&&Object.keys(o.O).every((e=>o.O[e](t[b])))?t.splice(b--,1):(d=!1,r0&&e[i-1][2]>r;i--)e[i]=e[i-1];e[i]=[t,f,r]},o.n=e=>{var a=e&&e.__esModule?()=>e.default:()=>e;return o.d(a,{a:a}),a},t=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,o.t=function(e,f){if(1&f&&(e=this(e)),8&f)return e;if("object"==typeof e&&e){if(4&f&&e.__esModule)return e;if(16&f&&"function"==typeof e.then)return e}var r=Object.create(null);o.r(r);var c={};a=a||[null,t({}),t([]),t(t)];for(var d=2&f&&e;"object"==typeof d&&!~a.indexOf(d);d=t(d))Object.getOwnPropertyNames(d).forEach((a=>c[a]=()=>e[a]));return c.default=()=>e,o.d(r,c),r},o.d=(e,a)=>{for(var t in a)o.o(a,t)&&!o.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:a[t]})},o.f={},o.e=e=>Promise.all(Object.keys(o.f).reduce(((a,t)=>(o.f[t](e,a),a)),[])),o.u=e=>"assets/js/"+({53:"935f2afb",81:"c708b2bd",811:"2fcc0790",1089:"4ef1d265",1275:"8c46b439",1341:"3a4d92a3",1408:"90db1e5e",1528:"65007ee8",1568:"3fde0636",1936:"8c5fad44",2005:"75c0cf84",2037:"9027671b",2134:"2632493b",2203:"339cc0f4",2344:"5990ff10",2930:"608d6ba6",3169:"031c51a4",4221:"e11cd556",4681:"38d649ee",4692:"43b8766d",4919:"c01e6949",5004:"12488a06",5109:"f5c39129",5116:"1b252c8c",5186:"2b604174",5301:"d129df65",5326:"232a0b40",5504:"2da7f285",5767:"b5a28556",6181:"a60670d2",6671:"d3b36758",6701:"f96a57ac",7054:"9dd8a0d2",7188:"e7028587",7572:"b12b2772",7679:"db347bd1",7799:"74fcda8e",7918:"17896441",7920:"1a4e3797",7944:"275961e3",8382:"ecfe08ed",8541:"a53bf9a6",8559:"8e251904",8695:"73266c93",9086:"9e2aef7f",9162:"5596474f",9255:"cfa22294",9514:"1be78505",9609:"07881648",9970:"74ea5050",9984:"352ab42e"}[e]||e)+"."+{53:"2972a6a2",63:"27b6da9c",81:"90caf89e",84:"417f2f1f",811:"2fa2fbf7",861:"770e7e92",1089:"069c1c16",1275:"21679d5f",1341:"4457ee0b",1408:"b810799f",1528:"4f3b9457",1568:"49ae1182",1936:"6558d11b",2005:"4728612f",2037:"0ce25df3",2134:"9d7ad907",2203:"9d51fe55",2344:"3c22b4c2",2930:"24dc736b",3169:"a7da9c24",3220:"b365ff01",4221:"e3bebb98",4681:"9127bd6e",4692:"ee5c1594",4919:"272afcb3",4972:"8e046a82",5004:"e53e8bff",5109:"f48d72ba",5116:"60747423",5186:"6e37e49f",5301:"482da894",5326:"d031c7c5",5504:"20093421",5525:"373971e1",5767:"5d8924d5",6181:"ba9f1c88",6583:"1830d27b",6671:"481f4bda",6701:"f48a8a18",7054:"701fe00e",7188:"70c5661e",7572:"1bb3c5e4",7679:"c17f8258",7799:"0d97c384",7918:"a133d223",7920:"98b2d0cd",7944:"3a5a94f0",8382:"30040285",8443:"a6ae2560",8539:"3723c84b",8541:"1c2d417d",8559:"23750323",8695:"57300461",9086:"184046a9",9162:"9caf4ca7",9255:"9a8bdf1d",9514:"55891a32",9609:"45b12b74",9718:"fdbf2a72",9970:"eab6289f",9984:"e4325aa6"}[e]+".js",o.miniCssF=e=>{},o.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),o.o=(e,a)=>Object.prototype.hasOwnProperty.call(e,a),f={},r="react-map-gl-website:",o.l=(e,a,t,c)=>{if(f[e])f[e].push(a);else{var d,b;if(void 0!==t)for(var n=document.getElementsByTagName("script"),i=0;i{d.onerror=d.onload=null,clearTimeout(s);var r=f[e];if(delete f[e],d.parentNode&&d.parentNode.removeChild(d),r&&r.forEach((e=>e(t))),a)return a(t)},s=setTimeout(u.bind(null,void 0,{type:"timeout",target:d}),12e4);d.onerror=u.bind(null,d.onerror),d.onload=u.bind(null,d.onload),b&&document.head.appendChild(d)}},o.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.nmd=e=>(e.paths=[],e.children||(e.children=[]),e),o.p="/react-map-gl/",o.gca=function(e){return e={17896441:"7918","935f2afb":"53",c708b2bd:"81","2fcc0790":"811","4ef1d265":"1089","8c46b439":"1275","3a4d92a3":"1341","90db1e5e":"1408","65007ee8":"1528","3fde0636":"1568","8c5fad44":"1936","75c0cf84":"2005","9027671b":"2037","2632493b":"2134","339cc0f4":"2203","5990ff10":"2344","608d6ba6":"2930","031c51a4":"3169",e11cd556:"4221","38d649ee":"4681","43b8766d":"4692",c01e6949:"4919","12488a06":"5004",f5c39129:"5109","1b252c8c":"5116","2b604174":"5186",d129df65:"5301","232a0b40":"5326","2da7f285":"5504",b5a28556:"5767",a60670d2:"6181",d3b36758:"6671",f96a57ac:"6701","9dd8a0d2":"7054",e7028587:"7188",b12b2772:"7572",db347bd1:"7679","74fcda8e":"7799","1a4e3797":"7920","275961e3":"7944",ecfe08ed:"8382",a53bf9a6:"8541","8e251904":"8559","73266c93":"8695","9e2aef7f":"9086","5596474f":"9162",cfa22294:"9255","1be78505":"9514","07881648":"9609","74ea5050":"9970","352ab42e":"9984"}[e]||e,o.p+o.u(e)},(()=>{var e={1303:0,532:0};o.f.j=(a,t)=>{var f=o.o(e,a)?e[a]:void 0;if(0!==f)if(f)t.push(f[2]);else if(/^(1303|532)$/.test(a))e[a]=0;else{var r=new Promise(((t,r)=>f=e[a]=[t,r]));t.push(f[2]=r);var c=o.p+o.u(a),d=new Error;o.l(c,(t=>{if(o.o(e,a)&&(0!==(f=e[a])&&(e[a]=void 0),f)){var r=t&&("load"===t.type?"missing":t.type),c=t&&t.target&&t.target.src;d.message="Loading chunk "+a+" failed.\n("+r+": "+c+")",d.name="ChunkLoadError",d.type=r,d.request=c,f[1](d)}}),"chunk-"+a,a)}},o.O.j=a=>0===e[a];var a=(a,t)=>{var f,r,[c,d,b]=t,n=0;if(c.some((a=>0!==e[a]))){for(f in d)o.o(d,f)&&(o.m[f]=d[f]);if(b)var i=b(o)}for(a&&a(t);n{"use strict";var e,a,t,f,r,c={},d={};function b(e){var a=d[e];if(void 0!==a)return a.exports;var t=d[e]={id:e,loaded:!1,exports:{}};return c[e].call(t.exports,t,t.exports,b),t.loaded=!0,t.exports}b.m=c,b.c=d,e=[],b.O=(a,t,f,r)=>{if(!t){var c=1/0;for(i=0;i=r)&&Object.keys(b.O).every((e=>b.O[e](t[o])))?t.splice(o--,1):(d=!1,r0&&e[i-1][2]>r;i--)e[i]=e[i-1];e[i]=[t,f,r]},b.n=e=>{var a=e&&e.__esModule?()=>e.default:()=>e;return b.d(a,{a:a}),a},t=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,b.t=function(e,f){if(1&f&&(e=this(e)),8&f)return e;if("object"==typeof e&&e){if(4&f&&e.__esModule)return e;if(16&f&&"function"==typeof e.then)return e}var r=Object.create(null);b.r(r);var c={};a=a||[null,t({}),t([]),t(t)];for(var d=2&f&&e;"object"==typeof d&&!~a.indexOf(d);d=t(d))Object.getOwnPropertyNames(d).forEach((a=>c[a]=()=>e[a]));return c.default=()=>e,b.d(r,c),r},b.d=(e,a)=>{for(var t in a)b.o(a,t)&&!b.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:a[t]})},b.f={},b.e=e=>Promise.all(Object.keys(b.f).reduce(((a,t)=>(b.f[t](e,a),a)),[])),b.u=e=>"assets/js/"+({53:"935f2afb",81:"c708b2bd",811:"2fcc0790",1089:"4ef1d265",1275:"8c46b439",1341:"3a4d92a3",1408:"90db1e5e",1528:"65007ee8",1568:"3fde0636",1936:"8c5fad44",2005:"75c0cf84",2037:"9027671b",2134:"2632493b",2203:"339cc0f4",2344:"5990ff10",2930:"608d6ba6",3169:"031c51a4",4221:"e11cd556",4681:"38d649ee",4692:"43b8766d",4919:"c01e6949",5004:"12488a06",5109:"f5c39129",5116:"1b252c8c",5186:"2b604174",5301:"d129df65",5326:"232a0b40",5504:"2da7f285",5767:"b5a28556",6181:"a60670d2",6671:"d3b36758",6701:"f96a57ac",7054:"9dd8a0d2",7188:"e7028587",7572:"b12b2772",7679:"db347bd1",7799:"74fcda8e",7918:"17896441",7920:"1a4e3797",7944:"275961e3",8382:"ecfe08ed",8541:"a53bf9a6",8559:"8e251904",8695:"73266c93",9086:"9e2aef7f",9162:"5596474f",9255:"cfa22294",9514:"1be78505",9609:"07881648",9970:"74ea5050",9984:"352ab42e"}[e]||e)+"."+{53:"2972a6a2",63:"27b6da9c",81:"19234b46",84:"417f2f1f",811:"2fa2fbf7",861:"770e7e92",1089:"069c1c16",1275:"21679d5f",1341:"6216717c",1408:"a2492c5f",1528:"f1505205",1568:"49ae1182",1936:"6558d11b",2005:"4728612f",2037:"0ce25df3",2134:"a4d88196",2203:"9d51fe55",2344:"a9a33e03",2930:"24dc736b",3169:"a7da9c24",3220:"b365ff01",4221:"7482b3e9",4681:"9127bd6e",4692:"ee5c1594",4919:"272afcb3",4972:"8e046a82",5004:"a16db516",5109:"f48d72ba",5116:"60747423",5186:"be966c49",5301:"482da894",5326:"42f957e3",5504:"20093421",5525:"373971e1",5767:"5d8924d5",6181:"155b6fc0",6583:"1830d27b",6671:"481f4bda",6701:"62d60b6f",7054:"701fe00e",7188:"70c5661e",7572:"cf8799a9",7679:"c17f8258",7799:"0d97c384",7918:"a133d223",7920:"98b2d0cd",7944:"3a5a94f0",8382:"30040285",8443:"a6ae2560",8539:"3723c84b",8541:"6acf0263",8559:"23750323",8695:"57300461",9086:"136067b5",9162:"9caf4ca7",9255:"9a8bdf1d",9514:"55891a32",9609:"45b12b74",9718:"fdbf2a72",9970:"d3367f4a",9984:"e4325aa6"}[e]+".js",b.miniCssF=e=>{},b.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),b.o=(e,a)=>Object.prototype.hasOwnProperty.call(e,a),f={},r="react-map-gl-website:",b.l=(e,a,t,c)=>{if(f[e])f[e].push(a);else{var d,o;if(void 0!==t)for(var n=document.getElementsByTagName("script"),i=0;i{d.onerror=d.onload=null,clearTimeout(s);var r=f[e];if(delete f[e],d.parentNode&&d.parentNode.removeChild(d),r&&r.forEach((e=>e(t))),a)return a(t)},s=setTimeout(u.bind(null,void 0,{type:"timeout",target:d}),12e4);d.onerror=u.bind(null,d.onerror),d.onload=u.bind(null,d.onload),o&&document.head.appendChild(d)}},b.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},b.nmd=e=>(e.paths=[],e.children||(e.children=[]),e),b.p="/react-map-gl/",b.gca=function(e){return e={17896441:"7918","935f2afb":"53",c708b2bd:"81","2fcc0790":"811","4ef1d265":"1089","8c46b439":"1275","3a4d92a3":"1341","90db1e5e":"1408","65007ee8":"1528","3fde0636":"1568","8c5fad44":"1936","75c0cf84":"2005","9027671b":"2037","2632493b":"2134","339cc0f4":"2203","5990ff10":"2344","608d6ba6":"2930","031c51a4":"3169",e11cd556:"4221","38d649ee":"4681","43b8766d":"4692",c01e6949:"4919","12488a06":"5004",f5c39129:"5109","1b252c8c":"5116","2b604174":"5186",d129df65:"5301","232a0b40":"5326","2da7f285":"5504",b5a28556:"5767",a60670d2:"6181",d3b36758:"6671",f96a57ac:"6701","9dd8a0d2":"7054",e7028587:"7188",b12b2772:"7572",db347bd1:"7679","74fcda8e":"7799","1a4e3797":"7920","275961e3":"7944",ecfe08ed:"8382",a53bf9a6:"8541","8e251904":"8559","73266c93":"8695","9e2aef7f":"9086","5596474f":"9162",cfa22294:"9255","1be78505":"9514","07881648":"9609","74ea5050":"9970","352ab42e":"9984"}[e]||e,b.p+b.u(e)},(()=>{var e={1303:0,532:0};b.f.j=(a,t)=>{var f=b.o(e,a)?e[a]:void 0;if(0!==f)if(f)t.push(f[2]);else if(/^(1303|532)$/.test(a))e[a]=0;else{var r=new Promise(((t,r)=>f=e[a]=[t,r]));t.push(f[2]=r);var c=b.p+b.u(a),d=new Error;b.l(c,(t=>{if(b.o(e,a)&&(0!==(f=e[a])&&(e[a]=void 0),f)){var r=t&&("load"===t.type?"missing":t.type),c=t&&t.target&&t.target.src;d.message="Loading chunk "+a+" failed.\n("+r+": "+c+")",d.name="ChunkLoadError",d.type=r,d.request=c,f[1](d)}}),"chunk-"+a,a)}},b.O.j=a=>0===e[a];var a=(a,t)=>{var f,r,[c,d,o]=t,n=0;if(c.some((a=>0!==e[a]))){for(f in d)b.o(d,f)&&(b.m[f]=d[f]);if(o)var i=o(b)}for(a&&a(t);n Introduction | React Map GL - +

Introduction

These docs are forLooking for an old version?

react-map-gl is a suite of React components for Mapbox GL JS-compatible libraries.

LibraryDescription
MapLibreAn open fork of mapbox-gl v1, that can be used without a mapbox token.
Mapbox GL JS v1The 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 v2The 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 forksIt 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.

For basemaps:

  • You can load map data from Mapbox's own service.
  • You can create and host your own map data using one of the many open source tools.

New to react-map-gl? Get Started

Want to contribute? See our Developer Guide

Design Philosophy​

react-map-gl was first created by Uber's Visualization team, where Mapbox was used as a component to build powerful web tools such as geospatial analytics and self-driving data visualization. To manage the complexity of these applications, we fully embrace React and reactive programming.

The stock mapbox-gl APIs are imperative. That is, you instruct the map to do something (for example, map.flyTo), and it will execute the command at its own pace.

This does not scale when we have many components that need to synchronize with each other. We sometimes render two maps side by side, and when the user interacts with one, update both cameras. We draw React UI outside of the map container, that moves with the camera. We also render WebGL graphic overlays on top of the map, most notably with deck.gl. In these use cases, in order for all components to synchronize correctly, they must have their shared states managed by React. We might store the source of truth in a parent component state, or Redux store, or hooks, and let it propagate down to the map as well as its peers.

Ultimately, in the spirit of the reactive programming paradigm, data always flows down. As long as the map manages its own state, as mapbox-gl is designed to do, we risk the components going out of sync.

react-map-gl creates a fully reactive wrapper for mapbox-gl. The Map component can be fully controlled, that is, the map's camera would never deviate from the props that it's assigned. Read more about this core behavior in state management.

Limitations​

In v7.0, react-map-gl was fully rewritten to better align its API with the underlying Mapbox GL JS library. Wherever the reactive usage patterns permits, the wrapper's props and methods are 1:1 mappings to their native API equivelants.

It is possible to call the native methods directly from the Map instance obtained via getMap. However, doing so may result in the map's state to deviate from its props. For example, calling map.setMaxZoom directly will cause the map's constraint settings to differ from the value of the maxZoom prop. Generally speaking, calling a native method is disencouraged if the same thing can be achieved through the React interface. If a third-party plugin does so, then it may lead to some unexpected behaviors.

- + \ No newline at end of file diff --git a/docs/api-reference/attribution-control.html b/docs/api-reference/attribution-control.html index c89884f1..a98799f5 100644 --- a/docs/api-reference/attribution-control.html +++ b/docs/api-reference/attribution-control.html @@ -4,13 +4,13 @@ AttributionControl | React Map GL - +

AttributionControl

React component that wraps the base library's AttributionControl class (Mapbox | Maplibre).

import * as React from 'react';
import Map, {AttributionControl} from 'react-map-gl';

function App() {
  return <Map
    mapboxAccessToken="<Mapbox access token>"
    initialViewState={{
      longitude: -100,
      latitude: 40,
      zoom: 3.5
    }}
    mapStyle="mapbox://styles/mapbox/streets-v9"
    // disable the default attribution
    attributionControl={false}
  >
    <AttributionControl customAttribution="Map design by me" />
  </Map>;
}

Properties​

Reactive Properties​

style: CSSProperties​

CSS style override that applies to the control's container.

Other Properties​

The properties in this section are not reactive. They are only used when the component first mounts.

Any options supported by the AttributionControl class (Mapbox | Maplibre), such as

  • compact
  • customAttribution

Plus the following:

position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'​

Default: 'bottom-right'

Placement of the control relative to the map.

Source​

attribution-control.ts

- + \ No newline at end of file diff --git a/docs/api-reference/fullscreen-control.html b/docs/api-reference/fullscreen-control.html index 925b476b..3f593d19 100644 --- a/docs/api-reference/fullscreen-control.html +++ b/docs/api-reference/fullscreen-control.html @@ -4,13 +4,13 @@ FullscreenControl | React Map GL - +

FullscreenControl

React component that wraps the base library's FullscreenControl class (Mapbox | Maplibre).

import * as React from 'react';
import Map, {FullscreenControl} from 'react-map-gl';

function App() {
  return <Map
    mapboxAccessToken="<Mapbox access token>"
    initialViewState={{
      longitude: -100,
      latitude: 40,
      zoom: 3.5
    }}
    mapStyle="mapbox://styles/mapbox/streets-v9"
  >
    <FullscreenControl />
  </Map>;
}

Properties​

Reactive Properties​

style: CSSProperties​

CSS style override that applies to the control's container.

Other Properties​

The properties in this section are not reactive. They are only used when the component first mounts.

containerId: string​

Id of the DOM element which should be made full screen. By default, the map container element will be made full screen.

position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'​

Default: 'top-right'

Placement of the control relative to the map.

Source​

fullscreen-control.ts

- + \ No newline at end of file diff --git a/docs/api-reference/geolocate-control.html b/docs/api-reference/geolocate-control.html index 0d8db8c8..c8ea251e 100644 --- a/docs/api-reference/geolocate-control.html +++ b/docs/api-reference/geolocate-control.html @@ -4,14 +4,14 @@ GeolocateControl | React Map GL - +

GeolocateControl

React component that wraps the base library's GeolocateControl class (Mapbox | Maplibre).

import * as React from 'react';
import Map, {GeolocateControl} from 'react-map-gl';

function App() {
  return <Map
    mapboxAccessToken="<Mapbox access token>"
    initialViewState={{
      longitude: -100,
      latitude: 40,
      zoom: 3.5
    }}
    mapStyle="mapbox://styles/mapbox/streets-v9"
  >
    <GeolocateControl />
  </Map>;
}

Properties​

Reactive Properties​

style: CSSProperties​

CSS style override that applies to the control's container.

Callbacks​

onGeolocate: (evt: GeolocateResultEvent) => void​

Called on each Geolocation API position update that returned as success.

onError: (evt: GeolocateErrorEvent) => void​

Called on each Geolocation API position update that returned as an error.

onOutOfMaxBounds: (evt: GeolocateResultEvent) => void​

Called on each Geolocation API position update that returned as success but user position is out of map maxBounds.

onTrackUserLocationStart: (evt: GeolocateEvent) => void​

Called when the GeolocateControl changes to the active lock state.

onTrackUserLocationEnd: (evt: GeolocateEvent) => void​

Called when the GeolocateControl changes to the background state.

Other Properties​

The properties in this section are not reactive. They are only used when the component first mounts.

Any options supported by the GeolocateControl class (Mapbox | Maplibre), such as

  • positionOptions
  • fitBoundsOptions
  • trackUserLocation
  • showAccuracyCircle
  • showUserLocation

Plus the following:

position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'​

Default: 'bottom-right'

Placement of the control relative to the map.

Methods​

The underlying native GeolocateControl instance is accessible via a React ref hook. You may use it to call any imperative methods:

import * as React from 'react';
import {useRef, useEffect} from 'react';
import Map, {GeolocateControl} from 'react-map-gl';
import type mapboxgl from 'mapbox-gl';

function App() {
  const geoControlRef = useRef<mapboxgl.GeolocateControl>();

  useEffect(() => {
    // Activate as soon as the control is loaded
    geoControlRef.current?.trigger();
  }, [geoControlRef.current]);

  return <Map>
    <GeolocateControl ref={geoControlRef} />
  </Map>;
}

Source​

geolocate-control.ts

- + \ No newline at end of file diff --git a/docs/api-reference/layer.html b/docs/api-reference/layer.html index f0ff9c3e..24998726 100644 --- a/docs/api-reference/layer.html +++ b/docs/api-reference/layer.html @@ -4,13 +4,13 @@ Layer | React Map GL - +

Layer

This component allows apps to create a map layer using React.

import * as React from 'react';
import Map, {Layer} from 'react-map-gl';
import type {FillLayer} from 'react-map-gl';

const parkLayer: FillLayer = {
  id: 'landuse_park',
  type: 'fill',
  source: 'mapbox',
  'source-layer': 'landuse',
  filter: ['==', 'class', 'park'],
  paint: {
    'fill-color': '#4E3FC8'
  }
};

function App() {
  return <Map
    mapboxAccessToken="<Mapbox access token>"
    initialViewState={{
      longitude: -122.4,
      latitude: 37.8,
      zoom: 14
    }}
    mapStyle="mapbox://styles/mapbox/streets-v9"
  >
    <Layer {...parkLayer} />
  </Map>;
}

Properties​

The props provided to this component should be conforming to the Mapbox layer specification.

When props change shallowly, the component will perform style diffing to update the layer. Avoid defining constant objects/arrays inline may help performance.

Identity Properties​

Once a <Layer> is mounted, the following props should not change. If you add/remove multiple JSX layers dynamically, make sure you use React's key prop to give each element a stable identity.

id: string​

Unique identifier of the layer. If not provided, a default id will be assigned.

type: string​

Required. Type of the layer.

Options​

beforeId: string​

The ID of an existing layer to insert this layer before. If this prop is omitted, the layer will be appended to the end of the layers array. This is useful when using dynamic layers with a map style from a URL.

Note that layers are added by the order that they mount. They are NOT reordered later if their relative positions in the JSX tree change. If dynamic reordering is desired, you should manipulate beforeId for consistent behavior.

source: string​

source is required by some layer types in the Mapbox style specification. If <Layer> is used as the child of a Source component, this prop will be overwritten by the id of the parent source.

Source​

layer.ts

- + \ No newline at end of file diff --git a/docs/api-reference/map-provider.html b/docs/api-reference/map-provider.html index 3fef8536..4fb2e178 100644 --- a/docs/api-reference/map-provider.html +++ b/docs/api-reference/map-provider.html @@ -4,13 +4,13 @@ MapProvider | React Map GL - +

MapProvider

A Context.Provider that facilitates map operations outside of the component that directly renders a Map.

The component should wrap all nodes in which you may want to access the maps:

import {MapProvider} from 'react-map-gl';

function Root() {
  return (
    <MapProvider>
      {
        // Application tree, somewhere one or more <Map /> component(s) are rendered
      }
    </MapProvider>
  );
}

See useMap for more information.

Source​

use-map.tsx

- + \ No newline at end of file diff --git a/docs/api-reference/map.html b/docs/api-reference/map.html index f130c767..4ec3bc3c 100644 --- a/docs/api-reference/map.html +++ b/docs/api-reference/map.html @@ -4,7 +4,7 @@ default (Map) | React Map GL - + @@ -15,7 +15,7 @@ If undefined is provided, removes terrain from the map.

Mapbox | Maplibre)

doubleClickZoom: boolean​

Default: true

If true, the "double click to zoom" interaction is enabled. See DoubleClickZoomHandler (Mapbox | Maplibre).

dragRotate: boolean​

Default: true

If true, the "drag to rotate" interaction is enabled. See DragRotateHandler (Mapbox | Maplibre).

dragPan: boolean | Object​

Default: true

If true, the "drag to pan" interaction is enabled. Optionally accpt an object value that is the options to DragPanHandler.enable (Mapbox | Maplibre).

keyboard: boolean​

Default: true

If true, keyboard shortcuts are enabled. See KeyboardHandler (Mapbox | Maplibre).

scrollZoom: boolean | Object​

Default: true

If true, the "scroll to zoom" interaction is enabled. Optionally accpt an object value that is the options to ScrollZoomHandler.enable (Mapbox | Maplibre)

touchPitch: boolean | Object​

Default: true

If true, the "drag to pitch" interaction is enabled. Optionally accpt an object value that is the options to TouchPitchHandler.enable(Mapbox | Maplibre).

touchZoomRotate: boolean | Object​

Default: true

If true, the "pinch to rotate and zoom" interaction is enabled. Optionally accpt an object value that is the options to TouchZoomRotateHandler.enable (Mapbox | Maplibre).

interactiveLayerIds: string[]​

Default: null

The id(s) of style layer(s).

If specified, pointer event (mousemove, click etc.) listeners will be triggered only if its location is within a visible feature in these layers, and the event will have a features property containing an array of the matching features.

If not specified, pointer event listeners will be triggered by a corresponding event happening anywhere on the map, and the event will not have a features property.

See the Callbacks section for affected events.

Callbacks​

onResize: (event: MapEvent) => void​

Called when the map has been resized.

onLoad: (event: MapEvent) => void​

Called after all necessary resources have been downloaded and the first visually complete rendering of the map has occurred.

onRender: (event: MapEvent)) => void​

Called whenever the map is drawn to the screen.

onIdle: (event: MapEvent)) => void​

Called after the last frame rendered before the map enters an "idle" state:

  • No camera transitions are in progress
  • All currently requested tiles have loaded
  • All fade/transition animations have completed

onRemove: (event: MapEvent)) => void​

Called when the map has been removed.

onError: (event: ErrorEvent) => void​

Default: evt => console.error(evt.error)

Called when an error occurs.

onMouseDown: (event: MapLayerMouseEvent) => void​

Called when a pointing device (usually a mouse) is pressed within the map.

If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer.

onMouseUp: (event: MapLayerMouseEvent) => void​

Called when a pointing device (usually a mouse) is released within the map.

If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer.

onMouseOver: (event: MapLayerMouseEvent) => void​

Called when a pointing device (usually a mouse) is moved within the map. As you move the cursor across a web page containing a map, the event will fire each time it enters the map or any child elements.

onMouseEnter: (event: MapLayerMouseEvent) => void​

Called when a pointing device (usually a mouse) enters a visible portion of the layer(s) specified by interactiveLayerIds from outside that layer or outside the map canvas.

onMouseMove: (event: MapLayerMouseEvent) => void​

Called when a pointing device (usually a mouse) is moved while the cursor is inside the map. As you move the cursor across the map, the event will fire every time the cursor changes position within the map.

If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer.

onMouseLeave: (event: MapLayerMouseEvent) => void​

Called when a pointing device (usually a mouse) leaves a visible portion of the layer(s) specified by interactiveLayerIds or moves from the layer to outside the map canvas.

onMouseOut: (event: MapLayerMouseEvent) => void​

Called when a point device (usually a mouse) leaves the map's canvas.

onClick: (event: MapLayerMouseEvent) => void​

Called when a pointing device (usually a mouse) is pressed and released at the same point on the map.

If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer.

onDblClick: (event: MapLayerMouseEvent) => void​

Called when a pointing device (usually a mouse) is pressed and released twice at the same point on the map in rapid succession.

If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer.

onContextMenu: (event: MapLayerMouseEvent) => void​

Called when the right button of the mouse is clicked or the context menu key is pressed within the map.

If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer.

onWheel: (event: MapWheelEvent) => void​

Called when a wheel event occurs within the map.

onTouchStart: (event: MapLayerTouchEvent) => void​

Called when a touchstart event occurs within the map.

If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer.

onTouchEnd: (event: MapLayerTouchEvent) => void​

Called when a touchend event occurs within the map.

If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer.

onTouchMove: (event: MapLayerTouchEvent) => void​

Called when a touchmove event occurs within the map.

If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer.

onTouchCancel: (event: MapLayerTouchEvent) => void​

Called when a touchcancel event occurs within the map.

If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer.

onMoveStart: (event: ViewStateChangeEvent) => void​

Called just before the map begins a transition from one view to another.

onMove: (event: ViewStateChangeEvent) => void​

Called repeatedly during an animated transition from one view to another.

When Map is used as a controlled component, event.viewState reflects the view state that the camera "proposes" to move to, as a result of either user interaction or methods such as flyTo. The camera does not actually change until the application updates the view state props (longitude, latitude, zoom etc.). See state management for examples.

onMoveEnd: (event: ViewStateChangeEvent) => void​

Called just after the map completes a transition from one view to another.

onDragStart: (event: ViewStateChangeEvent) => void​

Called when a "drag to pan" interaction starts.

onDrag: (event: ViewStateChangeEvent) => void​

Called repeatedly during a "drag to pan" interaction.

onDragEnd: (event: ViewStateChangeEvent) => void​

Called when a "drag to pan" interaction ends.

onZoomStart: (event: ViewStateChangeEvent) => void​

Called just before the map begins a transition from one zoom level to another.

onZoom: (event: ViewStateChangeEvent) => void​

Called repeatedly during an animated transition from one zoom level to another.

When Map is used as a controlled component, event.viewState.zoom reflects the zoom that the camera "proposes" to change to, as a result of either user interaction or methods such as flyTo. The camera does not actually change until the application updates the zoom prop.

onZoomEnd: (event: ViewStateChangeEvent) => void​

Called just after the map completes a transition from one zoom level to another.

onRotateStart: (event: ViewStateChangeEvent) => void​

Called just before the map begins a transition from one bearing (rotation) to another.

onRotate: (event: ViewStateChangeEvent) => void​

Called repeatedly during an animated transition from one bearing (rotation) to another.

When Map is used as a controlled component, event.viewState.bearing reflects the zoom that the camera "proposes" to change to, as a result of either user interaction or methods such as flyTo. The camera does not actually change until the application updates the bearing prop.

onRotateEnd: (event: ViewStateChangeEvent) => void​

Called just after the map completes a transition from one bearing (rotation) to another.

onPitchStart: (event: ViewStateChangeEvent) => void​

Called just before the map begins a transition from one pitch (tilt) to another.

onPitch: (event: ViewStateChangeEvent) => void​

Called repeatedly during an animated transition from one pitch (tilt) to another.

When Map is used as a controlled component, event.viewState.pitch reflects the zoom that the camera "proposes" to change to, as a result of either user interaction or methods such as flyTo. The camera does not actually change until the application updates the pitch prop.

onPitchEnd: (event: ViewStateChangeEvent) => void​

Called just after the map completes a transition from one pitch (tilt) to another.

onBoxZoomStart: (event: MapBoxZoomEvent) => void​

Called when a "box zoom" interaction starts.

onBoxZoomEnd: (event: MapBoxZoomEvent) => void​

Called when a "box zoom" interaction ends.

onBoxZoomCancel: (event:MapBoxZoomEvent) => void​

Called when the user cancels a "box zoom" interaction, or when the bounding box does not meet the minimum size threshold.

onData: (event: MapStyleDataEvent | MapSourceDataEvent) => void​

Called when any map data loads or changes. See MapDataEvent for more information.

onStyleData: (event: MapStyleDataEvent) => void​

Called when the map's style loads or changes. See MapDataEvent for more information.

onSourceData: (event: MapSourceDataEvent) => void​

Called when one of the map's sources loads or changes, including if a tile belonging to a source loads or changes. See MapDataEvent for more information.

Other options​

The following props, along with any options of the Map class (Mapbox | Maplibre) not listed above, can be specified to construct the underlying Map instance.

Note: props in this section are not reactive. They are only used once when the Map instance is constructed.

mapLib: any​

Default:

  • import('mapbox-gl') if imported from react-map-gl
  • import('maplibre-gl') if imported from react-map-gl/maplibre

Specify the underlying base map library for the Map component. The value can be provided with several options:

By module import (and embedding in the final bundle):

import * as React from 'react';
import Map from 'react-map-gl';
import mapboxgl from 'mapbox-gl';

function App() {
  return <Map mapLib={mapboxgl} />;
}

By dynamic import (thus enable bundle splitting):

import * as React from 'react';
import Map from 'react-map-gl';

function App() {
  return <Map mapLib={import('mapbox-gl')} />;
}

Or to load a pre-bundled version of the library:

index.html
<script src="https://api.mapbox.com/mapbox-gl-js/v2.4.0/mapbox-gl.js" ></script>
app.tsx
import * as React from 'react';
import Map from 'react-map-gl';

function App() {
  return <Map mapLib={window.mapboxgl} />;
}

mapboxAccessToken: string​

Token used to access the Mapbox data service. See about map tokens.

baseApiUrl: string​

The map's default API URL for requesting tiles, styles, sprites, and glyphs.

maxParallelImageRequests: number​

Default: 16

The maximum number of images (raster tiles, sprites, icons) to load in parallel.

reuseMaps: boolean​

Default: false

By default, every time a map component is unmounted, all internal resources associated with the underlying Map instance are released. If the map gets mounted again, a new Map instance is constructed.

If reuseMaps is set to true, when a map component is unmounted, the underlying Map instance is retained in memory. The next time a map component gets mounted, the saved instance is reused. This behavior may be desirable if an application frequently mounts/unmounts map(s), for example in a tabbed or collapsable UI, and wants to avoid Mapbox's billable events triggered by initialization.

Note that since some map options cannot be modified after initialization, when reusing maps, only the reactive props and initialViewState of the new component are respected.

RTLTextPlugin: string​

Default: 'https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js'

Sets the map's RTL text plugin. Necessary for supporting the Arabic and Hebrew languages, which are written right-to-left.

Setting this prop is the equivelant of calling mapboxgl.setRTLTextPlugin with lazy: true.

workerClass: object​

Default: null

Provides an interface for external module bundlers such as Webpack or Rollup to package mapbox-gl's WebWorker into a separate class and integrate it with the library. Takes precedence over workerUrl.

workerCount: number​

Default: 2

The number of web workers instantiated on a page with mapbox-gl maps.

workerUrl: string​

Provides an interface for loading mapbox-gl's WebWorker bundle from a self-hosted URL. This is useful if your site needs to operate in a strict CSP (Content Security Policy) environment wherein you are not allowed to load JavaScript code from a Blob URL, which is default behavior.

Methods​

Imperative methods are accessible via a React ref or the useMap hook.

import * as React from 'react';
import {useRef, useCallback} from 'react';
import Map from 'react-map-gl';
import type {MapRef} from 'react-map-gl';

function App() {
  const mapRef = useRef<MapRef>();

  const onMapLoad = useCallback(() => {
    mapRef.current.on('move', () => {
      // do something
    });
  }, []);

  return <Map ref={mapRef} onLoad={onMapLoad} ... />;
}

The MapRef object exposes Map methods (Mapbox | Maplibre) that are safe to call without breaking the React bindings. For example, setStyle() is hidden from the ref object, because the style is supposed to be changed by updating the mapStyle prop. Calling the method directly may cause the the React prop to mismatch with the underlying state, and lead to unexpected behaviors.

You can still access the hidden members via getMap():

getMap()​

Returns the native Map (Mapbox | Maplibre) instance associated with this component.

Source​

map.tsx

- + \ No newline at end of file diff --git a/docs/api-reference/marker.html b/docs/api-reference/marker.html index 37f7fc66..f54c92d2 100644 --- a/docs/api-reference/marker.html +++ b/docs/api-reference/marker.html @@ -4,14 +4,14 @@ Marker | React Map GL - +

Marker

React component that wraps the base library's Marker class (Mapbox | Maplibre).

import * as React from 'react';
import Map, {Marker} from 'react-map-gl';

function App() {
  return <Map
    mapboxAccessToken="<Mapbox access token>"
    initialViewState={{
      longitude: -100,
      latitude: 40,
      zoom: 3.5
    }}
    mapStyle="mapbox://styles/mapbox/streets-v9"
  >
    <Marker longitude={-100} latitude={40} anchor="bottom" >
      <img src="./pin.png" />
    </Marker>
  </Map>;
}

If Marker is mounted with child components, then its content will be rendered to the specified location. If it is mounted with no content, then a default marker will be used.

Properties​

Reactive Properties​

draggable: boolean​

Default: false

If true, the marker is able to be dragged to a new position on the map.

latitude: number​

Required. The latitude of the anchor location.

longitude: number​

Required. The longitude of the anchor location.

offset: PointLike​

Default: null

The offset in pixels as a PointLike object to apply relative to the element's center. Negatives indicate left and up.

pitchAlignment: 'map' | 'viewport' | 'auto'​

Default: 'auto'

  • map aligns the Marker to the plane of the map.
  • viewport aligns the Marker to the plane of the viewport.
  • auto automatically matches the value of rotationAlignment.

An instance of the Popup class (Mapbox | Maplibre) to attach to this marker. If undefined or null, any popup set on this Marker instance is unset.

rotation: number​

Default: 0

The rotation angle of the marker in degrees, relative to its rotationAlignment setting. A positive value will rotate the marker clockwise.

rotationAlignment: 'map' | 'viewport' | 'auto'​

Default: 'auto'

  • map aligns the Marker's rotation relative to the map, maintaining a bearing as the map rotates.
  • viewport aligns the Marker's rotation relative to the viewport, agnostic to map rotations.
  • auto is equivalent to viewport.

style: CSSProperties​

CSS style override that applies to the marker's container.

Callbacks​

onClick: (evt: MapEvent) => void​

Called when the marker is clicked on.

onDragStart: (evt: MarkerDragEvent) => void​

Called when dragging starts, if draggable is true.

onDrag: (evt: MarkerDragEvent) => void​

Called while dragging, if draggable is true.

onDragEnd: (evt: MarkerDragEvent) => void​

Called when dragging ends, if draggable is true.

Other Properties​

The properties in this section are not reactive. They are only used when the component first mounts.

Any options supported by the Marker class (Mapbox | Maplibre), such as

  • anchor
  • color
  • scale
  • clickTolerance

Methods​

The underlying native Marker instance is accessible via a React ref hook. You may use it to call any imperative methods:

import * as React from 'react';
import {useRef, useMemo, useCallback} from 'react';
import Map, {Marker} from 'react-map-gl';
import mapboxgl from 'mapbox-gl';

function App() {
  const markerRef = useRef<mapboxgl.Marker>();

  const popup = useMemo(() => {
    return mapboxgl.Popup().setText('Hello world!');
  }, [])

  const togglePopup = useCallback(() => {
    markerRef.current?.togglePopup();
  }, []);

  return <>
    <Map>
      <Marker longitude={-122.4} latitude={37.8} color="red" popup={popup} ref={markerRef} />
    </Map>
    <button onClick={togglePopup}>Toggle popup</button>
  </>;
}

Source​

marker.ts

- + \ No newline at end of file diff --git a/docs/api-reference/navigation-control.html b/docs/api-reference/navigation-control.html index 1c072b82..edc17bf1 100644 --- a/docs/api-reference/navigation-control.html +++ b/docs/api-reference/navigation-control.html @@ -4,13 +4,13 @@ NavigationControl | React Map GL - +

NavigationControl

React component that wraps the base library's NavigationControl class (Mapbox | Maplibre).

import * as React from 'react';
import Map, {NavigationControl} from 'react-map-gl';

function App() {
  return <Map
    mapboxAccessToken="<Mapbox access token>"
    initialViewState={{
      longitude: -100,
      latitude: 40,
      zoom: 3.5
    }}
    mapStyle="mapbox://styles/mapbox/streets-v9"
  >
    <NavigationControl />
  </Map>;
}

Properties​

Reactive Properties​

style: CSSProperties​

CSS style override that applies to the control's container.

Other Properties​

The properties in this section are not reactive. They are only used when the component first mounts.

Any options supported by the NavigationControl class (Mapbox | Maplibre), such as

  • showCompass
  • showZoom
  • visualizePitch

Plus the following:

position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'​

Default: 'top-right'

Placement of the control relative to the map.

Source​

navigation-control.ts

- + \ No newline at end of file diff --git a/docs/api-reference/popup.html b/docs/api-reference/popup.html index 309d6481..b4a0aee1 100644 --- a/docs/api-reference/popup.html +++ b/docs/api-reference/popup.html @@ -4,7 +4,7 @@ Popup | React Map GL - + @@ -12,7 +12,7 @@

Popup

React component that wraps the base library's Popup class (Mapbox | Maplibre).

import * as React from 'react';
import {useState} from 'react';
import Map, {Popup} from 'react-map-gl';

function App() {
  const [showPopup, setShowPopup] = useState<boolean>(true);

  return <Map
    mapboxAccessToken="<Mapbox access token>"
    initialViewState={{
      longitude: -100,
      latitude: 40,
      zoom: 3.5
    }}
    mapStyle="mapbox://styles/mapbox/streets-v9"
  >
    {showPopup && (
      <Popup longitude={-100} latitude={40}
        anchor="bottom"
        onClose={() => setShowPopup(false)}>
        You are here
      </Popup>)}
  </Map>;
}

Properties​

Reactive Properties​

anchor: 'center' | 'left' | 'right' | 'top' | 'bottom' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | undefined​

A string indicating the part of the popup that should be positioned closest to the coordinate, set via longitude and latitude. If unset, the anchor will be dynamically set to ensure the popup falls within the map container with a preference for 'bottom'.

className: string​

Space-separated CSS class names to add to popup container.

offset: number | PointLike | Record\<string, PointLike>​

Default: null

A pixel offset applied to the popup's location specified as:

  • a single number specifying a distance from the popup's location
  • a PointLike specifying a constant offset
  • an object of Points specifing an offset for each anchor position.

Negative offsets indicate left and up.

maxWidth: string​

Default: 240px

A string that sets the CSS property of the popup's maximum width.

style: CSSProperties​

CSS style override that applies to the popup's container.

Callbacks​

onOpen: (evt: PopupEvent) => void​

Called when the popup is opened.

onClose: (evt: PopupEvent) => void​

Called when the popup is closed by the user clicking on the close button or outside (if closeOnClick: true).

Other Properties​

The properties in this section are not reactive. They are only used when the component first mounts.

Any options supported by the Popup class (Mapbox | Maplibre), such as

  • closeButton
  • closeOnClick
  • closeOnMove
  • focusAfterOpen

Methods​

The underlying native Popup instance is accessible via a React ref hook. You may use it to call any imperative methods:

import * as React from 'react';
import {useRef, useEffect} from 'react';
import Map, {Popup} from 'react-map-gl';
import mapboxgl from 'mapbox-gl';

function App() {
  const popupRef = useRef<mapboxgl.Popup>();

  useEffect(() => {
    popupRef.current?.trackPointer();
  }, [popupRef.current])

  return <Map>
    <Popup longitude={-122.4} latitude={37.8} ref={popupRef} >
      Tooltip
    </Popup>
  </Map>;
}

Source​

popup.ts

- + \ No newline at end of file diff --git a/docs/api-reference/scale-control.html b/docs/api-reference/scale-control.html index a5f05c2d..2b6dec77 100644 --- a/docs/api-reference/scale-control.html +++ b/docs/api-reference/scale-control.html @@ -4,13 +4,13 @@ ScaleControl | React Map GL - +

ScaleControl

React component that wraps the base library's ScaleControl class (Mapbox | Maplibre).

import * as React from 'react';
import Map, {ScaleControl} from 'react-map-gl';

function App() {
  return <Map
    mapboxAccessToken="<Mapbox access token>"
    initialViewState={{
      longitude: -100,
      latitude: 40,
      zoom: 3.5
    }}
    mapStyle="mapbox://styles/mapbox/streets-v9"
  >
    <ScaleControl />
  </Map>;
}

Properties​

Reactive Properties​

maxWidth: string​

Default: 100

The maximum length of the scale control in pixels.

style: CSSProperties​

CSS style override that applies to the control's container.

unit: 'imperial' | 'metric' | 'nautical'​

Default: 'metric'

Unit of the distance.

Other Properties​

The properties in this section are not reactive. They are only used when the component first mounts.

position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'​

Default: 'top-right'

Placement of the control relative to the map.

Source​

scale-control.ts

- + \ No newline at end of file diff --git a/docs/api-reference/source.html b/docs/api-reference/source.html index 8b51c117..c1a7ac1b 100644 --- a/docs/api-reference/source.html +++ b/docs/api-reference/source.html @@ -4,13 +4,13 @@ Source | React Map GL - +

Source

This component allows apps to create a map source using React. It may contain Layer components as children.

import * as React from 'react';
import Map, {Source, Layer} from 'react-map-gl';
import type {CircleLayer} from 'react-map-gl';
import type {FeatureCollection} from 'geojson';

const geojson: FeatureCollection = {
  type: 'FeatureCollection',
  features: [
    {type: 'Feature', geometry: {type: 'Point', coordinates: [-122.4, 37.8]}}
  ]
};

const layerStyle: CircleLayer = {
  id: 'point',
  type: 'circle',
  paint: {
    'circle-radius': 10,
    'circle-color': '#007cbf'
  }
};

function App() {
  return <Map
    mapLib={import('mapbox-gl')}
    initialViewState={{
      longitude: -122.4,
      latitude: 37.8,
      zoom: 14
    }}
    mapStyle="mapbox://styles/mapbox/streets-v9"
  >
    <Source id="my-data" type="geojson" data={geojson}>
      <Layer {...layerStyle} />
    </Source>
  </Map>;
}

Properties​

The props provided to this component should be conforming to the Mapbox source specification or CanvasSourceOptions.

When props change shallowly, the component will attempt to update the source. Do not define objects/arrays inline to avoid perf hit.

Once a <Source> is mounted, the following props should not change. If add/remove multiple JSX sources dynamically, make sure you use React's key prop to give each element a stable identity.

id: string​

Unique identifier of the source. If not provided, a default id will be assigned.

type: string​

Required. Type of the source.

Source​

source.ts

- + \ No newline at end of file diff --git a/docs/api-reference/types.html b/docs/api-reference/types.html index 2e920cc0..fe28c4bb 100644 --- a/docs/api-reference/types.html +++ b/docs/api-reference/types.html @@ -4,13 +4,13 @@ Types | React Map GL - +

Types

The following types can be imported from react-map-gl when using TypeScript.

Components​

IControl​

A custom control implementation.

CustomLayerInterface​

A custom layer implementation.

MapRef​

Instance ref of a Map component. See Map documentation for details.

Styling​

MapStyle​

An object conforming to the Mapbox Style Specification.

Fog​

An object conforming to the Fog Style Specification.

Light​

An object conforming to the Light Style Specification.

Terrain​

An object conforming to the Terrain Style Specification.

Projection​

An object conforming to the Projection Style Specification.

BackgroundLayer​

A JSON object that defines a background layer according to the Mapbox Style Specification.

CircleLayer​

A JSON object that defines a circle layer according to the Mapbox Style Specification.

FillExtrusionLayer​

A JSON object that defines a fill-extrusion layer according to the Mapbox Style Specification.

FillLayer​

A JSON object that defines a fill layer according to the Mapbox Style Specification.

HeatmapLayer​

A JSON object that defines a heatmap layer according to the Mapbox Style Specification.

HillshadeLayer​

A JSON object that defines a hillshade layer according to the Mapbox Style Specification.

LineLayer​

A JSON object that defines a line layer according to the Mapbox Style Specification.

RasterLayer​

A JSON object that defines a raster layer according to the Mapbox Style Specification.

SymbolLayer​

A JSON object that defines a symbol layer according to the Mapbox Style Specification.

SkyLayer​

A JSON object that defines a sky layer according to the Mapbox Style Specification.

GeoJSONSourceRaw​

A JSON object that defines a geojson source according to the Mapbox Style Specification.

VideoSourceRaw​

A JSON object that defines a video source according to the Mapbox Style Specification.

ImageSourceRaw​

A JSON object that defines a image source according to the Mapbox Style Specification.

VectorSourceRaw​

A JSON object that defines a vector source according to the Mapbox Style Specification.

RasterSource​

A JSON object that defines a raster source according to the Mapbox Style Specification.

RasterDemSource​

A JSON object that defines a raster-dem source according to the Mapbox Style Specification.

CanvasSourceRaw​

A JSON object that defines a canvas source type. See CanvasSourceOptions.

Configurations​

ControlPosition​

One of 'top-right', 'top-left', 'bottom-right' and 'bottom-left'.

PaddingOptions​

An object with the following fields:

  • left: number - in pixels.
  • top: number - in pixels.
  • right: number - in pixels.
  • bottom: number - in pixels.

Data Types​

LngLat​

A mapboxgl.LngLat object.

LngLatLike​

A LngLat object, an array of two numbers representing longitude and latitude, or an object with lng and lat or lon and lat properties.

LngLatBounds​

A mapboxgl.LngLatBounds object.

LngLatBoundsLike​

A LngLatBounds object, an array of LngLatLike objects in [sw, ne] order, or an array of numbers in [west, south, east, north] order.

Point​

A mapboxgl.Point object.

PointLike​

A Point or an array of two numbers representing x and y screen coordinates in pixels.

MapGeoJSONFeature​

A GeoJSON feature that also contains the following library-specific fields:

  • layer: Layer
  • source: string
  • sourceLayer: string
  • state: { [key: string]: any }

ViewState​

An object with the following fields:

  • longitude: number - The longitude of the map center.
  • latitude: number - The latitude of the map center.
  • zoom: number - The zoom level.
  • pitch: number - The pitch (tilt) of the map, in degrees.
  • bearing: number - The bearing (rotation) of the map, in degrees.

Sources​

The following are implementations of source types that could be retrieved with Map.getSource (Mapbox | Maplibre).

GeoJSONSource​

A source containing GeoJSON. See GeoJSONSource (Mapbox | Maplibre).

VideoSource​

A source containing video. See VideoSource (Mapbox | Maplibre).

ImageSource​

A source containing image. See ImageSource (Mapbox | Maplibre).

CanvasSource​

A source containing the contents of an HTML canvas. See CanvasSource(Mapbox | Maplibre).

VectorTileSource​

A source containing vector tiles in Mapbox Vector Tile format. See VectorTileSource (Mapbox | Maplibre).

Events​

MapEvent​

An object with the following fields:

MapLayerMouseEvent​

An object with the following fields:

MapWheelEvent​

An object with the following fields:

  • type: string
  • target: Map (Mapbox | Maplibre)
  • originalEvent?: WheelEvent
  • preventDefault: () => void
  • defaultPrevented: boolean

MapLayerTouchEvent​

An object with the following fields:

ViewStateChangeEvent​

An object with the following fields:

  • type: string - Event type
  • target: Map (Mapbox | Maplibre)
  • viewState: ViewState - the next view state that the camera wants to change to based on user input or transition.

MapBoxZoomEvent​

An object with the following fields:

MapStyleDataEvent​

An object with the following fields:

MapSourceDataEvent​

An object with the following fields:

  • type: string
  • target: Map (Mapbox | Maplibre)
  • dataType: 'source'
  • isSourceLoaded: boolean
  • source: string
  • sourceId: string
  • sourceDataType: 'metadata' | 'content'
  • tile: any
  • coord: Coordinate

See MapDataEvent.

ErrorEvent​

An object with the following fields:

GeolocateEvent​

An object with the following fields:

GeolocateResultEvent​

An object with the following fields:

GeolocateErrorEvent​

An object with the following fields:

  • type: string
  • target: GeolocateControl (Mapbox | Maplibre)
  • code: PERMISSION_DENIED | POSITION_UNAVAILABLE | TIMEOUT - see GeolocationPositionError
  • message: string - the details of the error. Specifications note that this is primarily intended for debugging use and not to be shown directly in a user interface.

MarkerEvent​

An object with the following fields:

MarkerDragEvent​

An object with the following fields:

PopupEvent​

An object with the following fields:

- + \ No newline at end of file diff --git a/docs/api-reference/use-control.html b/docs/api-reference/use-control.html index 8da29727..fe532c7c 100644 --- a/docs/api-reference/use-control.html +++ b/docs/api-reference/use-control.html @@ -4,13 +4,13 @@ useControl | React Map GL - +

useControl

The useControl hook is used to create React wrappers for custom map controls.

import MapboxDraw from '@mapbox/mapbox-gl-draw';
import Map, {useControl} from 'react-map-gl';

function DrawControl(props: DrawControlProps) {
  useControl(() => new MapboxDraw(props), {
    position: props.position
  });

  return null;
}

function App() {
  return (
    <Map
      mapLib={import('mapbox-gl')}
      initialViewState={{
        longitude: -122.4,
        latitude: 37.8,
        zoom: 14
      }}
      mapStyle="mapbox://styles/mapbox/satellite-v9"
    >
      <DrawControl
        position="top-left"
        displayControlsDefault={false}
        controls={{
          polygon: true,
          trash: true
        }}
      />
    </Map>
  );
}

See a full example here.

Signature​

useControl<T extends IControl>(
  onCreate: ({map: MapRef, mapLib: mapboxgl}) => IControl,
  options?: {
    position?: ControlPosition;
  }
): T

useControl<T extends IControl>(
  onCreate: ({map: MapRef, mapLib: mapboxgl}) => IControl,
  onRemove: ({map: MapRef, mapLib: mapboxgl}) => void,
  options?: {
    position?: ControlPosition;
  }
): T

useControl<T extends IControl>(
  onCreate: ({map: MapRef, mapLib: mapboxgl}) => IControl,
  onAdd: ({map: MapRef, mapLib: mapboxgl}) => void,
  onRemove: ({map: MapRef, mapLib: mapboxgl}) => void,
  options?: {
    position?: ControlPosition;
  }
): T

The hook creates an IControl instance, adds it to the map when it's available, and removes it upon unmount.

Parameters:

  • onCreate: ({map: MapRef, mapLib: mapboxgl}) => IControl - called to create an instance of the control.
  • onAdd: ({map: MapRef, mapLib: mapboxgl}) => void - called when the control has been added to the map.
  • onRemove: ({map: MapRef, mapLib: mapboxgl}) => void - called when the control is about to be removed from the map.
  • options: object
    • position: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' - control position relative to the map

Returns:

IControl - the control instance from onCreate.

Source​

use-control.ts

- + \ No newline at end of file diff --git a/docs/api-reference/use-map.html b/docs/api-reference/use-map.html index 94be6c3e..7ab7b53f 100644 --- a/docs/api-reference/use-map.html +++ b/docs/api-reference/use-map.html @@ -4,13 +4,13 @@ useMap | React Map GL - +

useMap

The useMap hook allows a custom component to reference the Map that contains it.

import {Map, useMap} from 'react-map-gl';

function Root() {
  return (
    <Map ... >
      <NavigationButton />
    </Map>
  );
}

function NavigateButton() {
  const {current: map} = useMap();

  const onClick = () => {
    map.flyTo({center: [-122.4, 37.8]});
  };

  return <button onClick={onClick}>Go</button>;
}

When used with the MapProvider, this hook can also reference maps that are rendered outside of the current component's direct render tree.

import {MapProvider, Map, useMap} from 'react-map-gl';

function Root() {
  return (
    <MapProvider>
      <Map id="myMapA" ... />
      <Map id="myMapB" ... />
      <NavigateButton />
    </MapProvider>
  );
}

function NavigateButton() {
  const {myMapA, myMapB} = useMap();

  const onClick = () => {
    myMapA.flyTo({center: [-122.4, 37.8]});
    myMapB.flyTo({center: [-74, 40.7]});
  };

  return <button onClick={onClick}>Go</button>;
}

See a full example here.

Signature​

useMap(): {current?: MapRef, [id: string]: MapRef}

The hook returns an object that contains all mounted maps under the closest MapProvider. The keys are each map's id and the values are the MapRef.

If the hook is used inside a decendent of a Map component, the returned object also contains a current field that references the containing map.

Source​

use-map.tsx

- + \ No newline at end of file diff --git a/docs/contributing.html b/docs/contributing.html index 17d2f1ef..06dd534d 100644 --- a/docs/contributing.html +++ b/docs/contributing.html @@ -4,7 +4,7 @@ Contributing | React Map GL - + @@ -12,7 +12,7 @@

Contributing

Thanks for taking the time to contribute!

PRs and bug reports are welcome, and we are actively looking for new maintainers.

Setting Up Dev Environment​

The master branch is the active development branch.

Building react-map-gl locally from the source requires node.js >=8. We use yarn to manage the dependencies.

git checkout master
yarn bootstrap
yarn test

Test:

$ yarn test

Test in Node:

$ yarn test node

Test in browser (can use Chrome dev tools for debugging):

$ yarn test browser

Pull Requests​

Any intended change to the code base must open a pull request and be approved.

Generally speaking, all PRs are open against the master branch, unless the feature being affected no longer exists on master.

PR Checklist​

  • Tests

  • yarn test must be successful.

    • New code should be covered by unit tests whenever possible.

  • Documentation

    • If public APIs are added/modified, update component documentation in docs/api-reference.
    • Breaking changes and deprecations must be added to docs/upgrade-guide.md.
    • Noteworthy new features should be added to docs/whats-new.md.

  • Description on GitHub

    • Link to relevant issue.
    • Label with a milestone (latest release or vNext).
    • If public APIs are added/modified, describe the intended behavior.
    • If visual/interaction is affected, consider attaching a screenshot/GIF.

Release​

react-map-gl follows the Semantic Versioning guidelines. Steps for publishing releases can be found here.

Community Governance​

vis.gl is part of the Urban Computing Foundation. See the organization's Technical Charter.

Technical Steering Committee​

react-map-gl development is governed by the vis.gl Technical Steering Committee (TSC).

Maintainers​

Maintainers of react-map-gl have commit access to this GitHub repository, and take part in the decision making process.

If you are interested in becoming a maintainer, read the governance guidelines.

The vis.gl TSC meets monthly and publishes meeting notes via a mailing list. This mailing list can also be utilized to reach out to the TSC.

Code of Conduct​

Please be mindful of and adhere to the Linux Foundation's Code of Conduct when contributing to react-map-gl.

- + \ No newline at end of file diff --git a/docs/get-started.html b/docs/get-started.html index e3523b77..4caf758e 100644 --- a/docs/get-started.html +++ b/docs/get-started.html @@ -4,13 +4,13 @@ Get Started | React Map GL - +

Get Started

You may find complete project setups in get-started examples.

Installation​

Using react-map-gl requires node >= 12 and react >= 16.3.

npm install --save react-map-gl mapbox-gl @types/mapbox-gl

Example​

app.tsx
import * as React from 'react';
import Map from 'react-map-gl';

function App() {
  return (
    <Map
      mapboxAccessToken="<Mapbox access token>"
      initialViewState={{
        longitude: -122.4,
        latitude: 37.8,
        zoom: 14
      }}
      style={{width: 600, height: 400}}
      mapStyle="mapbox://styles/mapbox/streets-v9"
    />
  );
}

See about Mapbox tokens for alternatives to providing a Mapbox token.

Styling​

The base map library requires its stylesheet be included at all times. The marker, popup and navigation components in react-map-gl also need the stylesheet to work properly.

You may add the stylesheet to the head of your page:

index.html
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v<YOUR_MAPBOX_VERSION>/mapbox-gl.css' rel='stylesheet' />

Find out your mapbox version by running yarn list mapbox-gl or npm ls mapbox-gl.

Or embed it in your app by using css-loader with Webpack or postcss with rollup:

app.tsx
import 'mapbox-gl/dist/mapbox-gl.css';

Using with a Compatible Fork​

npm install --save react-map-gl my-mapbox-fork

Then override the mapLib prop of Map:

app.tsx
import * as React from 'react';
import Map from 'react-map-gl';

// Include style sheet
import 'my-mapbox-fork/path/to/style-sheet.css';

function App() {
  return <Map mapLib={import('my-mapbox-fork')} />;
}
- + \ No newline at end of file diff --git a/docs/get-started/adding-custom-data.html b/docs/get-started/adding-custom-data.html index cfabaefc..4dac9ab3 100644 --- a/docs/get-started/adding-custom-data.html +++ b/docs/get-started/adding-custom-data.html @@ -4,13 +4,13 @@ Adding Custom Data | React Map GL - +

Adding Custom Data

Native Mapbox Layers​

You can inject data and mapbox native layers using the Source and Layer components:

import * as React from 'react';
import Map, {Source, Layer} from 'react-map-gl';
import type {CircleLayer} from 'react-map-gl';
import type {FeatureCollection} from 'geojson';

const geojson: FeatureCollection = {
  type: 'FeatureCollection',
  features: [
    {type: 'Feature', geometry: {type: 'Point', coordinates: [-122.4, 37.8]}}
  ]
};

const layerStyle: CircleLayer = {
  id: 'point',
  type: 'circle',
  paint: {
    'circle-radius': 10,
    'circle-color': '#007cbf'
  }
};

function App() {
  return (
    <Map
      initialViewState={{
        longitude: -122.45,
        latitude: 37.78,
        zoom: 14
      }}>
      <Source id="my-data" type="geojson" data={geojson}>
        <Layer {...layerStyle} />
      </Source>
    </Map>
  );
}

For details about data sources and layer configuration, check out the Mapbox style specification.

For dynamically updating data sources and layers, check out the GeoJSON and GeoJSON animation examples.

Custom Overlays​

You can implement a custom HTML or SVG overlay on top of the map that redraws whenever the camera changes. By calling map.project() you can adjust the DOM or CSS properties so that the customly-drawn features are always aligned with the map. See a full example here.

Other vis.gl Libraries​

For more feature rich and performant data visualization overlay use cases, you may consider using other visualization libraries. react-map-gl is part of the vis.gl ecosystem, a suite of high-performance data visualization tools for the Web.

  • deck.gl - WebGL-powered framework for the visualization of large datasets.
  • loaders.gl - loaders for file formats focused on visualization of big data, including point clouds, 3D geometries, images, geospatial formats as well as tabular data.
  • nebula.gl - 3D-enabled GeoJSON editing based on deck.gl and React.
- + \ No newline at end of file diff --git a/docs/get-started/mapbox-tokens.html b/docs/get-started/mapbox-tokens.html index 8d70ff4a..a05f0548 100644 --- a/docs/get-started/mapbox-tokens.html +++ b/docs/get-started/mapbox-tokens.html @@ -4,14 +4,14 @@ About Mapbox Tokens | React Map GL - +

About Mapbox Tokens

react-map-gl itself is open source and free. It provides a React wrapper for mapbox-gl or derived projects. Depending on which Mapbox GL JS version (or fork) you use, you may need a Mapbox token. You will need a Mapbox token if you use:

  • mapbox-gl@>=2.0.0 and above - 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 - 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 their website. 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.

There are several ways to provide a token to your app, as showcased in some of the example folders:

  • Provide a mapboxAccessToken prop to the map component
  • Set the MapboxAccessToken environment variable (or set REACT_APP_MAPBOX_ACCESS_TOKEN if you are using Create React App)
  • Provide it in the URL, e.g ?access_token=TOKEN

We recommend using an environment variable to minimize leaking risks. See securing Mapbox token for examples.

Display Maps Without A Mapbox Token​

It is possible to use the map component without the Mapbox service, if you use another tile source (for example, if you host your own map tiles). Note that this is no longer allowed using mapbox-gl v2.0 and above. The options are:

  • Stay on mapbox-gl@1.x. react-map-gl plans to continue supporting this release in the foreseeable future, however, this version will not include any of the latest features of the map renderer, nor get any future updates from Mapbox.
  • Use a community fork of mapbox-gl, for example maplibre-gl. See Get Started for how to configure your project.

To use your own map service, you will need a custom Mapbox GL style that points to your own vector tile source, and pass it to Map using the mapStyle prop. This custom style must match the schema of your tile source.

Open source tile schemas include:

Some useful resources for creating your own map service:

If you are using a third party service that requires header based authentication, you can do this by defining a function to pass to Map using the transformRequest prop.

An example function:

const transformRequest = (url, resourceType) => {
  if (resourceType === 'Tile' && url.match('yourTileSource.com')) {
    return {
      url: url,
      headers: { 'Authorization': 'Bearer ' + yourAuthToken }
    }
  }
}
- + \ No newline at end of file diff --git a/docs/get-started/state-management.html b/docs/get-started/state-management.html index bbb78eda..26957acf 100644 --- a/docs/get-started/state-management.html +++ b/docs/get-started/state-management.html @@ -4,13 +4,13 @@ State Management | React Map GL - +

State Management

There are two ways to use a Map:

  • Uncontrolled: The application sets the initial view state (Camera options) when the map is mounted, and the component automatically makes changes to the view states afterwards. This mode works very similarly to the mapbox-gl Map class.
  • Controlled: The application manages the view state, and pass it to the map via props. The map invokes a callback with a new view state during user interaction transition, and the application can decide what to do with it. This mode is the most powerful when an application has other components that need to interact with the map, or implements its own user input and data handling logic.

Uncontrolled Map​

You may clone a full app configuration for this example here.

import * as React from 'react';
import Map from 'react-map-gl';

function App() {
  return <Map
    initialViewState={{
      longitude: -100,
      latitude: 40,
      zoom: 3.5
    }}
    mapStyle="mapbox://styles/mapbox/streets-v9"
  />;
}

Controlled Map​

You may clone a full app configuration for this example here.

import * as React from 'react';
import Map from 'react-map-gl';

function App() {
  const [viewState, setViewState] = React.useState({
    longitude: -100,
    latitude: 40,
    zoom: 3.5
  });

  return <Map
    {...viewState}
    onMove={evt => setViewState(evt.viewState)}
    mapStyle="mapbox://styles/mapbox/streets-v9"
  />;
}

A real-world application likely uses more complicated state flows:

  • Using map with a state store (Redux) example
  • Using map with SSR (Next.js) example

Custom Camera Constraints​

Map offers props that set basic constraints for the camera, e.g. maxBounds, minZoom, maxPitch. If you need more complicated logic to constrain the camera, you may use it as a controlled component. The following example restricts the map center inside a GeoJSON geofence:

import * as React from 'react';
import Map from 'react-map-gl';

// npm install @turf/turf
import * as turf from '@turf/turf';

// A circle of 5 mile radius of the Empire State Building
const GEOFENCE = turf.circle([-74.0122106, 40.7467898], 5, {units: 'miles'});

function App() {
  const [viewState, setViewState] = React.useState({
    longitude: -100,
    latitude: 40,
    zoom: 3.5
  });

  const onMove = React.useCallback(({viewState}) => {
    const newCenter = [viewState.longitude, viewState.latitude];
    // Only update the view state if the center is inside the geofence
    if (turf.booleanPointInPolygon(newCenter, GEOFENCE)) {
      setViewState(newCenter);
    }
  }, [])

  return <Map
    {...viewState}
    onMove={onMove}
    mapStyle="mapbox://styles/mapbox/streets-v9"
  />;
}
- + \ No newline at end of file diff --git a/docs/get-started/tips-and-tricks.html b/docs/get-started/tips-and-tricks.html index 1ab00190..5dc09c09 100644 --- a/docs/get-started/tips-and-tricks.html +++ b/docs/get-started/tips-and-tricks.html @@ -4,14 +4,14 @@ Tips and Tricks | React Map GL - +

Tips and Tricks

Securing Mapbox Token​

Because Mapbox tokens are required for the client application to make requests to Mapbox servers, you have to distribute it with your app. It is not possible to stop a visitor to your site from scraping the token. The practice outlined below can help you protect your token from being abused.

  • Never commit your token in clear text into GitHub or other source control.
  • In your local dev environment, define the token in an environment variable e.g. MapboxAccessTokenDev=... in the command line, or use something like dotenv and put MapboxAccessTokenDev=... in a .env file. Add .env to .gitignore so it's never tracked. If your app is deployed by a continuous integration pipeline, follow its documentation and set a secret environment variable.
  • Create separate tokens for development (often times on http://localhost), public code snippet (Gist, Codepen etc.) and production (deployed to https://mycompany.com). The public token should be rotated regularly. The production token should have strict scope and URL restrictions that only allows it to be used on a domain that you own.
  • Add the following to your bundler config:
/// webpack.config.js
const {DefinePlugin} = require('webpack');

module.exports = {
  ...
  plugins: [
    new DefinePlugin({
      'process.env.MapboxAccessToken': JSON.stringify(process.env.NODE_ENV == 'production' ? process.env.MapboxAccessTokenProd : process.env.MapboxAccessTokenDev)
    })
  ]
};

react-map-gl automatically picks up process.env.MapboxAccessToken or process.env.REACT_APP_MAPBOX_ACCESS_TOKEN if they are defined. Alternatively, you can use your own variable name (e.g. __SUPER_SECRET_TOKEN__) and pass it in manually with mapboxAccessToken={__SUPER_SECRET_TOKEN__}.

Minimize Cost from Frequent Re-mounting​

In a moderately complex single-page app, as the user navigates through the UI, a map component may unmount and mount again many times during a session. Consider the following layout:

/// Example using Tabs from Material UI
<TabContext value={selectedTab}>
  <TabList onChange={handleTabChange}>
    <Tab label="Map" value="map" />
    <Tab label="List" value="table" />
  </TabList>
  <TabPanel value="map">
    <Map mapStyle="mapbox://styles/mapbox/streets-v9" >
      {items.map(renderMarker)}
    </Map>
  </TabPanel>
  <TabPanel value="table">
    <Table>
      {items.map(renderRow)}
    </Table>
  </TabPanel>
</TabContext>

Every time the user clicks the "table" tab, the map is unmounted. When they click the "map" tab, the map is mounted again. As of v2.0, mapbox-gl generates a billable event every time a Map object is initialized. It is obviously not ideal to get billed for just collapsing and expanding part of the UI.

In this case, it is recommended that you set the reuseMaps prop to true:

  <TabPanel value="map">
    <Map reuseMaps mapStyle="mapbox://styles/mapbox/streets-v9" >
      {items.map(renderMarker)}
    </Map>
  </TabPanel>

This bypasses the initialization when a map is removed then added back.

Performance with Many Markers​

If your application uses externally managed camera state, like with Redux, the number of React rerenders may be very high when the user is interacting with the map. Consider the following setup:

import {useSelector, useDispatch} from 'react-redux';
import Map, {Marker} from 'react-map-gl';

function MapView() {
  const viewState = useSelector((s: RootState) => s.viewState);
  const vehicles = useSelector((s: RootState) => s.vehicles);
  const dispatch = useDispatch();

  const onMove = useCallback(evt => {
    dispatch({type: 'setViewState', payload: evt.viewState});
  }, []);

  return (
    <Map
      {...viewState}
      onMove={onMove}
      mapStyle="mapbox://styles/mapbox/streets-v9" >
    >
      {vehicles.map(vehicle => (
        <Marker key={vehicle.id}
          longitude={vehicle.coordinates[0]}
          latitude={vehicle.coordinates[1]}>
          <svg>
            // vehicle icon
          </svg>
        </Marker>)
      )}
    </Map>
  );
}

This component is rerendered on every animation frame when the user is dragging the map. If it's trying to render hundreds of markers, the performance lag will become quite visible.

One way to improve the performance is useMemo:

  const markers = useMemo(() => vehicles.map(vehicle => (
    <Marker key={vehicle.id}
      longitude={vehicle.coordinates[0]}
      latitude={vehicle.coordinates[1]}>
      <svg>
        // vehicle icon
      </svg>
    </Marker>)
  ), [vehicles]);

  return (
    <Map
      {...viewState}
      onMove={onMove}
      mapStyle="mapbox://styles/mapbox/streets-v9" >
    >
      {markers}
    </Map>
  );
}

This prevents React from rerendering the markers unless they have changed.

If your application can do without complicated DOM objects and CSS styling, consider switching to a symbol layer. Layers are rendered in WebGL and are much more performant than markers:

  const vehiclesGeoJSON = useMemo(() => {
    return {
      type: 'FeatureCollection',
      features: vehicles.map(vehicle => turf.point(vehicle.coordinates, vehicle))
    };
  }, [vehicles]);

  return (
    <Map
      {...viewState}
      onMove={onMove}
      mapStyle="mapbox://styles/mapbox/streets-v9" >
    >
      <Source id="vehicles" type="geojson" data={vehiclesGeoJSON}>
        <Layer type="symbol"
          layout={{
            'icon-image': 'vehicle-icon',
            'icon-size': 1,
            'text-field': ['get', 'id']
          }}
        />
      </Source>
    </Map>
  );

Finding out if a point is within the current viewport​

There are some situations where you want to know if a point is currently visible on the map.
Checking this is simple and can be done like so:

const mapRef = useRef<MapRef>();

const checkIfPositionInViewport = (lat, lng) => {
    const bounds = mapRef.current.getBounds();
    return bounds.contains([lng, lat]);
}

return <Map ref={mapRef} ... />
- + \ No newline at end of file diff --git a/docs/upgrade-guide.html b/docs/upgrade-guide.html index dbf244a7..f84aeb39 100644 --- a/docs/upgrade-guide.html +++ b/docs/upgrade-guide.html @@ -4,13 +4,13 @@ Upgrade Guide | React Map GL - +

Upgrade Guide

Upgrading to v7.1​

  • maplibre-gl users no longer need to install mapbox-gl or a placeholder package as dependency. Change your imports to the new endpoint react-map-gl/maplibre. Components imported from here do not require setting the mapLib prop, and use the types defined by maplibre-gl.
map-v7.0.tsx
import Map from 'react-map-gl';
import maplibregl from 'maplibre-gl';

function App() {
  return <Map
    mapLib={maplibregl}
    style={MAP_STYLE}
    maplibreLogo  // This will generate a TypeScript error because it's not defined in Mapbox options
    />;
}
map-v7.1.tsx
import Map from 'react-map-gl/maplibre'; // <- mind the updated import

function App() {
  return <Map
    // mapLib is default to `import('maplibre-gl')`
    style={MAP_STYLE}
    maplibreLogo
    />
}

If you installed mapbox-gl from a placeholder such as npm:empty-npm-package@^1.0.0 as suggested by the previous version's documentation, it should be removed from your package.json.

  • The @types/mapbox-gl dependency has relaxed its version constraint. If you use mapbox-gl as the base map library, it's recommended to explicitly list @types/mapbox-gl in your package.json with a version matching that of mapbox-gl (v1 or v2). This package is no longer required by the non-mapbox code path, and may be further demoted to an optional peer dependency in a future release.
  • If you use the Map component as a child of the DeckGL component from deck.gl, upgrade deck.gl to >=8.9.18.

Upgrading to v7.0​

v7 is a complete rewrite of the library. It is redesigned to be fast, lightweight, fully typed, to behave the same and expose the same APIs as the wrapped map library, and to provide the maximum compatibility with third-party plugins. To take advantages of these new features, you need to make some changes to your code that was previously depending on react-map-gl v5 and v6.

If you are using react-map-gl controls (Marker, Popup, NavigationControl etc.) with deck.gl's ContextProvider, do not upgrade to this version. The old approach no longer works with v7. We are moving the support for this use case to a new project that does not depend on mapbox.

Dependencies​

  • Add mapbox-gl (or a compatible fork) to your package.json. react-map-gl no longer lists a specific map renderer in its dependencies, so you are free to use it with Mapbox v1, v2 or Maplibre.
  • viewport-mercator-project (an alias of @math.gl/web-mercator) is no longer a dependency. You can still install the library on the side as a utility for viewport-related math, but it's no longer required.

Module exports​

  • InteractiveMap and StaticMap are removed. Instead, import Map.
  • setRTLTextPlugin is removed. Use the Map component's RTLTextPlugin prop (default enabled).
  • MapController is removed. v7.0 has removed its own implementation of user input handling in favor of the native handlers. If you are using a custom implementation of MapController, check if the native handlers offer options to address your application's needs.
  • MapContext and useMapControl are removed. Check out the new API useMap and useControl.
  • The overlay components (HTMLOverlay, CanvasOverlay and SVGOverlay) are removed. Check out this example for implementing similar controls in your own application.
  • LinearInterpolator and FlyToInterpolator are removed. Use map.easeTo() and map.flyTo() instead, see this example.

Map​

documentation

  • Renamed props for better consistency with the wrapped library:
    • mapboxApiAccessToken is now mapboxAccessToken
    • mapboxApiUrl is now baseApiUrl
    • preventStyleDiffing (default false) is replaced with styleDiffing (default true)
  • mapStyle should be explicitly specified. The default value has changed from "mapbox://styles/mapbox/light-v9" to an empty style.
  • The following props are removed and apps should use style instead:
    • width
    • height
    • visible
  • onViewportChange, onViewStateChange and onInteractionStateChange are removed. You can either use Map as an uncontrolled component with the new initialViewState prop, or if you need to manage the camera state externally (e.g. in Redux), use the onMove callback instead. See examples in state management.
  • transition* props are removed. Use map.easeTo() and map.flyTo() instead, see this example.
  • mapOptions is removed. Almost all of the options for the native Map class are exposed as props.
  • onHover is removed. Use onMouseMove or onMouseEnter.
  • The event argument is changed for all interaction callbacks. See documentation for details.
  • getCursor is removed as part of the effort to get Map behave the same as the native component. To set the cursor, use the cursor prop. Follow this example to change cursor on hover.
  • touchAction and eventRecognizerOptions are removed. Check out the cooperativeGestures prop.

Other components​

  • capture* props are removed.
  • *label props are removed. Use Map's locale prop.
  • All map controls' props are now strictly aligned with their mapbox-gl counterparts. In heading this direction, we are able to remove a significant amount of custom code and have the components behave more predictably for developers switching from the native library. If your application is relying on an old feature that is no longer supported, please open a topic on Discussion so we can review on a case-by-case basis.

Upgrading to v5.3/v6.1​

  • MapContext is now an official API. The experimental _MapContext export will be removed in a future release.
  • react-virtualized-auto-sizer is no longer a dependency.
  • Inertia has been enabled by default on the map controller. To revert to the behavior in previous versions, set the interaction options:
const CONTROLLER_OPTS = {
  dragPan: {inertia: 0},
  dragRotate: {inertia: 0},
  touchZoom: {inertia: 0}
};

<MapGL {...CONTROLLER_OPTS} ... />
  • Source and Layer components no longer expose imperative methods via ref as part of the migration to functional components. This is to comply with the pattern recommended by the latest React.
    • If you used to call sourceRef.getSource(), it can be replaced with mapRef().getMap().getSource(sourceId).
    • If you used to call layerRef.getLayer(), it can be replaced with mapRef().getMap().getLayer(layerId).

Upgrading to v6​

  • A valid Mapbox access token is always required.
  • The default value of InteractiveMap's maxPitch prop is changed to 85 from 60.
  • mapbox-gl v2 introduced a breaking change to the build system. Transpiling it may result in a crash in the production build with the message m is not defined. Find solutions in this thread.

Upgrading to v4​

  • onChangeViewport is removed, use onViewportChange instead
  • Immutable.js is no longer a dependency
  • Export experimental.MapControls is removed, use MapController instead
  • InteractiveMap's mapControls prop is renamed to controller
  • Removed support for the deprecated interactive property on the layer styles. Use the interactiveLayerIds prop to specify which layers are clickable.

Upgrading to v3.2​

  • The latest mapbox-gl release requires stylesheet to be included at all times. See Get Started for information about styling.
  • Immutable.js is no longer a hard dependency and will be removed in the next major release. If you are importing immutable in your application, it is recommended that you explicitly list it in the application's dependencies.

Upgrading to v3​

v3 is a major upgrade of react-map-gl. While we have tried to gently deprecated any changed or removed features, a few breaking changes could not be avoided.

Version Requirements​

  • The Node Version Requirement for building react-map-gl is now >=v6.4.0. Using prebuilt react-map-gl does NOT has this limitation. This is introduced by Mapbox GL JS v0.38.0

MapGL Component​

  • Two Map Components - v3 now splits the Map component into two React components: StaticMap and InteractiveMap. InteractiveMap is the default export, and designed to be as compatible as possible with the v2 default component.

onChangeViewport callback now includes width and height.​

The viewport parameter passed to the onChangeViewport callback now includes width and height. Application code that composed the viewport with width and height may have to be updated. Please double check your render code if you relied on this behavior.

// BAD: 'width' and 'height' below will be overridden by what's in the 'viewport' object
<ReactMapGL width={500} height={400} {...viewport} />
// GOOD: 'width' and 'height' below will override the values in 'viewport'
<ReactMapGL {...viewport} width={500} height={400} />

Overlays​

  • Some Overlays Moved to Examples - Some less frequently used overlays (DraggablePointsOverlay, ChoroplethOverlay, ScatterplotOverlay), have been moved to examples. Most users are now using mapbox styles or deck.gl layers and removing these overlays reduces the size of the react-map-gl library for the majority of users that don't need them. If you still use them, simply copy the overlay source file(s) into your application.
  • Overlays must be Children of the Map - Overlays must now be rendered as children of the main react-map-gl component to automatically sync with the map viewport.

fitBounds utility function​

The fitBounds utility has been moved to the math.gl library. The function can now be called as follows:

import WebMercatorViewport from 'viewport-mercator-project';
const viewport = new WebMercatorViewport({width: 600, height: 400});
const bound = viewport.fitBounds(
  [[-73.9876, 40.7661], [-72.9876, 41.7661]],
  {padding: 20, offset: [0, -40]}
);
// => bounds: instance of WebMercatorViewport
// {longitude: -73.48760000000007, latitude: 41.268014439447484, zoom: 7.209231188444142}

Deprecations​

We have started to deprecate a few React props. In all the cases below, the old props will still work (you'll get a warning in the console), but they will likely be removed in the next major version of react-map-gl so you should start using the new props as soon as possible.

Old PropNew Prop
onChangeViewport(<viewport>)onViewportChange(<viewport>)
onHoverFeatures(<features>)onHover(<event>)
onClickFeatures(<features>)onClick(<event>)
perspectiveEnabled [default: false]dragRotate [default: true]

Upgrading to v2​

v2 is API compatible with v1, however if you are still using v1 of react-map-gl, make sure that you first upgrade:

  • Your node version to v4 or higher
  • Your react version to 15.4 or higher.

Background: mapbox-gl 0.31.0 introduced a hard dependency on Node >= v4.

Upgrading to v1​

(Upgrading from 0.6.x)

  • Importing Overlays - The map overlay components (HTMLOverlay, CanvasOverlay, SVGOverlay etc) are now named exports. They previously had to be imported via their relative source paths:
// v1.0
import MapGL, {SVGOverlay} from 'react-map-gl';

// v0.6
import MapGL from 'react-map-gl';
import SVGOverlay from 'react-map-gl/src/api-reference/svg-overlay';.
  • Map State - The map state reported by onViewportChanged will now contain additional state fields (tracking not only pitch and bearing needed for perspective mode, but also transient information about how the projection is being changed by the user).
    • This information must be passed back to the react-map-gl component in the next render.
    • To simplify and future proof applications, it is recommended to simply save the entire mapState in your app store whenever it changes and then pass it back to the component rather than trying to keep track of individual fields (like longitude, latitude and zoom).
- + \ No newline at end of file diff --git a/docs/whats-new.html b/docs/whats-new.html index 8e271722..29574530 100644 --- a/docs/whats-new.html +++ b/docs/whats-new.html @@ -4,7 +4,7 @@ What's new | React Map GL - + @@ -12,7 +12,7 @@

What's new

react-map-gl v7.1​

Release date: June 30 2023

  • To better accommodate the API divergence between Mapbox and Maplibre, this version adds a new endpoint react-map-gl/maplibre. The new endpoint exports identical components as react-map-gl, but typed for maplibre-gl instead. After switching to this new endpoint, maplibre-gl users no longer need to install mapbox-gl or a placeholder package as dependency. See upgrade guide for an example.
  • Marker, Popup and GeolocateControl components now expose the native instance via React ref.

react-map-gl v7.0​

Release date: Feb 4, 2022

v7 is a complete rewrite of the library. It addresses many long-standing issues in v5 and v6 limited by legacy architecture decisions. The most notable results of this redesign are:

  • Performance: minimize the overhead of React, offer the same fast and smooth interaction as the native library
  • Lightweight: the ESM build size is reduced from 219k to 57k
  • Predictability: Components behave the same as their mapbox counterparts. Props are mapped 1:1 from the native options wherever appropriate. Almost all imperative APIs (flyTo, fitBounds etc.) can now be called directly without breaking the React binding.
  • Compatibility: first and third-party plugins! Directly use mapbox-gl-draw, mapbox-gl-geocoder, to name a few.
  • TypeScript compliant: the code base is now entirely written in TypeScript, and all types can be imported.

Visit the upgrade guide if you are trying to upgrade from v5 and v6.

react-map-gl v5.3/v6.1​

Release date: Jan 27, 2020

Highlights​

  • TypeScript and Flow typings are now published with the library
  • More controller customizations. Smooth easing on wheel scroll, three-finger gesture to change pitch, inertia after pan/pinch, and customizable keyboard navigation speed. See the updated interaction options for details.
  • A new eventRecognizerOptions prop is added for fine-tuning the interaction experience.
  • New component: AttributionControl
  • Promoted to official API: MapContext
  • Resolved React error over attempted state update during render
  • GeolocateControl added supports for showAccuracyCircle
  • All controls now support inline styling with a style prop
  • All components and examples have been rewritten as functional components

react-map-gl v6.0​

Release date: Dec 16, 2020

What's Changed​

The 6.0 release upgrades its Mapbox GL JS dependency to v2.0. There are important changes to mapbox-gl's license and pricing model in this milestone. If you are NOT using a Mapbox account (e.g. self-hosting map tiles), do NOT upgrade to this version, and consider your options discussed in this document.

See upgrade guide for a complete list of breaking changes.

react-map-gl v5.2​

Release date: Jan 6, 2020

Highlights​

  • New Components: ScaleControl
  • NavigationControl: new label prop
  • GeolocateControl: new label, onGeolocate, auto props
  • New Export: WebMercatorViewport is re-exported from the viewport-mercator-project library for ease of use. It's recommended to import it from react-map-gl instead to avoid future dependency change.
  • New Example: Clusters

react-map-gl v5.1​

Release date: Oct 30, 2019

Highlights​

  • New Components: Layer and Source have been added to provide better React parity with the Mapbox GL JS API.
  • Viewport transition: transitionDuration can be set to 'auto' when using FlyToInterpolator.
  • New Example: Add an example with drawing library react-map-gl-draw.

react-map-gl v5.0​

Release date: May 31, 2019

What's Changed​

The only change between the 5.0 release and the latest 4.1 release is Mapbox GL JS v1.0. By using this version, you opt into Mapbox's new pricing model, which bills per map load instead of map views. 5.0.x and 4.1.x will continue to update in parallel with otherwise identical features until November 2019 when Mapbox moves all users of 0.xx to a new pricing scheme. For more details, see mapbox's changelog and blog post.

Alongside Mapbox GL JS's new milestone, we have relaxed the mapbox-gl dependency from locking minor release (~0.53.0) to major release (^1.0.0). This will allow developers to upgrade faster without waiting for a new release from react-map-gl.

react-map-gl v4.1​

Release date: Mar 14, 2019

Highlights​

  • New Components: FullscreenControl, GeolocateControl have been added to provide better React parity with the Mapbox GL JS API.
  • New callback props InteractiveMap supports more callbacks:
    • onNativeClick

react-map-gl v4.0​

Release date: Nov 5, 2018

Highlights​

  • Relative dimensions Both InteractiveMap and StaticMap now support CSS strings supplied to map width and height props. New onResize callback is fired when the map resizes.
  • React 16 Upgrade to React 16.3 context and ref patterns
  • Babel 7 Upgrade build system to Babel 7, better support for tree-shaking
  • Style diffing Now use Mapbox's native style diffing. Immutable is no longer required.
  • Draggable Markers Marker component now supports a new prop draggable, along with callbacks onDragStart, onDrag, and onDragEnd.
  • 3d Popups Popup component now supports a new prop sortByDepth to enable proper occlusion when multiple popups are used in a tilted map.
  • Interaction states onViewportChange is now called with richer descriptors of the user interaction, including isPanning, isZooming and isRotating.
  • Interactive layers Dropped the requirement for the deprecated interactive property on the layer styles. Use the interactiveLayerIds prop to specify which layers are clickable.
  • New callback props InteractiveMap supports more callbacks:
    • onDblClick
    • onMouseDown
    • onMouseMove
    • onMouseUp
    • onTouchStart
    • onTouchMove
    • onTouchEnd
    • onMouseEnter
    • onMouseLeave
    • onWheel
    • onMouseOut

See upgrade guide for breaking changes.

react-map-gl v3.3​

Release date: July, 2018

Highlights​

  • New viewState Property: Makes it possible to specify all map state properties (longitude, latitude, zoom, bearing and pitch) as a single property.
  • New onViewStateChange callback: An alternative callback that matches the new viewState prop.

react-map-gl v3.2​

Realease date: January, 2018

Highlights​

  • Viewport transition: feature equivalent to Mapbox's flyTo and easeTo; smooth transition when using keyboard navigation or the NavigationControl.
  • Better parity of Mapbox interaction: navigation using keyboard and the navigation control matches Mapbox behavior, including smooth transition when zooming and panning.
  • Support for Map Reuse (experimental): A new property reuseMaps is provided for applications that create and destroy maps, to help work around a mapbox-gl resource leak issue that can lead to a browser crash in certain situations.
  • mapbox-gl 0.42.2
  • New props of the InteractiveMap component:
    • Map creation: transformRequest, reuseMaps
    • Interaction: touchZoom, touchRotate
    • Transition: transitionDuration, transitionInterpolator, transitionEasing, transitionInterruption, onTransitionStart, onTransitionInterrupt, onTransitionEnd

react-map-gl v3.1​

Release date: October 19, 2017

Highlights​

  • Event handling
    • Support right mouse drag to rotate
    • Support keyboard navigation
    • Allow controls and overlays to block map interactions
  • React 16 - react-map-gl is now being tested with React 16, but the React peer dependency requirement is unchanged at >=15.4.x.
  • mapbox-gl v0.40.1
  • No Token warning: react-map-gl now renders an HTML message if no mapbox token is supplied.

react-map-gl v3.0​

Release date: July 27th, 2017

Highlights​

  • Latest Mapbox GL JS: Bumps Mapbox GL JS to 0.38.
  • Multi-Touch Support: Full support for multi-touch gestures such as pinch-to-zoom and rotate.
  • New Components: The MapGL component has been split into StaticMap and InteractiveMap (the default). Also, Popup, Marker, NavigationControl have been added to provide better React parity with the Mapbox GL JS API.
  • Improved Overlay Components: Supplying viewport props (width height zoom longitude and latitude) are no longer required if you render SVGOverlay, CanvasOverlay or HTMLOverlay as a child of the map. Perspective mode is now supported in all overlays.
  • New Props: maxPitch, minPitch, dragPan, doubleClickZoom, touchZoomRotate, scrollZoom are now provided to allow granular control of map interactivity.
  • Documentation: Significantly expanded and linked with our other geospatial frameworks.
  • Examples: New stand-alone examples to get you started instantly with the new features.
  • Event Handling: New event handling architecture that enables full customization of event handling (experimental).

Components​

InteractiveMap (New, MapGL replacement)​

This is a wrapper on top of StaticMap. It takes all the props of StaticMap and additional ones such as onViewportChange, scrollZoom, dragRotate, etc. to control interactivity on the map. See Source Code for more information.

StaticMap (New)​

This is the React wrapper around Mapbox GL JS and takes in viewport properties such as width, height, latitude, longitude. Style diffing and updating logic also live here. See Source Code for more information.

Overlays​

  • Three overlays (ScatterplotOverlay, DraggablePointsOverlay, ChoroplethOverlay), have been moved out of the library and are now only provided as examples.

Property Changes​

  • Property Names - some prop names have been modernized, the old ones will still work for now with a warning.
  • Internal Properties such as isHovering, isDragging, startDragLngLat have been removed. These were never meant to be useful publicly and have caused confusions in the past.

Utilities​

  • fitBounds: fitBounds has been moved to another repository and has been rewritten to provide a more logical interface.

For more information, see the Upgrade Guide.

react-map-gl v2.0​

Date: Jan 17, 2017

Highlights​

  • Latest mapbox-gl: Bump mapbox-gl to v0.31.0
  • new maxZoom prop - Add maxZoom prop and defaults to 20
  • New onLoad prop - Add onLoad event handler
  • new onClick prop - Add onClick prop handler (#140)

react-map-gl v1.0​

  • Perspective Mode - Now supports bearing and pitch properties, per mapbox-gl api documentation. These props default to 0 which means that maps will still be rendered in flat/ortographic mode when they are not provided
  • Support for ES6 imports - The map overlay components (HTMLOverlay, CanvasOverlay, SVGOverlay etc) previously had to be imported via their relative source paths can now be imported directly using `import {SVGOverlay} from 'react-map-gl'.

react-map-gl v0.6​

Initial public version

- + \ No newline at end of file diff --git a/examples.html b/examples.html index 34f79b97..9dbea669 100644 --- a/examples.html +++ b/examples.html @@ -4,13 +4,13 @@ React Map GL - +
- + \ No newline at end of file diff --git a/examples/clusters.html b/examples/clusters.html index 91209d42..373265f0 100644 --- a/examples/clusters.html +++ b/examples/clusters.html @@ -4,13 +4,13 @@ React Map GL - +

Clusters

Create and Style Clusters

Use Mapbox GL JS' built-in functions to visualize points as clusters.

View Code ↗
- + \ No newline at end of file diff --git a/examples/controls.html b/examples/controls.html index d2183763..bed9354e 100644 --- a/examples/controls.html +++ b/examples/controls.html @@ -4,13 +4,13 @@ React Map GL - +

Markers, Popups and Controls

Marker, Popup, NavigationControl and FullscreenControl

Map showing top 20 most populated cities of the United States. Click on a marker to learn more.

Data source: Wikipedia

View Code ↗
- + \ No newline at end of file diff --git a/examples/custom-cursor.html b/examples/custom-cursor.html index c25f3baf..fe337fbd 100644 --- a/examples/custom-cursor.html +++ b/examples/custom-cursor.html @@ -4,13 +4,13 @@ React Map GL - +

Custom Cursor

Custom Cursor

Customize the cursor based on interactivity.

View Code ↗

Clickable layers

- + \ No newline at end of file diff --git a/examples/draggable-markers.html b/examples/draggable-markers.html index df9af6c2..957e9936 100644 --- a/examples/draggable-markers.html +++ b/examples/draggable-markers.html @@ -4,13 +4,13 @@ React Map GL - +

Draggable Marker

Draggable Marker

Try dragging the marker to another location.

onDragStart: null
onDrag: null
onDragEnd: null
View Code ↗
- + \ No newline at end of file diff --git a/examples/draw-polygon.html b/examples/draw-polygon.html index 2ac2e40a..22d4d4df 100644 --- a/examples/draw-polygon.html +++ b/examples/draw-polygon.html @@ -4,13 +4,13 @@ React Map GL - +

Draw Polygon

Draw Polygon

View Code ↗
- + \ No newline at end of file diff --git a/examples/filter.html b/examples/filter.html index 1c139b66..28c78fa2 100644 --- a/examples/filter.html +++ b/examples/filter.html @@ -4,13 +4,13 @@ React Map GL - +

Highlight By Filter

Highlight Features Containing Similar Data

Hover over counties to highlight counties that share the same name.

View Code ↗
- + \ No newline at end of file diff --git a/examples/geocoder.html b/examples/geocoder.html index 91b09b7e..b4b19c70 100644 --- a/examples/geocoder.html +++ b/examples/geocoder.html @@ -4,13 +4,13 @@ React Map GL - +

Geocoder

Geocoder

View Code ↗
- + \ No newline at end of file diff --git a/examples/geojson-animation.html b/examples/geojson-animation.html index 8f9bd23b..03b6ec10 100644 --- a/examples/geojson-animation.html +++ b/examples/geojson-animation.html @@ -4,13 +4,13 @@ React Map GL - +

GeoJSON Animation

Animated GeoJSON

Render animation by updating GeoJSON data source.

View Code ↗
- + \ No newline at end of file diff --git a/examples/geojson.html b/examples/geojson.html index 415c3f61..9b8412a6 100644 --- a/examples/geojson.html +++ b/examples/geojson.html @@ -4,13 +4,13 @@ React Map GL - +

GeoJSON

Interactive GeoJSON

Map showing median household income by state in year 2015. Hover over a state to see details.

Data source: US Census Bureau

View Code ↗
- + \ No newline at end of file diff --git a/examples/heatmap.html b/examples/heatmap.html index f7fa22cd..a9e6463e 100644 --- a/examples/heatmap.html +++ b/examples/heatmap.html @@ -4,13 +4,13 @@ React Map GL - +

Heatmap

Heatmap

Map showing earthquakes
from 1/1/1970 to 1/1/1970.

Data source: earthquakes.geojson

View Code ↗
- + \ No newline at end of file diff --git a/examples/interaction.html b/examples/interaction.html index 531a47bb..05eed7dc 100644 --- a/examples/interaction.html +++ b/examples/interaction.html @@ -4,13 +4,13 @@ React Map GL - +

Limit Map Interaction

Limit Map Interaction

Turn interactive features off/on.

View Code ↗
- + \ No newline at end of file diff --git a/examples/layers.html b/examples/layers.html index f8af85fe..aab3f6c8 100644 --- a/examples/layers.html +++ b/examples/layers.html @@ -4,13 +4,13 @@ React Map GL - +

Dynamic Styling

Dynamic Styling

Dynamically show/hide map layers and change color with Immutable map style.

View Code ↗
- + \ No newline at end of file diff --git a/examples/side-by-side.html b/examples/side-by-side.html index 0211e17f..42784cc9 100644 --- a/examples/side-by-side.html +++ b/examples/side-by-side.html @@ -4,13 +4,13 @@ React Map GL - +

Side by Side

Side by Side

Synchronize two maps.

View Code ↗
- + \ No newline at end of file diff --git a/examples/terrain.html b/examples/terrain.html index 9019931a..b403e409 100644 --- a/examples/terrain.html +++ b/examples/terrain.html @@ -4,13 +4,13 @@ React Map GL - +

Terrain

3D Terrain

Add 3D terrain and sky to a map.

View Code ↗
- + \ No newline at end of file diff --git a/examples/viewport-animation.html b/examples/viewport-animation.html index d23a6a86..05b6bfc8 100644 --- a/examples/viewport-animation.html +++ b/examples/viewport-animation.html @@ -4,13 +4,13 @@ React Map GL - +

Camera Transition

Camera Transition

Smooth animate of the viewport.

View Code ↗
- + \ No newline at end of file diff --git a/examples/zoom-to-bounds.html b/examples/zoom-to-bounds.html index 2b75f9ac..5970cfac 100644 --- a/examples/zoom-to-bounds.html +++ b/examples/zoom-to-bounds.html @@ -4,13 +4,13 @@ React Map GL - +

Zoom to Bounds

Zoom to Bounding Box

Click on a San Fransisco Neighborhood to zoom in.

View Code ↗
- + \ No newline at end of file diff --git a/index.html b/index.html index 4731fbd0..baeec5c6 100644 --- a/index.html +++ b/index.html @@ -4,13 +4,13 @@ Home | React Map GL - +

React Map GL

React wrapper for Mapbox GL JS

GET STARTED

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

React Integration

Use Mapbox GL JS Map as a fully controlled reactive component.

Extensible

Comes with additional React interfaces such as context and hooks to support custom components.

Part of vis.gl's Framework Suite

Use together with e.g. deck.gl to render performant and compelling 2D and 3D WebGL visualizations on top of your Mapbox GL JS based maps.

- + \ No newline at end of file diff --git a/search-index.json b/search-index.json index 66629b46..d09e3a2b 100644 --- a/search-index.json +++ b/search-index.json @@ -1 +1 @@ -[{"documents":[{"i":1,"t":"Introduction","u":"/react-map-gl/docs","b":["Docs","Overview"]},{"i":7,"t":"AttributionControl","u":"/react-map-gl/docs/api-reference/attribution-control","b":["Docs","API Reference"]},{"i":16,"t":"FullscreenControl","u":"/react-map-gl/docs/api-reference/fullscreen-control","b":["Docs","API Reference"]},{"i":25,"t":"GeolocateControl","u":"/react-map-gl/docs/api-reference/geolocate-control","b":["Docs","API Reference"]},{"i":38,"t":"Layer","u":"/react-map-gl/docs/api-reference/layer","b":["Docs","API Reference"]},{"i":48,"t":"default (Map)","u":"/react-map-gl/docs/api-reference/map","b":["Docs","API Reference"]},{"i":68,"t":"MapProvider","u":"/react-map-gl/docs/api-reference/map-provider","b":["Docs","API Reference"]},{"i":72,"t":"Marker","u":"/react-map-gl/docs/api-reference/marker","b":["Docs","API Reference"]},{"i":85,"t":"NavigationControl","u":"/react-map-gl/docs/api-reference/navigation-control","b":["Docs","API Reference"]},{"i":94,"t":"Popup","u":"/react-map-gl/docs/api-reference/popup","b":["Docs","API Reference"]},{"i":107,"t":"ScaleControl","u":"/react-map-gl/docs/api-reference/scale-control","b":["Docs","API Reference"]},{"i":116,"t":"Source","u":"/react-map-gl/docs/api-reference/source","b":["Docs","API Reference"]},{"i":121,"t":"Types","u":"/react-map-gl/docs/api-reference/types","b":["Docs","API Reference"]},{"i":135,"t":"useControl","u":"/react-map-gl/docs/api-reference/use-control","b":["Docs","API Reference"]},{"i":141,"t":"useMap","u":"/react-map-gl/docs/api-reference/use-map","b":["Docs","API Reference"]},{"i":147,"t":"Contributing","u":"/react-map-gl/docs/contributing","b":["Docs","Overview"]},{"i":165,"t":"Get Started","u":"/react-map-gl/docs/get-started","b":["Docs","Developer Guide"]},{"i":175,"t":"Adding Custom Data","u":"/react-map-gl/docs/get-started/adding-custom-data","b":["Docs","Developer Guide"]},{"i":182,"t":"About Mapbox Tokens","u":"/react-map-gl/docs/get-started/mapbox-tokens","b":["Docs","Developer Guide"]},{"i":186,"t":"State Management","u":"/react-map-gl/docs/get-started/state-management","b":["Docs","Developer Guide"]},{"i":194,"t":"Tips and Tricks","u":"/react-map-gl/docs/get-started/tips-and-tricks","b":["Docs","Developer Guide"]},{"i":203,"t":"Upgrade Guide","u":"/react-map-gl/docs/upgrade-guide","b":["Docs","Overview"]},{"i":240,"t":"What's new","u":"/react-map-gl/docs/whats-new","b":["Docs","Overview"]}],"index":{"version":"2.3.9","fields":["t"],"fieldVectors":[["t/1",[0,3.1]],["t/7",[1,3.1]],["t/16",[2,3.1]],["t/25",[3,3.1]],["t/38",[4,3.1]],["t/48",[5,2.314,6,2.314]],["t/68",[7,3.1]],["t/72",[8,3.1]],["t/85",[9,3.1]],["t/94",[10,3.1]],["t/107",[11,3.1]],["t/116",[12,3.1]],["t/121",[13,3.1]],["t/135",[14,3.1]],["t/141",[15,3.1]],["t/147",[16,3.1]],["t/165",[17,3.1]],["t/175",[18,1.847,19,1.847,20,1.847]],["t/182",[21,2.314,22,2.314]],["t/186",[23,2.314,24,2.314]],["t/194",[25,2.314,26,2.314]],["t/203",[27,2.314,28,2.314]],["t/240",[29,2.314,30,2.314]]],"invertedIndex":[["ad",{"_index":18,"t":{"175":{"position":[[0,6]]}}}],["attributioncontrol",{"_index":1,"t":{"7":{"position":[[0,18]]}}}],["contribut",{"_index":16,"t":{"147":{"position":[[0,12]]}}}],["custom",{"_index":19,"t":{"175":{"position":[[7,6]]}}}],["data",{"_index":20,"t":{"175":{"position":[[14,4]]}}}],["default",{"_index":5,"t":{"48":{"position":[[0,7]]}}}],["fullscreencontrol",{"_index":2,"t":{"16":{"position":[[0,17]]}}}],["geolocatecontrol",{"_index":3,"t":{"25":{"position":[[0,16]]}}}],["guid",{"_index":28,"t":{"203":{"position":[[8,5]]}}}],["introduct",{"_index":0,"t":{"1":{"position":[[0,12]]}}}],["layer",{"_index":4,"t":{"38":{"position":[[0,5]]}}}],["manag",{"_index":24,"t":{"186":{"position":[[6,10]]}}}],["map",{"_index":6,"t":{"48":{"position":[[8,5]]}}}],["mapbox",{"_index":21,"t":{"182":{"position":[[6,6]]}}}],["mapprovid",{"_index":7,"t":{"68":{"position":[[0,11]]}}}],["marker",{"_index":8,"t":{"72":{"position":[[0,6]]}}}],["navigationcontrol",{"_index":9,"t":{"85":{"position":[[0,17]]}}}],["new",{"_index":30,"t":{"240":{"position":[[7,3]]}}}],["popup",{"_index":10,"t":{"94":{"position":[[0,5]]}}}],["scalecontrol",{"_index":11,"t":{"107":{"position":[[0,12]]}}}],["sourc",{"_index":12,"t":{"116":{"position":[[0,6]]}}}],["start",{"_index":17,"t":{"165":{"position":[[4,7]]}}}],["state",{"_index":23,"t":{"186":{"position":[[0,5]]}}}],["tip",{"_index":25,"t":{"194":{"position":[[0,4]]}}}],["token",{"_index":22,"t":{"182":{"position":[[13,6]]}}}],["trick",{"_index":26,"t":{"194":{"position":[[9,6]]}}}],["type",{"_index":13,"t":{"121":{"position":[[0,5]]}}}],["upgrad",{"_index":27,"t":{"203":{"position":[[0,7]]}}}],["usecontrol",{"_index":14,"t":{"135":{"position":[[0,10]]}}}],["usemap",{"_index":15,"t":{"141":{"position":[[0,6]]}}}],["what'",{"_index":29,"t":{"240":{"position":[[0,6]]}}}]],"pipeline":["stemmer"]}},{"documents":[{"i":3,"t":"Design Philosophy","u":"/react-map-gl/docs","h":"#design-philosophy","p":1},{"i":5,"t":"Limitations","u":"/react-map-gl/docs","h":"#limitations","p":1},{"i":9,"t":"Properties","u":"/react-map-gl/docs/api-reference/attribution-control","h":"#properties","p":7},{"i":10,"t":"Reactive Properties","u":"/react-map-gl/docs/api-reference/attribution-control","h":"#reactive-properties","p":7},{"i":12,"t":"Other Properties","u":"/react-map-gl/docs/api-reference/attribution-control","h":"#other-properties","p":7},{"i":14,"t":"Source","u":"/react-map-gl/docs/api-reference/attribution-control","h":"#source","p":7},{"i":18,"t":"Properties","u":"/react-map-gl/docs/api-reference/fullscreen-control","h":"#properties","p":16},{"i":19,"t":"Reactive Properties","u":"/react-map-gl/docs/api-reference/fullscreen-control","h":"#reactive-properties","p":16},{"i":21,"t":"Other Properties","u":"/react-map-gl/docs/api-reference/fullscreen-control","h":"#other-properties","p":16},{"i":23,"t":"Source","u":"/react-map-gl/docs/api-reference/fullscreen-control","h":"#source","p":16},{"i":27,"t":"Properties","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#properties","p":25},{"i":28,"t":"Reactive Properties","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#reactive-properties","p":25},{"i":30,"t":"Callbacks","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#callbacks","p":25},{"i":32,"t":"Other Properties","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#other-properties","p":25},{"i":34,"t":"Methods","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#methods","p":25},{"i":36,"t":"Source","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#source","p":25},{"i":40,"t":"Properties","u":"/react-map-gl/docs/api-reference/layer","h":"#properties","p":38},{"i":42,"t":"Identity Properties","u":"/react-map-gl/docs/api-reference/layer","h":"#identity-properties","p":38},{"i":44,"t":"Options","u":"/react-map-gl/docs/api-reference/layer","h":"#options","p":38},{"i":46,"t":"Source","u":"/react-map-gl/docs/api-reference/layer","h":"#source","p":38},{"i":50,"t":"Properties","u":"/react-map-gl/docs/api-reference/map","h":"#properties","p":48},{"i":52,"t":"Layout options","u":"/react-map-gl/docs/api-reference/map","h":"#layout-options","p":48},{"i":54,"t":"Styling options","u":"/react-map-gl/docs/api-reference/map","h":"#styling-options","p":48},{"i":56,"t":"Camera options","u":"/react-map-gl/docs/api-reference/map","h":"#camera-options","p":48},{"i":58,"t":"Input handler options","u":"/react-map-gl/docs/api-reference/map","h":"#input-handler-options","p":48},{"i":60,"t":"Callbacks","u":"/react-map-gl/docs/api-reference/map","h":"#callbacks","p":48},{"i":62,"t":"Other options","u":"/react-map-gl/docs/api-reference/map","h":"#other-options","p":48},{"i":64,"t":"Methods","u":"/react-map-gl/docs/api-reference/map","h":"#methods","p":48},{"i":66,"t":"Source","u":"/react-map-gl/docs/api-reference/map","h":"#source","p":48},{"i":70,"t":"Source","u":"/react-map-gl/docs/api-reference/map-provider","h":"#source","p":68},{"i":74,"t":"Properties","u":"/react-map-gl/docs/api-reference/marker","h":"#properties","p":72},{"i":75,"t":"Reactive Properties","u":"/react-map-gl/docs/api-reference/marker","h":"#reactive-properties","p":72},{"i":77,"t":"Callbacks","u":"/react-map-gl/docs/api-reference/marker","h":"#callbacks","p":72},{"i":79,"t":"Other Properties","u":"/react-map-gl/docs/api-reference/marker","h":"#other-properties","p":72},{"i":81,"t":"Methods","u":"/react-map-gl/docs/api-reference/marker","h":"#methods","p":72},{"i":83,"t":"Source","u":"/react-map-gl/docs/api-reference/marker","h":"#source","p":72},{"i":87,"t":"Properties","u":"/react-map-gl/docs/api-reference/navigation-control","h":"#properties","p":85},{"i":88,"t":"Reactive Properties","u":"/react-map-gl/docs/api-reference/navigation-control","h":"#reactive-properties","p":85},{"i":90,"t":"Other Properties","u":"/react-map-gl/docs/api-reference/navigation-control","h":"#other-properties","p":85},{"i":92,"t":"Source","u":"/react-map-gl/docs/api-reference/navigation-control","h":"#source","p":85},{"i":96,"t":"Properties","u":"/react-map-gl/docs/api-reference/popup","h":"#properties","p":94},{"i":97,"t":"Reactive Properties","u":"/react-map-gl/docs/api-reference/popup","h":"#reactive-properties","p":94},{"i":99,"t":"Callbacks","u":"/react-map-gl/docs/api-reference/popup","h":"#callbacks","p":94},{"i":101,"t":"Other Properties","u":"/react-map-gl/docs/api-reference/popup","h":"#other-properties","p":94},{"i":103,"t":"Methods","u":"/react-map-gl/docs/api-reference/popup","h":"#methods","p":94},{"i":105,"t":"Source","u":"/react-map-gl/docs/api-reference/popup","h":"#source","p":94},{"i":109,"t":"Properties","u":"/react-map-gl/docs/api-reference/scale-control","h":"#properties","p":107},{"i":110,"t":"Reactive Properties","u":"/react-map-gl/docs/api-reference/scale-control","h":"#reactive-properties","p":107},{"i":112,"t":"Other Properties","u":"/react-map-gl/docs/api-reference/scale-control","h":"#other-properties","p":107},{"i":114,"t":"Source","u":"/react-map-gl/docs/api-reference/scale-control","h":"#source","p":107},{"i":118,"t":"Properties","u":"/react-map-gl/docs/api-reference/source","h":"#properties","p":116},{"i":123,"t":"Components","u":"/react-map-gl/docs/api-reference/types","h":"#components","p":121},{"i":125,"t":"Styling","u":"/react-map-gl/docs/api-reference/types","h":"#styling","p":121},{"i":127,"t":"Configurations","u":"/react-map-gl/docs/api-reference/types","h":"#configurations","p":121},{"i":129,"t":"Data Types","u":"/react-map-gl/docs/api-reference/types","h":"#data-types","p":121},{"i":131,"t":"Sources","u":"/react-map-gl/docs/api-reference/types","h":"#sources","p":121},{"i":133,"t":"Events","u":"/react-map-gl/docs/api-reference/types","h":"#events","p":121},{"i":137,"t":"Signature","u":"/react-map-gl/docs/api-reference/use-control","h":"#signature","p":135},{"i":139,"t":"Source","u":"/react-map-gl/docs/api-reference/use-control","h":"#source","p":135},{"i":143,"t":"Signature","u":"/react-map-gl/docs/api-reference/use-map","h":"#signature","p":141},{"i":145,"t":"Source","u":"/react-map-gl/docs/api-reference/use-map","h":"#source","p":141},{"i":149,"t":"Setting Up Dev Environment","u":"/react-map-gl/docs/contributing","h":"#setting-up-dev-environment","p":147},{"i":151,"t":"Pull Requests","u":"/react-map-gl/docs/contributing","h":"#pull-requests","p":147},{"i":153,"t":"PR Checklist","u":"/react-map-gl/docs/contributing","h":"#pr-checklist","p":147},{"i":155,"t":"Release","u":"/react-map-gl/docs/contributing","h":"#release","p":147},{"i":157,"t":"Community Governance","u":"/react-map-gl/docs/contributing","h":"#community-governance","p":147},{"i":159,"t":"Technical Steering Committee","u":"/react-map-gl/docs/contributing","h":"#technical-steering-committee","p":147},{"i":161,"t":"Maintainers","u":"/react-map-gl/docs/contributing","h":"#maintainers","p":147},{"i":163,"t":"Code of Conduct","u":"/react-map-gl/docs/contributing","h":"#code-of-conduct","p":147},{"i":167,"t":"Installation","u":"/react-map-gl/docs/get-started","h":"#installation","p":165},{"i":169,"t":"Example","u":"/react-map-gl/docs/get-started","h":"#example","p":165},{"i":171,"t":"Styling","u":"/react-map-gl/docs/get-started","h":"#styling","p":165},{"i":173,"t":"Using with a Compatible Fork","u":"/react-map-gl/docs/get-started","h":"#using-with-a-compatible-fork","p":165},{"i":176,"t":"Native Mapbox Layers","u":"/react-map-gl/docs/get-started/adding-custom-data","h":"#native-mapbox-layers","p":175},{"i":178,"t":"Custom Overlays","u":"/react-map-gl/docs/get-started/adding-custom-data","h":"#custom-overlays","p":175},{"i":180,"t":"Other vis.gl Libraries","u":"/react-map-gl/docs/get-started/adding-custom-data","h":"#other-visgl-libraries","p":175},{"i":184,"t":"Display Maps Without A Mapbox Token","u":"/react-map-gl/docs/get-started/mapbox-tokens","h":"#display-maps-without-a-mapbox-token","p":182},{"i":188,"t":"Uncontrolled Map","u":"/react-map-gl/docs/get-started/state-management","h":"#uncontrolled-map","p":186},{"i":190,"t":"Controlled Map","u":"/react-map-gl/docs/get-started/state-management","h":"#controlled-map","p":186},{"i":192,"t":"Custom Camera Constraints","u":"/react-map-gl/docs/get-started/state-management","h":"#custom-camera-constraints","p":186},{"i":195,"t":"Securing Mapbox Token","u":"/react-map-gl/docs/get-started/tips-and-tricks","h":"#securing-mapbox-token","p":194},{"i":197,"t":"Minimize Cost from Frequent Re-mounting","u":"/react-map-gl/docs/get-started/tips-and-tricks","h":"#minimize-cost-from-frequent-re-mounting","p":194},{"i":199,"t":"Performance with Many Markers","u":"/react-map-gl/docs/get-started/tips-and-tricks","h":"#performance-with-many-markers","p":194},{"i":201,"t":"Finding out if a point is within the current viewport","u":"/react-map-gl/docs/get-started/tips-and-tricks","h":"#finding-out-if-a-point-is-within-the-current-viewport","p":194},{"i":204,"t":"Upgrading to v7.1","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v71","p":203},{"i":206,"t":"Upgrading to v7.0","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v70","p":203},{"i":208,"t":"Dependencies","u":"/react-map-gl/docs/upgrade-guide","h":"#dependencies","p":203},{"i":210,"t":"Module exports","u":"/react-map-gl/docs/upgrade-guide","h":"#module-exports","p":203},{"i":212,"t":"Map","u":"/react-map-gl/docs/upgrade-guide","h":"#map","p":203},{"i":214,"t":"Other components","u":"/react-map-gl/docs/upgrade-guide","h":"#other-components","p":203},{"i":216,"t":"Upgrading to v5.3/v6.1","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v53v61","p":203},{"i":218,"t":"Upgrading to v6","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v6","p":203},{"i":220,"t":"Upgrading to v4","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v4","p":203},{"i":222,"t":"Upgrading to v3.2","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v32","p":203},{"i":224,"t":"Upgrading to v3","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v3","p":203},{"i":226,"t":"Version Requirements","u":"/react-map-gl/docs/upgrade-guide","h":"#version-requirements","p":203},{"i":228,"t":"MapGL Component","u":"/react-map-gl/docs/upgrade-guide","h":"#mapgl-component","p":203},{"i":230,"t":"Overlays","u":"/react-map-gl/docs/upgrade-guide","h":"#overlays","p":203},{"i":232,"t":"fitBounds utility function","u":"/react-map-gl/docs/upgrade-guide","h":"#fitbounds-utility-function","p":203},{"i":234,"t":"Deprecations","u":"/react-map-gl/docs/upgrade-guide","h":"#deprecations","p":203},{"i":236,"t":"Upgrading to v2","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v2","p":203},{"i":238,"t":"Upgrading to v1","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v1","p":203},{"i":241,"t":"react-map-gl v7.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v71","p":240},{"i":243,"t":"react-map-gl v7.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v70","p":240},{"i":245,"t":"react-map-gl v5.3/v6.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v53v61","p":240},{"i":247,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights","p":240},{"i":249,"t":"react-map-gl v6.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v60","p":240},{"i":251,"t":"What's Changed","u":"/react-map-gl/docs/whats-new","h":"#whats-changed","p":240},{"i":253,"t":"react-map-gl v5.2","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v52","p":240},{"i":255,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-1","p":240},{"i":257,"t":"react-map-gl v5.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v51","p":240},{"i":259,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-2","p":240},{"i":261,"t":"react-map-gl v5.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v50","p":240},{"i":263,"t":"What's Changed","u":"/react-map-gl/docs/whats-new","h":"#whats-changed-1","p":240},{"i":265,"t":"react-map-gl v4.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v41","p":240},{"i":267,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-3","p":240},{"i":269,"t":"react-map-gl v4.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v40","p":240},{"i":271,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-4","p":240},{"i":273,"t":"react-map-gl v3.3","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v33","p":240},{"i":275,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-5","p":240},{"i":277,"t":"react-map-gl v3.2","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v32","p":240},{"i":279,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-6","p":240},{"i":281,"t":"react-map-gl v3.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v31","p":240},{"i":283,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-7","p":240},{"i":285,"t":"react-map-gl v3.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v30","p":240},{"i":287,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-8","p":240},{"i":289,"t":"Components","u":"/react-map-gl/docs/whats-new","h":"#components","p":240},{"i":291,"t":"Property Changes","u":"/react-map-gl/docs/whats-new","h":"#property-changes","p":240},{"i":293,"t":"Utilities","u":"/react-map-gl/docs/whats-new","h":"#utilities","p":240},{"i":295,"t":"react-map-gl v2.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v20","p":240},{"i":297,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-9","p":240},{"i":299,"t":"react-map-gl v1.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v10","p":240},{"i":301,"t":"react-map-gl v0.6","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v06","p":240}],"index":{"version":"2.3.9","fields":["t"],"fieldVectors":[["t/3",[0,4.37,1,4.37]],["t/5",[2,5.55]],["t/9",[3,2.002]],["t/10",[3,1.577,4,2.805]],["t/12",[3,2.002]],["t/14",[5,2.836]],["t/18",[3,2.002]],["t/19",[3,1.577,4,2.805]],["t/21",[3,2.002]],["t/23",[5,2.836]],["t/27",[3,2.002]],["t/28",[3,1.577,4,2.805]],["t/30",[6,4.193]],["t/32",[3,2.002]],["t/34",[7,4.193]],["t/36",[5,2.836]],["t/40",[3,2.002]],["t/42",[3,1.577,8,4.37]],["t/44",[9,3.739]],["t/46",[5,2.836]],["t/50",[3,2.002]],["t/52",[9,2.944,10,4.37]],["t/54",[9,2.944,11,3.546]],["t/56",[9,2.944,12,3.873]],["t/58",[9,2.428,13,3.604,14,3.604]],["t/60",[6,4.193]],["t/62",[9,3.739]],["t/64",[7,4.193]],["t/66",[5,2.836]],["t/70",[5,2.836]],["t/74",[3,2.002]],["t/75",[3,1.577,4,2.805]],["t/77",[6,4.193]],["t/79",[3,2.002]],["t/81",[7,4.193]],["t/83",[5,2.836]],["t/87",[3,2.002]],["t/88",[3,1.577,4,2.805]],["t/90",[3,2.002]],["t/92",[5,2.836]],["t/96",[3,2.002]],["t/97",[3,1.577,4,2.805]],["t/99",[6,4.193]],["t/101",[3,2.002]],["t/103",[7,4.193]],["t/105",[5,2.836]],["t/109",[3,2.002]],["t/110",[3,1.577,4,2.805]],["t/112",[3,2.002]],["t/114",[5,2.836]],["t/118",[3,2.002]],["t/123",[15,4.193]],["t/125",[11,4.503]],["t/127",[16,5.55]],["t/129",[17,4.37,18,4.37]],["t/131",[5,2.836]],["t/133",[19,5.55]],["t/137",[20,4.919]],["t/139",[5,2.836]],["t/143",[20,4.919]],["t/145",[5,2.836]],["t/149",[21,3.067,22,3.067,23,3.067,24,3.067]],["t/151",[25,4.37,26,4.37]],["t/153",[27,4.37,28,4.37]],["t/155",[29,5.55]],["t/157",[30,4.37,31,4.37]],["t/159",[32,3.604,33,3.604,34,3.604]],["t/161",[35,5.55]],["t/163",[36,4.37,37,4.37]],["t/167",[38,5.55]],["t/169",[39,5.55]],["t/171",[11,4.503]],["t/173",[40,3.604,41,3.604,42,3.604]],["t/176",[43,3.604,44,2.924,45,3.604]],["t/178",[46,3.873,47,3.873]],["t/180",[48,4.37,49,4.37]],["t/184",[44,2.165,50,2.669,51,1.115,52,2.669,53,2.365]],["t/188",[51,1.826,54,4.37]],["t/190",[51,1.826,55,4.37]],["t/192",[12,3.194,46,3.194,56,3.604]],["t/195",[44,2.924,53,3.194,57,3.604]],["t/197",[58,2.669,59,2.669,60,2.669,61,2.669,62,2.669]],["t/199",[63,3.604,64,3.604,65,3.604]],["t/201",[66,2.362,67,2.362,68,2.362,69,2.362,70,2.362,71,2.362]],["t/204",[72,2.575,73,3.873]],["t/206",[72,2.575,74,3.873]],["t/208",[75,5.55]],["t/210",[76,4.37,77,4.37]],["t/212",[51,2.319]],["t/214",[15,4.193]],["t/216",[72,2.575,78,3.873]],["t/218",[72,2.575,79,4.37]],["t/220",[72,2.575,80,4.37]],["t/222",[72,2.575,81,3.873]],["t/224",[72,2.575,82,4.37]],["t/226",[83,4.37,84,4.37]],["t/228",[15,3.302,85,4.37]],["t/230",[47,4.919]],["t/232",[86,3.604,87,3.194,88,3.604]],["t/234",[89,5.55]],["t/236",[72,2.575,90,4.37]],["t/238",[72,2.575,91,4.37]],["t/241",[51,1.282,73,2.718,92,1.43,93,1.43]],["t/243",[51,1.282,74,2.718,92,1.43,93,1.43]],["t/245",[51,1.282,78,2.718,92,1.43,93,1.43]],["t/247",[94,3.146]],["t/249",[51,1.282,92,1.43,93,1.43,95,3.067]],["t/251",[96,3.873,97,3.546]],["t/253",[51,1.282,92,1.43,93,1.43,98,3.067]],["t/255",[94,3.146]],["t/257",[51,1.282,92,1.43,93,1.43,99,3.067]],["t/259",[94,3.146]],["t/261",[51,1.282,92,1.43,93,1.43,100,3.067]],["t/263",[96,3.873,97,3.546]],["t/265",[51,1.282,92,1.43,93,1.43,101,3.067]],["t/267",[94,3.146]],["t/269",[51,1.282,92,1.43,93,1.43,102,3.067]],["t/271",[94,3.146]],["t/273",[51,1.282,92,1.43,93,1.43,103,3.067]],["t/275",[94,3.146]],["t/277",[51,1.282,81,2.718,92,1.43,93,1.43]],["t/279",[94,3.146]],["t/281",[51,1.282,92,1.43,93,1.43,104,3.067]],["t/283",[94,3.146]],["t/285",[51,1.282,92,1.43,93,1.43,105,3.067]],["t/287",[94,3.146]],["t/289",[15,4.193]],["t/291",[3,1.577,97,3.546]],["t/293",[87,4.919]],["t/295",[51,1.282,92,1.43,93,1.43,106,3.067]],["t/297",[94,3.146]],["t/299",[51,1.282,92,1.43,93,1.43,107,3.067]],["t/301",[51,1.282,92,1.43,93,1.43,108,3.067]]],"invertedIndex":[["callback",{"_index":6,"t":{"30":{"position":[[0,9]]},"60":{"position":[[0,9]]},"77":{"position":[[0,9]]},"99":{"position":[[0,9]]}}}],["camera",{"_index":12,"t":{"56":{"position":[[0,6]]},"192":{"position":[[7,6]]}}}],["chang",{"_index":97,"t":{"251":{"position":[[7,7]]},"263":{"position":[[7,7]]},"291":{"position":[[9,7]]}}}],["checklist",{"_index":28,"t":{"153":{"position":[[3,9]]}}}],["code",{"_index":36,"t":{"163":{"position":[[0,4]]}}}],["committe",{"_index":34,"t":{"159":{"position":[[19,9]]}}}],["commun",{"_index":30,"t":{"157":{"position":[[0,9]]}}}],["compat",{"_index":41,"t":{"173":{"position":[[13,10]]}}}],["compon",{"_index":15,"t":{"123":{"position":[[0,10]]},"214":{"position":[[6,10]]},"228":{"position":[[6,9]]},"289":{"position":[[0,10]]}}}],["conduct",{"_index":37,"t":{"163":{"position":[[8,7]]}}}],["configur",{"_index":16,"t":{"127":{"position":[[0,14]]}}}],["constraint",{"_index":56,"t":{"192":{"position":[[14,11]]}}}],["control",{"_index":55,"t":{"190":{"position":[[0,10]]}}}],["cost",{"_index":59,"t":{"197":{"position":[[9,4]]}}}],["current",{"_index":70,"t":{"201":{"position":[[37,7]]}}}],["custom",{"_index":46,"t":{"178":{"position":[[0,6]]},"192":{"position":[[0,6]]}}}],["data",{"_index":17,"t":{"129":{"position":[[0,4]]}}}],["depend",{"_index":75,"t":{"208":{"position":[[0,12]]}}}],["deprec",{"_index":89,"t":{"234":{"position":[[0,12]]}}}],["design",{"_index":0,"t":{"3":{"position":[[0,6]]}}}],["dev",{"_index":23,"t":{"149":{"position":[[11,3]]}}}],["display",{"_index":50,"t":{"184":{"position":[[0,7]]}}}],["environ",{"_index":24,"t":{"149":{"position":[[15,11]]}}}],["event",{"_index":19,"t":{"133":{"position":[[0,6]]}}}],["exampl",{"_index":39,"t":{"169":{"position":[[0,7]]}}}],["export",{"_index":77,"t":{"210":{"position":[[7,7]]}}}],["find",{"_index":66,"t":{"201":{"position":[[0,7]]}}}],["fitbound",{"_index":86,"t":{"232":{"position":[[0,9]]}}}],["fork",{"_index":42,"t":{"173":{"position":[[24,4]]}}}],["frequent",{"_index":60,"t":{"197":{"position":[[19,8]]}}}],["function",{"_index":88,"t":{"232":{"position":[[18,8]]}}}],["gl",{"_index":93,"t":{"241":{"position":[[10,2]]},"243":{"position":[[10,2]]},"245":{"position":[[10,2]]},"249":{"position":[[10,2]]},"253":{"position":[[10,2]]},"257":{"position":[[10,2]]},"261":{"position":[[10,2]]},"265":{"position":[[10,2]]},"269":{"position":[[10,2]]},"273":{"position":[[10,2]]},"277":{"position":[[10,2]]},"281":{"position":[[10,2]]},"285":{"position":[[10,2]]},"295":{"position":[[10,2]]},"299":{"position":[[10,2]]},"301":{"position":[[10,2]]}}}],["govern",{"_index":31,"t":{"157":{"position":[[10,10]]}}}],["handler",{"_index":14,"t":{"58":{"position":[[6,7]]}}}],["highlight",{"_index":94,"t":{"247":{"position":[[0,10]]},"255":{"position":[[0,10]]},"259":{"position":[[0,10]]},"267":{"position":[[0,10]]},"271":{"position":[[0,10]]},"275":{"position":[[0,10]]},"279":{"position":[[0,10]]},"283":{"position":[[0,10]]},"287":{"position":[[0,10]]},"297":{"position":[[0,10]]}}}],["ident",{"_index":8,"t":{"42":{"position":[[0,8]]}}}],["input",{"_index":13,"t":{"58":{"position":[[0,5]]}}}],["instal",{"_index":38,"t":{"167":{"position":[[0,12]]}}}],["layer",{"_index":45,"t":{"176":{"position":[[14,6]]}}}],["layout",{"_index":10,"t":{"52":{"position":[[0,6]]}}}],["librari",{"_index":49,"t":{"180":{"position":[[13,9]]}}}],["limit",{"_index":2,"t":{"5":{"position":[[0,11]]}}}],["maintain",{"_index":35,"t":{"161":{"position":[[0,11]]}}}],["mani",{"_index":64,"t":{"199":{"position":[[17,4]]}}}],["map",{"_index":51,"t":{"184":{"position":[[8,4]]},"188":{"position":[[13,3]]},"190":{"position":[[11,3]]},"212":{"position":[[0,3]]},"241":{"position":[[6,3]]},"243":{"position":[[6,3]]},"245":{"position":[[6,3]]},"249":{"position":[[6,3]]},"253":{"position":[[6,3]]},"257":{"position":[[6,3]]},"261":{"position":[[6,3]]},"265":{"position":[[6,3]]},"269":{"position":[[6,3]]},"273":{"position":[[6,3]]},"277":{"position":[[6,3]]},"281":{"position":[[6,3]]},"285":{"position":[[6,3]]},"295":{"position":[[6,3]]},"299":{"position":[[6,3]]},"301":{"position":[[6,3]]}}}],["mapbox",{"_index":44,"t":{"176":{"position":[[7,6]]},"184":{"position":[[23,6]]},"195":{"position":[[9,6]]}}}],["mapgl",{"_index":85,"t":{"228":{"position":[[0,5]]}}}],["marker",{"_index":65,"t":{"199":{"position":[[22,7]]}}}],["method",{"_index":7,"t":{"34":{"position":[[0,7]]},"64":{"position":[[0,7]]},"81":{"position":[[0,7]]},"103":{"position":[[0,7]]}}}],["minim",{"_index":58,"t":{"197":{"position":[[0,8]]}}}],["modul",{"_index":76,"t":{"210":{"position":[[0,6]]}}}],["mount",{"_index":62,"t":{"197":{"position":[[31,8]]}}}],["nativ",{"_index":43,"t":{"176":{"position":[[0,6]]}}}],["option",{"_index":9,"t":{"44":{"position":[[0,7]]},"52":{"position":[[7,7]]},"54":{"position":[[8,7]]},"56":{"position":[[7,7]]},"58":{"position":[[14,7]]},"62":{"position":[[6,7]]}}}],["out",{"_index":67,"t":{"201":{"position":[[8,3]]}}}],["overlay",{"_index":47,"t":{"178":{"position":[[7,8]]},"230":{"position":[[0,8]]}}}],["perform",{"_index":63,"t":{"199":{"position":[[0,11]]}}}],["philosophi",{"_index":1,"t":{"3":{"position":[[7,10]]}}}],["point",{"_index":68,"t":{"201":{"position":[[17,5]]}}}],["pr",{"_index":27,"t":{"153":{"position":[[0,2]]}}}],["properti",{"_index":3,"t":{"9":{"position":[[0,10]]},"10":{"position":[[9,10]]},"12":{"position":[[6,10]]},"18":{"position":[[0,10]]},"19":{"position":[[9,10]]},"21":{"position":[[6,10]]},"27":{"position":[[0,10]]},"28":{"position":[[9,10]]},"32":{"position":[[6,10]]},"40":{"position":[[0,10]]},"42":{"position":[[9,10]]},"50":{"position":[[0,10]]},"74":{"position":[[0,10]]},"75":{"position":[[9,10]]},"79":{"position":[[6,10]]},"87":{"position":[[0,10]]},"88":{"position":[[9,10]]},"90":{"position":[[6,10]]},"96":{"position":[[0,10]]},"97":{"position":[[9,10]]},"101":{"position":[[6,10]]},"109":{"position":[[0,10]]},"110":{"position":[[9,10]]},"112":{"position":[[6,10]]},"118":{"position":[[0,10]]},"291":{"position":[[0,8]]}}}],["pull",{"_index":25,"t":{"151":{"position":[[0,4]]}}}],["re",{"_index":61,"t":{"197":{"position":[[28,2]]}}}],["react",{"_index":92,"t":{"241":{"position":[[0,5]]},"243":{"position":[[0,5]]},"245":{"position":[[0,5]]},"249":{"position":[[0,5]]},"253":{"position":[[0,5]]},"257":{"position":[[0,5]]},"261":{"position":[[0,5]]},"265":{"position":[[0,5]]},"269":{"position":[[0,5]]},"273":{"position":[[0,5]]},"277":{"position":[[0,5]]},"281":{"position":[[0,5]]},"285":{"position":[[0,5]]},"295":{"position":[[0,5]]},"299":{"position":[[0,5]]},"301":{"position":[[0,5]]}}}],["reactiv",{"_index":4,"t":{"10":{"position":[[0,8]]},"19":{"position":[[0,8]]},"28":{"position":[[0,8]]},"75":{"position":[[0,8]]},"88":{"position":[[0,8]]},"97":{"position":[[0,8]]},"110":{"position":[[0,8]]}}}],["releas",{"_index":29,"t":{"155":{"position":[[0,7]]}}}],["request",{"_index":26,"t":{"151":{"position":[[5,8]]}}}],["requir",{"_index":84,"t":{"226":{"position":[[8,12]]}}}],["secur",{"_index":57,"t":{"195":{"position":[[0,8]]}}}],["set",{"_index":21,"t":{"149":{"position":[[0,7]]}}}],["signatur",{"_index":20,"t":{"137":{"position":[[0,9]]},"143":{"position":[[0,9]]}}}],["sourc",{"_index":5,"t":{"14":{"position":[[0,6]]},"23":{"position":[[0,6]]},"36":{"position":[[0,6]]},"46":{"position":[[0,6]]},"66":{"position":[[0,6]]},"70":{"position":[[0,6]]},"83":{"position":[[0,6]]},"92":{"position":[[0,6]]},"105":{"position":[[0,6]]},"114":{"position":[[0,6]]},"131":{"position":[[0,7]]},"139":{"position":[[0,6]]},"145":{"position":[[0,6]]}}}],["steer",{"_index":33,"t":{"159":{"position":[[10,8]]}}}],["style",{"_index":11,"t":{"54":{"position":[[0,7]]},"125":{"position":[[0,7]]},"171":{"position":[[0,7]]}}}],["technic",{"_index":32,"t":{"159":{"position":[[0,9]]}}}],["token",{"_index":53,"t":{"184":{"position":[[30,5]]},"195":{"position":[[16,5]]}}}],["type",{"_index":18,"t":{"129":{"position":[[5,5]]}}}],["uncontrol",{"_index":54,"t":{"188":{"position":[[0,12]]}}}],["up",{"_index":22,"t":{"149":{"position":[[8,2]]}}}],["upgrad",{"_index":72,"t":{"204":{"position":[[0,9]]},"206":{"position":[[0,9]]},"216":{"position":[[0,9]]},"218":{"position":[[0,9]]},"220":{"position":[[0,9]]},"222":{"position":[[0,9]]},"224":{"position":[[0,9]]},"236":{"position":[[0,9]]},"238":{"position":[[0,9]]}}}],["us",{"_index":40,"t":{"173":{"position":[[0,5]]}}}],["util",{"_index":87,"t":{"232":{"position":[[10,7]]},"293":{"position":[[0,9]]}}}],["v0.6",{"_index":108,"t":{"301":{"position":[[13,4]]}}}],["v1",{"_index":91,"t":{"238":{"position":[[13,2]]}}}],["v1.0",{"_index":107,"t":{"299":{"position":[[13,4]]}}}],["v2",{"_index":90,"t":{"236":{"position":[[13,2]]}}}],["v2.0",{"_index":106,"t":{"295":{"position":[[13,4]]}}}],["v3",{"_index":82,"t":{"224":{"position":[[13,2]]}}}],["v3.0",{"_index":105,"t":{"285":{"position":[[13,4]]}}}],["v3.1",{"_index":104,"t":{"281":{"position":[[13,4]]}}}],["v3.2",{"_index":81,"t":{"222":{"position":[[13,4]]},"277":{"position":[[13,4]]}}}],["v3.3",{"_index":103,"t":{"273":{"position":[[13,4]]}}}],["v4",{"_index":80,"t":{"220":{"position":[[13,2]]}}}],["v4.0",{"_index":102,"t":{"269":{"position":[[13,4]]}}}],["v4.1",{"_index":101,"t":{"265":{"position":[[13,4]]}}}],["v5.0",{"_index":100,"t":{"261":{"position":[[13,4]]}}}],["v5.1",{"_index":99,"t":{"257":{"position":[[13,4]]}}}],["v5.2",{"_index":98,"t":{"253":{"position":[[13,4]]}}}],["v5.3/v6.1",{"_index":78,"t":{"216":{"position":[[13,9]]},"245":{"position":[[13,9]]}}}],["v6",{"_index":79,"t":{"218":{"position":[[13,2]]}}}],["v6.0",{"_index":95,"t":{"249":{"position":[[13,4]]}}}],["v7.0",{"_index":74,"t":{"206":{"position":[[13,4]]},"243":{"position":[[13,4]]}}}],["v7.1",{"_index":73,"t":{"204":{"position":[[13,4]]},"241":{"position":[[13,4]]}}}],["version",{"_index":83,"t":{"226":{"position":[[0,7]]}}}],["viewport",{"_index":71,"t":{"201":{"position":[[45,8]]}}}],["vis.gl",{"_index":48,"t":{"180":{"position":[[6,6]]}}}],["what'",{"_index":96,"t":{"251":{"position":[[0,6]]},"263":{"position":[[0,6]]}}}],["within",{"_index":69,"t":{"201":{"position":[[26,6]]}}}],["without",{"_index":52,"t":{"184":{"position":[[13,7]]}}}]],"pipeline":["stemmer"]}},{"documents":[{"i":2,"t":"These docs are forLooking for an old version? react-map-gl is a suite of React components for Mapbox GL JS-compatible libraries. Library Description MapLibre An open fork of mapbox-gl v1, that can be used without a mapbox token. Mapbox GL JS v1 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 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. For basemaps: You can load map data from Mapbox's own service. You can create and host your own map data using one of the many open source tools. New to react-map-gl? Get Started Want to contribute? See our Developer Guide","s":"Introduction","u":"/react-map-gl/docs","h":"","p":1},{"i":4,"t":"react-map-gl was first created by Uber's Visualization team, where Mapbox was used as a component to build powerful web tools such as geospatial analytics and self-driving data visualization. To manage the complexity of these applications, we fully embrace React and reactive programming. The stock mapbox-gl APIs are imperative. That is, you instruct the map to do something (for example, map.flyTo), and it will execute the command at its own pace. This does not scale when we have many components that need to synchronize with each other. We sometimes render two maps side by side, and when the user interacts with one, update both cameras. We draw React UI outside of the map container, that moves with the camera. We also render WebGL graphic overlays on top of the map, most notably with deck.gl. In these use cases, in order for all components to synchronize correctly, they must have their shared states managed by React. We might store the source of truth in a parent component state, or Redux store, or hooks, and let it propagate down to the map as well as its peers. Ultimately, in the spirit of the reactive programming paradigm, data always flows down. As long as the map manages its own state, as mapbox-gl is designed to do, we risk the components going out of sync. react-map-gl creates a fully reactive wrapper for mapbox-gl. The Map component can be fully controlled, that is, the map's camera would never deviate from the props that it's assigned. Read more about this core behavior in state management.","s":"Design Philosophy","u":"/react-map-gl/docs","h":"#design-philosophy","p":1},{"i":6,"t":"In v7.0, react-map-gl was fully rewritten to better align its API with the underlying Mapbox GL JS library. Wherever the reactive usage patterns permits, the wrapper's props and methods are 1:1 mappings to their native API equivelants. It is possible to call the native methods directly from the Map instance obtained via getMap. However, doing so may result in the map's state to deviate from its props. For example, calling map.setMaxZoom directly will cause the map's constraint settings to differ from the value of the maxZoom prop. Generally speaking, calling a native method is disencouraged if the same thing can be achieved through the React interface. If a third-party plugin does so, then it may lead to some unexpected behaviors.","s":"Limitations","u":"/react-map-gl/docs","h":"#limitations","p":1},{"i":8,"t":"React component that wraps the base library's AttributionControl class (Mapbox | Maplibre). Mapbox Maplibre import * as React from 'react'; import Map, {AttributionControl} from 'react-map-gl'; function App() { return \" initialViewState={{ longitude: -100, latitude: 40, zoom: 3.5 }} mapStyle=\"mapbox://styles/mapbox/streets-v9\" // disable the default attribution attributionControl={false} > ; } import * as React from 'react'; import Map, {AttributionControl} from 'react-map-gl/maplibre'; function App() { return ; }","s":"AttributionControl","u":"/react-map-gl/docs/api-reference/attribution-control","h":"","p":7},{"i":11,"t":"style: CSSProperties​ CSS style override that applies to the control's container.","s":"Reactive Properties","u":"/react-map-gl/docs/api-reference/attribution-control","h":"#reactive-properties","p":7},{"i":13,"t":"The properties in this section are not reactive. They are only used when the component first mounts. Any options supported by the AttributionControl class (Mapbox | Maplibre), such as compact customAttribution Plus the following: position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'​ Default: 'bottom-right' Placement of the control relative to the map.","s":"Other Properties","u":"/react-map-gl/docs/api-reference/attribution-control","h":"#other-properties","p":7},{"i":15,"t":"attribution-control.ts","s":"Source","u":"/react-map-gl/docs/api-reference/attribution-control","h":"#source","p":7},{"i":17,"t":"React component that wraps the base library's FullscreenControl class (Mapbox | Maplibre). Mapbox Maplibre import * as React from 'react'; import Map, {FullscreenControl} from 'react-map-gl'; function App() { return \" initialViewState={{ longitude: -100, latitude: 40, zoom: 3.5 }} mapStyle=\"mapbox://styles/mapbox/streets-v9\" > ; } import * as React from 'react'; import Map, {FullscreenControl} from 'react-map-gl/maplibre'; function App() { return ; }","s":"FullscreenControl","u":"/react-map-gl/docs/api-reference/fullscreen-control","h":"","p":16},{"i":20,"t":"style: CSSProperties​ CSS style override that applies to the control's container.","s":"Reactive Properties","u":"/react-map-gl/docs/api-reference/fullscreen-control","h":"#reactive-properties","p":16},{"i":22,"t":"The properties in this section are not reactive. They are only used when the component first mounts. containerId: string​ Id of the DOM element which should be made full screen. By default, the map container element will be made full screen. position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'​ Default: 'top-right' Placement of the control relative to the map.","s":"Other Properties","u":"/react-map-gl/docs/api-reference/fullscreen-control","h":"#other-properties","p":16},{"i":24,"t":"fullscreen-control.ts","s":"Source","u":"/react-map-gl/docs/api-reference/fullscreen-control","h":"#source","p":16},{"i":26,"t":"React component that wraps the base library's GeolocateControl class (Mapbox | Maplibre). Mapbox Maplibre import * as React from 'react'; import Map, {GeolocateControl} from 'react-map-gl'; function App() { return \" initialViewState={{ longitude: -100, latitude: 40, zoom: 3.5 }} mapStyle=\"mapbox://styles/mapbox/streets-v9\" > ; } import * as React from 'react'; import Map, {GeolocateControl} from 'react-map-gl/maplibre'; function App() { return ; }","s":"GeolocateControl","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"","p":25},{"i":29,"t":"style: CSSProperties​ CSS style override that applies to the control's container.","s":"Reactive Properties","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#reactive-properties","p":25},{"i":31,"t":"onGeolocate: (evt: GeolocateResultEvent) => void​ Called on each Geolocation API position update that returned as success. onError: (evt: GeolocateErrorEvent) => void​ Called on each Geolocation API position update that returned as an error. onOutOfMaxBounds: (evt: GeolocateResultEvent) => void​ Called on each Geolocation API position update that returned as success but user position is out of map maxBounds. onTrackUserLocationStart: (evt: GeolocateEvent) => void​ Called when the GeolocateControl changes to the active lock state. onTrackUserLocationEnd: (evt: GeolocateEvent) => void​ Called when the GeolocateControl changes to the background state.","s":"Callbacks","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#callbacks","p":25},{"i":33,"t":"The properties in this section are not reactive. They are only used when the component first mounts. Any options supported by the GeolocateControl class (Mapbox | Maplibre), such as positionOptions fitBoundsOptions trackUserLocation showAccuracyCircle showUserLocation Plus the following: position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'​ Default: 'bottom-right' Placement of the control relative to the map.","s":"Other Properties","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#other-properties","p":25},{"i":35,"t":"The underlying native GeolocateControl instance is accessible via a React ref hook. You may use it to call any imperative methods: Mapbox Maplibre import * as React from 'react'; import {useRef, useEffect} from 'react'; import Map, {GeolocateControl} from 'react-map-gl'; import type mapboxgl from 'mapbox-gl'; function App() { const geoControlRef = useRef(); useEffect(() => { // Activate as soon as the control is loaded geoControlRef.current?.trigger(); }, [geoControlRef.current]); return ; } import * as React from 'react'; import {useRef, useEffect} from 'react'; import Map, {GeolocateControl} from 'react-map-gl/maplibre'; import type maplibregl from 'maplibre-gl'; function App() { const geoControlRef = useRef(); useEffect(() => { // Activate as soon as the control is loaded geoControlRef.current?.trigger(); }, [geoControlRef.current]); return ; }","s":"Methods","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#methods","p":25},{"i":37,"t":"geolocate-control.ts","s":"Source","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#source","p":25},{"i":39,"t":"This component allows apps to create a map layer using React. Mapbox Maplibre import * as React from 'react'; import Map, {Layer} from 'react-map-gl'; import type {FillLayer} from 'react-map-gl'; const parkLayer: FillLayer = { id: 'landuse_park', type: 'fill', source: 'mapbox', 'source-layer': 'landuse', filter: ['==', 'class', 'park'], paint: { 'fill-color': '#4E3FC8' } }; function App() { return \" initialViewState={{ longitude: -122.4, latitude: 37.8, zoom: 14 }} mapStyle=\"mapbox://styles/mapbox/streets-v9\" > ; } import * as React from 'react'; import Map, {Layer} from 'react-map-gl/maplibre'; import type {FillLayer} from 'react-map-gl/maplibre'; const parkLayer: FillLayer = { id: 'landuse_park', type: 'fill', source: 'mapbox', 'source-layer': 'landuse', filter: ['==', 'class', 'park'], paint: { 'fill-color': '#4E3FC8' } }; function App() { return ; }","s":"Layer","u":"/react-map-gl/docs/api-reference/layer","h":"","p":38},{"i":41,"t":"The props provided to this component should be conforming to the Mapbox layer specification. When props change shallowly, the component will perform style diffing to update the layer. Avoid defining constant objects/arrays inline may help performance.","s":"Properties","u":"/react-map-gl/docs/api-reference/layer","h":"#properties","p":38},{"i":43,"t":"Once a is mounted, the following props should not change. If you add/remove multiple JSX layers dynamically, make sure you use React's key prop to give each element a stable identity. id: string​ Unique identifier of the layer. If not provided, a default id will be assigned. type: string​ Required. Type of the layer.","s":"Identity Properties","u":"/react-map-gl/docs/api-reference/layer","h":"#identity-properties","p":38},{"i":45,"t":"beforeId: string​ The ID of an existing layer to insert this layer before. If this prop is omitted, the layer will be appended to the end of the layers array. This is useful when using dynamic layers with a map style from a URL. Note that layers are added by the order that they mount. They are NOT reordered later if their relative positions in the JSX tree change. If dynamic reordering is desired, you should manipulate beforeId for consistent behavior. source: string​ source is required by some layer types in the Mapbox style specification. If is used as the child of a Source component, this prop will be overwritten by the id of the parent source.","s":"Options","u":"/react-map-gl/docs/api-reference/layer","h":"#options","p":38},{"i":47,"t":"layer.ts","s":"Source","u":"/react-map-gl/docs/api-reference/layer","h":"#source","p":38},{"i":49,"t":"React component that wraps the base library's Map class (Mapbox | Maplibre). This is also the default export from react-map-gl. Mapbox Maplibre app.tsx import * as React from 'react'; import Map from 'react-map-gl'; function App() { return ( \" initialViewState={{ longitude: -122.4, latitude: 37.8, zoom: 14 }} style={{width: 600, height: 400}} mapStyle=\"mapbox://styles/mapbox/streets-v9\" /> ); } app.tsx import * as React from 'react'; import Map from 'react-map-gl/maplibre'; function App() { return ( ); }","s":"default (Map)","u":"/react-map-gl/docs/api-reference/map","h":"","p":48},{"i":51,"t":"Aside from the props listed below, the Map component supports all parameters of the Map class constructor (Mapbox | Maplibre). Beware that this is not an exhaustive list of all props. Different base map libraries may offer different options and default values. When in doubt, refer to your base map library's documentation.","s":"Properties","u":"/react-map-gl/docs/api-reference/map","h":"#properties","p":48},{"i":53,"t":"id: string​ Map container id. style: CSSProperties​ Default: {position: 'relative', width: '100%', height: '100%'} Map container CSS. cursor: string​ Default: 'auto' The current cursor type.","s":"Layout options","u":"/react-map-gl/docs/api-reference/map","h":"#layout-options","p":48},{"i":55,"t":"fog: Fog​ The fog property of the style. Must conform to the Fog Style Specification. If undefined is provided, removes the fog from the map. light: Light​ Light properties of the style. Must conform to the Light Style Specification. mapStyle: MapboxStyle | string | Immutable​ Default: (empty style) The map's Mapbox style. This must be an a JSON object conforming to the schema described in the Mapbox Style Specification, or a URL to such JSON. projection: string | Projection​ Default: 'mercator' The projection the map should be rendered in. Available projections are Albers ('albers'), Equal Earth ('equalEarth'), Equirectangular/Plate Carrée/WGS84 ('equirectangular'), Lambert ('lambertConformalConic'), Mercator ('mercator'), Natural Earth ('naturalEarth'), and Winkel Tripel ('winkelTripel'). Conic projections such as Albers and Lambert have configurable center and parallels properties that allow developers to define the region in which the projection has minimal distortion; see example. renderWorldCopies: boolean​ Default: true If true, multiple copies of the world will be rendered, when zoomed out. styleDiffing: boolean​ Default: true Enable diffing when mapStyle changes. If false, force a 'full' update, removing the current style and building the given one instead of attempting a diff-based update. terrain: Terrain​ Terrain property of the style. Must conform to the Terrain Style Specification. If undefined is provided, removes terrain from the map.","s":"Styling options","u":"/react-map-gl/docs/api-reference/map","h":"#styling-options","p":48},{"i":57,"t":"initialViewState: object​ The initial view state of the map. If specified, longitude, latitude, zoom etc. in props are ignored when constructing the map. Only specify initialViewState if Map is being used as an uncontrolled component. See state management for examples. bounds: LngLatBoundsLike - The initial bounds of the map. If specified, it overrides the longitude, latitude and zoom options. Default null. fitBoundsOptions - An object to use only when setting the bounds option. Default null. fitBoundsOptions.offset: PointLike fitBoundsOptions.minZoom: number fitBoundsOptions.maxZoom: number fitBoundsOptions.padding: PaddingOptions longitude: number - The initial longitude of the map center. Default 0. latitude: number - The initial latitude of the map center. Default 0. zoom: number - The initial zoom level. Default 0. pitch: number - The initial pitch (tilt) of the map. Default 0. bearing: number - The initial bearing (rotation) of the map. Default 0. longitude: number​ The longitude of the map center. latitude: number​ The latitude of the map center. zoom: number​ The zoom level of the map. pitch: number​ The initial pitch (tilt) of the map, measured in degrees away from the plane of the screen (0-85). bearing: number​ The initial bearing (rotation) of the map, measured in degrees counter-clockwise from north. padding: PaddingOptions​ Default: null The padding in pixels around the viewport. minZoom: number​ Default: 0 The minimum zoom level of the map (0-24). maxZoom: number​ Default: 22 The maximum zoom level of the map (0-24). minPitch: number​ Default: 0 The minimum pitch of the map (0-85). maxPitch: number​ Default: 60 The maximum pitch of the map (0-85). maxBounds: LngLatBoundsLike​ Default: null If set, the map is constrained to the given bounds.","s":"Camera options","u":"/react-map-gl/docs/api-reference/map","h":"#camera-options","p":48},{"i":59,"t":"boxZoom: boolean​ Default: true If true, the \"box zoom\" interaction is enabled. See BoxZoomHandler (Mapbox | Maplibre) doubleClickZoom: boolean​ Default: true If true, the \"double click to zoom\" interaction is enabled. See DoubleClickZoomHandler (Mapbox | Maplibre). dragRotate: boolean​ Default: true If true, the \"drag to rotate\" interaction is enabled. See DragRotateHandler (Mapbox | Maplibre). dragPan: boolean | Object​ Default: true If true, the \"drag to pan\" interaction is enabled. Optionally accpt an object value that is the options to DragPanHandler.enable (Mapbox | Maplibre). keyboard: boolean​ Default: true If true, keyboard shortcuts are enabled. See KeyboardHandler (Mapbox | Maplibre). scrollZoom: boolean | Object​ Default: true If true, the \"scroll to zoom\" interaction is enabled. Optionally accpt an object value that is the options to ScrollZoomHandler.enable (Mapbox | Maplibre) touchPitch: boolean | Object​ Default: true If true, the \"drag to pitch\" interaction is enabled. Optionally accpt an object value that is the options to TouchPitchHandler.enable(Mapbox | Maplibre). touchZoomRotate: boolean | Object​ Default: true If true, the \"pinch to rotate and zoom\" interaction is enabled. Optionally accpt an object value that is the options to TouchZoomRotateHandler.enable (Mapbox | Maplibre). interactiveLayerIds: string[]​ Default: null The id(s) of style layer(s). If specified, pointer event (mousemove, click etc.) listeners will be triggered only if its location is within a visible feature in these layers, and the event will have a features property containing an array of the matching features. If not specified, pointer event listeners will be triggered by a corresponding event happening anywhere on the map, and the event will not have a features property. See the Callbacks section for affected events.","s":"Input handler options","u":"/react-map-gl/docs/api-reference/map","h":"#input-handler-options","p":48},{"i":61,"t":"onResize: (event: MapEvent) => void​ Called when the map has been resized. onLoad: (event: MapEvent) => void​ Called after all necessary resources have been downloaded and the first visually complete rendering of the map has occurred. onRender: (event: MapEvent)) => void​ Called whenever the map is drawn to the screen. onIdle: (event: MapEvent)) => void​ Called after the last frame rendered before the map enters an \"idle\" state: No camera transitions are in progress All currently requested tiles have loaded All fade/transition animations have completed onRemove: (event: MapEvent)) => void​ Called when the map has been removed. onError: (event: ErrorEvent) => void​ Default: evt => console.error(evt.error) Called when an error occurs. onMouseDown: (event: MapLayerMouseEvent) => void​ Called when a pointing device (usually a mouse) is pressed within the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onMouseUp: (event: MapLayerMouseEvent) => void​ Called when a pointing device (usually a mouse) is released within the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onMouseOver: (event: MapLayerMouseEvent) => void​ Called when a pointing device (usually a mouse) is moved within the map. As you move the cursor across a web page containing a map, the event will fire each time it enters the map or any child elements. onMouseEnter: (event: MapLayerMouseEvent) => void​ Called when a pointing device (usually a mouse) enters a visible portion of the layer(s) specified by interactiveLayerIds from outside that layer or outside the map canvas. onMouseMove: (event: MapLayerMouseEvent) => void​ Called when a pointing device (usually a mouse) is moved while the cursor is inside the map. As you move the cursor across the map, the event will fire every time the cursor changes position within the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onMouseLeave: (event: MapLayerMouseEvent) => void​ Called when a pointing device (usually a mouse) leaves a visible portion of the layer(s) specified by interactiveLayerIds or moves from the layer to outside the map canvas. onMouseOut: (event: MapLayerMouseEvent) => void​ Called when a point device (usually a mouse) leaves the map's canvas. onClick: (event: MapLayerMouseEvent) => void​ Called when a pointing device (usually a mouse) is pressed and released at the same point on the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onDblClick: (event: MapLayerMouseEvent) => void​ Called when a pointing device (usually a mouse) is pressed and released twice at the same point on the map in rapid succession. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onContextMenu: (event: MapLayerMouseEvent) => void​ Called when the right button of the mouse is clicked or the context menu key is pressed within the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onWheel: (event: MapWheelEvent) => void​ Called when a wheel event occurs within the map. onTouchStart: (event: MapLayerTouchEvent) => void​ Called when a touchstart event occurs within the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onTouchEnd: (event: MapLayerTouchEvent) => void​ Called when a touchend event occurs within the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onTouchMove: (event: MapLayerTouchEvent) => void​ Called when a touchmove event occurs within the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onTouchCancel: (event: MapLayerTouchEvent) => void​ Called when a touchcancel event occurs within the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onMoveStart: (event: ViewStateChangeEvent) => void​ Called just before the map begins a transition from one view to another. onMove: (event: ViewStateChangeEvent) => void​ Called repeatedly during an animated transition from one view to another. When Map is used as a controlled component, event.viewState reflects the view state that the camera \"proposes\" to move to, as a result of either user interaction or methods such as flyTo. The camera does not actually change until the application updates the view state props (longitude, latitude, zoom etc.). See state management for examples. onMoveEnd: (event: ViewStateChangeEvent) => void​ Called just after the map completes a transition from one view to another. onDragStart: (event: ViewStateChangeEvent) => void​ Called when a \"drag to pan\" interaction starts. onDrag: (event: ViewStateChangeEvent) => void​ Called repeatedly during a \"drag to pan\" interaction. onDragEnd: (event: ViewStateChangeEvent) => void​ Called when a \"drag to pan\" interaction ends. onZoomStart: (event: ViewStateChangeEvent) => void​ Called just before the map begins a transition from one zoom level to another. onZoom: (event: ViewStateChangeEvent) => void​ Called repeatedly during an animated transition from one zoom level to another. When Map is used as a controlled component, event.viewState.zoom reflects the zoom that the camera \"proposes\" to change to, as a result of either user interaction or methods such as flyTo. The camera does not actually change until the application updates the zoom prop. onZoomEnd: (event: ViewStateChangeEvent) => void​ Called just after the map completes a transition from one zoom level to another. onRotateStart: (event: ViewStateChangeEvent) => void​ Called just before the map begins a transition from one bearing (rotation) to another. onRotate: (event: ViewStateChangeEvent) => void​ Called repeatedly during an animated transition from one bearing (rotation) to another. When Map is used as a controlled component, event.viewState.bearing reflects the zoom that the camera \"proposes\" to change to, as a result of either user interaction or methods such as flyTo. The camera does not actually change until the application updates the bearing prop. onRotateEnd: (event: ViewStateChangeEvent) => void​ Called just after the map completes a transition from one bearing (rotation) to another. onPitchStart: (event: ViewStateChangeEvent) => void​ Called just before the map begins a transition from one pitch (tilt) to another. onPitch: (event: ViewStateChangeEvent) => void​ Called repeatedly during an animated transition from one pitch (tilt) to another. When Map is used as a controlled component, event.viewState.pitch reflects the zoom that the camera \"proposes\" to change to, as a result of either user interaction or methods such as flyTo. The camera does not actually change until the application updates the pitch prop. onPitchEnd: (event: ViewStateChangeEvent) => void​ Called just after the map completes a transition from one pitch (tilt) to another. onBoxZoomStart: (event: MapBoxZoomEvent) => void​ Called when a \"box zoom\" interaction starts. onBoxZoomEnd: (event: MapBoxZoomEvent) => void​ Called when a \"box zoom\" interaction ends. onBoxZoomCancel: (event:MapBoxZoomEvent) => void​ Called when the user cancels a \"box zoom\" interaction, or when the bounding box does not meet the minimum size threshold. onData: (event: MapStyleDataEvent | MapSourceDataEvent) => void​ Called when any map data loads or changes. See MapDataEvent for more information. onStyleData: (event: MapStyleDataEvent) => void​ Called when the map's style loads or changes. See MapDataEvent for more information. onSourceData: (event: MapSourceDataEvent) => void​ Called when one of the map's sources loads or changes, including if a tile belonging to a source loads or changes. See MapDataEvent for more information.","s":"Callbacks","u":"/react-map-gl/docs/api-reference/map","h":"#callbacks","p":48},{"i":63,"t":"The following props, along with any options of the Map class (Mapbox | Maplibre) not listed above, can be specified to construct the underlying Map instance. Note: props in this section are not reactive. They are only used once when the Map instance is constructed. mapLib: any​ Default: import('mapbox-gl') if imported from react-map-gl import('maplibre-gl') if imported from react-map-gl/maplibre Specify the underlying base map library for the Map component. The value can be provided with several options: By module import (and embedding in the final bundle): import * as React from 'react'; import Map from 'react-map-gl'; import mapboxgl from 'mapbox-gl'; function App() { return ; } By dynamic import (thus enable bundle splitting): import * as React from 'react'; import Map from 'react-map-gl'; function App() { return ; } Or to load a pre-bundled version of the library: index.html app.tsx import * as React from 'react'; import Map from 'react-map-gl'; function App() { return ; } mapboxAccessToken: string​ Token used to access the Mapbox data service. See about map tokens. baseApiUrl: string​ The map's default API URL for requesting tiles, styles, sprites, and glyphs. maxParallelImageRequests: number​ Default: 16 The maximum number of images (raster tiles, sprites, icons) to load in parallel. reuseMaps: boolean​ Default: false By default, every time a map component is unmounted, all internal resources associated with the underlying Map instance are released. If the map gets mounted again, a new Map instance is constructed. If reuseMaps is set to true, when a map component is unmounted, the underlying Map instance is retained in memory. The next time a map component gets mounted, the saved instance is reused. This behavior may be desirable if an application frequently mounts/unmounts map(s), for example in a tabbed or collapsable UI, and wants to avoid Mapbox's billable events triggered by initialization. Note that since some map options cannot be modified after initialization, when reusing maps, only the reactive props and initialViewState of the new component are respected. RTLTextPlugin: string​ Default: 'https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js' Sets the map's RTL text plugin. Necessary for supporting the Arabic and Hebrew languages, which are written right-to-left. Setting this prop is the equivelant of calling mapboxgl.setRTLTextPlugin with lazy: true. workerClass: object​ Default: null Provides an interface for external module bundlers such as Webpack or Rollup to package mapbox-gl's WebWorker into a separate class and integrate it with the library. Takes precedence over workerUrl. workerCount: number​ Default: 2 The number of web workers instantiated on a page with mapbox-gl maps. workerUrl: string​ Provides an interface for loading mapbox-gl's WebWorker bundle from a self-hosted URL. This is useful if your site needs to operate in a strict CSP (Content Security Policy) environment wherein you are not allowed to load JavaScript code from a Blob URL, which is default behavior.","s":"Other options","u":"/react-map-gl/docs/api-reference/map","h":"#other-options","p":48},{"i":65,"t":"Imperative methods are accessible via a React ref or the useMap hook. Mapbox Maplibre import * as React from 'react'; import {useRef, useCallback} from 'react'; import Map from 'react-map-gl'; import type {MapRef} from 'react-map-gl'; function App() { const mapRef = useRef(); const onMapLoad = useCallback(() => { mapRef.current.on('move', () => { // do something }); }, []); return ; } import * as React from 'react'; import {useRef, useCallback} from 'react'; import Map from 'react-map-gl/maplibre'; import type {MapRef} from 'react-map-gl/maplibre'; function App() { const mapRef = useRef(); const onMapLoad = useCallback(() => { mapRef.current.on('move', () => { // do something }); }, []); return ; } The MapRef object exposes Map methods (Mapbox | Maplibre) that are safe to call without breaking the React bindings. For example, setStyle() is hidden from the ref object, because the style is supposed to be changed by updating the mapStyle prop. Calling the method directly may cause the the React prop to mismatch with the underlying state, and lead to unexpected behaviors. You can still access the hidden members via getMap(): getMap()​ Returns the native Map (Mapbox | Maplibre) instance associated with this component.","s":"Methods","u":"/react-map-gl/docs/api-reference/map","h":"#methods","p":48},{"i":67,"t":"map.tsx","s":"Source","u":"/react-map-gl/docs/api-reference/map","h":"#source","p":48},{"i":69,"t":"A Context.Provider that facilitates map operations outside of the component that directly renders a Map. The component should wrap all nodes in which you may want to access the maps: import {MapProvider} from 'react-map-gl'; function Root() { return ( { // Application tree, somewhere one or more component(s) are rendered } ); } See useMap for more information.","s":"MapProvider","u":"/react-map-gl/docs/api-reference/map-provider","h":"","p":68},{"i":71,"t":"use-map.tsx","s":"Source","u":"/react-map-gl/docs/api-reference/map-provider","h":"#source","p":68},{"i":73,"t":"React component that wraps the base library's Marker class (Mapbox | Maplibre). Mapbox Maplibre import * as React from 'react'; import Map, {Marker} from 'react-map-gl'; function App() { return \" initialViewState={{ longitude: -100, latitude: 40, zoom: 3.5 }} mapStyle=\"mapbox://styles/mapbox/streets-v9\" > ; } import * as React from 'react'; import Map, {Marker} from 'react-map-gl/maplibre'; function App() { return ; } If Marker is mounted with child components, then its content will be rendered to the specified location. If it is mounted with no content, then a default marker will be used.","s":"Marker","u":"/react-map-gl/docs/api-reference/marker","h":"","p":72},{"i":76,"t":"draggable: boolean​ Default: false If true, the marker is able to be dragged to a new position on the map. latitude: number​ Required. The latitude of the anchor location. longitude: number​ Required. The longitude of the anchor location. offset: PointLike​ Default: null The offset in pixels as a PointLike object to apply relative to the element's center. Negatives indicate left and up. pitchAlignment: 'map' | 'viewport' | 'auto'​ Default: 'auto' map aligns the Marker to the plane of the map. viewport aligns the Marker to the plane of the viewport. auto automatically matches the value of rotationAlignment. popup: Popup | null​ An instance of the Popup class (Mapbox | Maplibre) to attach to this marker. If undefined or null, any popup set on this Marker instance is unset. rotation: number​ Default: 0 The rotation angle of the marker in degrees, relative to its rotationAlignment setting. A positive value will rotate the marker clockwise. rotationAlignment: 'map' | 'viewport' | 'auto'​ Default: 'auto' map aligns the Marker's rotation relative to the map, maintaining a bearing as the map rotates. viewport aligns the Marker's rotation relative to the viewport, agnostic to map rotations. auto is equivalent to viewport. style: CSSProperties​ CSS style override that applies to the marker's container.","s":"Reactive Properties","u":"/react-map-gl/docs/api-reference/marker","h":"#reactive-properties","p":72},{"i":78,"t":"onClick: (evt: MapEvent) => void​ Called when the marker is clicked on. onDragStart: (evt: MarkerDragEvent) => void​ Called when dragging starts, if draggable is true. onDrag: (evt: MarkerDragEvent) => void​ Called while dragging, if draggable is true. onDragEnd: (evt: MarkerDragEvent) => void​ Called when dragging ends, if draggable is true.","s":"Callbacks","u":"/react-map-gl/docs/api-reference/marker","h":"#callbacks","p":72},{"i":80,"t":"The properties in this section are not reactive. They are only used when the component first mounts. Any options supported by the Marker class (Mapbox | Maplibre), such as anchor color scale clickTolerance","s":"Other Properties","u":"/react-map-gl/docs/api-reference/marker","h":"#other-properties","p":72},{"i":82,"t":"The underlying native Marker instance is accessible via a React ref hook. You may use it to call any imperative methods: Mapbox Maplibre import * as React from 'react'; import {useRef, useMemo, useCallback} from 'react'; import Map, {Marker} from 'react-map-gl'; import mapboxgl from 'mapbox-gl'; function App() { const markerRef = useRef(); const popup = useMemo(() => { return mapboxgl.Popup().setText('Hello world!'); }, []) const togglePopup = useCallback(() => { markerRef.current?.togglePopup(); }, []); return <> ; } import * as React from 'react'; import {useRef, useMemo, useCallback} from 'react'; import Map, {Marker} from 'react-map-gl/maplibre'; import maplibregl from 'maplibre-gl'; function App() { const markerRef = useRef(); const popup = useMemo(() => { return maplibregl.Popup().setText('Hello world!'); }, []) const togglePopup = useCallback(() => { markerRef.current?.togglePopup(); }, []); return <> ; }","s":"Methods","u":"/react-map-gl/docs/api-reference/marker","h":"#methods","p":72},{"i":84,"t":"marker.ts","s":"Source","u":"/react-map-gl/docs/api-reference/marker","h":"#source","p":72},{"i":86,"t":"React component that wraps the base library's NavigationControl class (Mapbox | Maplibre). Mapbox Maplibre import * as React from 'react'; import Map, {NavigationControl} from 'react-map-gl'; function App() { return \" initialViewState={{ longitude: -100, latitude: 40, zoom: 3.5 }} mapStyle=\"mapbox://styles/mapbox/streets-v9\" > ; } import * as React from 'react'; import Map, {NavigationControl} from 'react-map-gl/maplibre'; function App() { return ; }","s":"NavigationControl","u":"/react-map-gl/docs/api-reference/navigation-control","h":"","p":85},{"i":89,"t":"style: CSSProperties​ CSS style override that applies to the control's container.","s":"Reactive Properties","u":"/react-map-gl/docs/api-reference/navigation-control","h":"#reactive-properties","p":85},{"i":91,"t":"The properties in this section are not reactive. They are only used when the component first mounts. Any options supported by the NavigationControl class (Mapbox | Maplibre), such as showCompass showZoom visualizePitch Plus the following: position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'​ Default: 'top-right' Placement of the control relative to the map.","s":"Other Properties","u":"/react-map-gl/docs/api-reference/navigation-control","h":"#other-properties","p":85},{"i":93,"t":"navigation-control.ts","s":"Source","u":"/react-map-gl/docs/api-reference/navigation-control","h":"#source","p":85},{"i":95,"t":"React component that wraps the base library's Popup class (Mapbox | Maplibre). Mapbox Maplibre import * as React from 'react'; import {useState} from 'react'; import Map, {Popup} from 'react-map-gl'; function App() { const [showPopup, setShowPopup] = useState(true); return \" initialViewState={{ longitude: -100, latitude: 40, zoom: 3.5 }} mapStyle=\"mapbox://styles/mapbox/streets-v9\" > {showPopup && ( setShowPopup(false)}> You are here )} ; } import * as React from 'react'; import {useState} from 'react'; import Map, {Popup} from 'react-map-gl/maplibre'; function App() { const [showPopup, setShowPopup] = useState(true); return {showPopup && ( setShowPopup(false)}> You are here )} ; }","s":"Popup","u":"/react-map-gl/docs/api-reference/popup","h":"","p":94},{"i":98,"t":"anchor: 'center' | 'left' | 'right' | 'top' | 'bottom' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | undefined​ A string indicating the part of the popup that should be positioned closest to the coordinate, set via longitude and latitude. If unset, the anchor will be dynamically set to ensure the popup falls within the map container with a preference for 'bottom'. className: string​ Space-separated CSS class names to add to popup container. offset: number | PointLike | Record\\​ Default: null A pixel offset applied to the popup's location specified as: a single number specifying a distance from the popup's location a PointLike specifying a constant offset an object of Points specifing an offset for each anchor position. Negative offsets indicate left and up. maxWidth: string​ Default: 240px A string that sets the CSS property of the popup's maximum width. style: CSSProperties​ CSS style override that applies to the popup's container.","s":"Reactive Properties","u":"/react-map-gl/docs/api-reference/popup","h":"#reactive-properties","p":94},{"i":100,"t":"onOpen: (evt: PopupEvent) => void​ Called when the popup is opened. onClose: (evt: PopupEvent) => void​ Called when the popup is closed by the user clicking on the close button or outside (if closeOnClick: true).","s":"Callbacks","u":"/react-map-gl/docs/api-reference/popup","h":"#callbacks","p":94},{"i":102,"t":"The properties in this section are not reactive. They are only used when the component first mounts. Any options supported by the Popup class (Mapbox | Maplibre), such as closeButton closeOnClick closeOnMove focusAfterOpen","s":"Other Properties","u":"/react-map-gl/docs/api-reference/popup","h":"#other-properties","p":94},{"i":104,"t":"The underlying native Popup instance is accessible via a React ref hook. You may use it to call any imperative methods: Mapbox Maplibre import * as React from 'react'; import {useRef, useEffect} from 'react'; import Map, {Popup} from 'react-map-gl'; import mapboxgl from 'mapbox-gl'; function App() { const popupRef = useRef(); useEffect(() => { popupRef.current?.trackPointer(); }, [popupRef.current]) return Tooltip ; } import * as React from 'react'; import {useRef, useEffect} from 'react'; import Map, {Popup} from 'react-map-gl/maplibre'; import maplibregl from 'maplibre-gl'; function App() { const popupRef = useRef(); useEffect(() => { popupRef.current?.trackPointer(); }, [popupRef.current]) return Tooltip ; }","s":"Methods","u":"/react-map-gl/docs/api-reference/popup","h":"#methods","p":94},{"i":106,"t":"popup.ts","s":"Source","u":"/react-map-gl/docs/api-reference/popup","h":"#source","p":94},{"i":108,"t":"React component that wraps the base library's ScaleControl class (Mapbox | Maplibre). Mapbox Maplibre import * as React from 'react'; import Map, {ScaleControl} from 'react-map-gl'; function App() { return \" initialViewState={{ longitude: -100, latitude: 40, zoom: 3.5 }} mapStyle=\"mapbox://styles/mapbox/streets-v9\" > ; } import * as React from 'react'; import Map, {ScaleControl} from 'react-map-gl/maplibre'; function App() { return ; }","s":"ScaleControl","u":"/react-map-gl/docs/api-reference/scale-control","h":"","p":107},{"i":111,"t":"maxWidth: string​ Default: 100 The maximum length of the scale control in pixels. style: CSSProperties​ CSS style override that applies to the control's container. unit: 'imperial' | 'metric' | 'nautical'​ Default: 'metric' Unit of the distance.","s":"Reactive Properties","u":"/react-map-gl/docs/api-reference/scale-control","h":"#reactive-properties","p":107},{"i":113,"t":"The properties in this section are not reactive. They are only used when the component first mounts. position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'​ Default: 'top-right' Placement of the control relative to the map.","s":"Other Properties","u":"/react-map-gl/docs/api-reference/scale-control","h":"#other-properties","p":107},{"i":115,"t":"scale-control.ts","s":"Source","u":"/react-map-gl/docs/api-reference/scale-control","h":"#source","p":107},{"i":117,"t":"This component allows apps to create a map source using React. It may contain Layer components as children. Mapbox Maplibre import * as React from 'react'; import Map, {Source, Layer} from 'react-map-gl'; import type {CircleLayer} from 'react-map-gl'; import type {FeatureCollection} from 'geojson'; const geojson: FeatureCollection = { type: 'FeatureCollection', features: [ {type: 'Feature', geometry: {type: 'Point', coordinates: [-122.4, 37.8]}} ] }; const layerStyle: CircleLayer = { id: 'point', type: 'circle', paint: { 'circle-radius': 10, 'circle-color': '#007cbf' } }; function App() { return ; } import * as React from 'react'; import Map, {Source, Layer} from 'react-map-gl/maplibre'; import type {CircleLayer} from 'react-map-gl/maplibre'; import type {FeatureCollection} from 'geojson'; const geojson: FeatureCollection = { type: 'FeatureCollection', features: [ {type: 'Feature', geometry: {type: 'Point', coordinates: [-122.4, 37.8]}} ] }; const layerStyle: CircleLayer = { id: 'point', type: 'circle', paint: { 'circle-radius': 10, 'circle-color': '#007cbf' } }; function App() { return ; }","s":"Source","u":"/react-map-gl/docs/api-reference/source","h":"","p":116},{"i":119,"t":"The props provided to this component should be conforming to the Mapbox source specification or CanvasSourceOptions. When props change shallowly, the component will attempt to update the source. Do not define objects/arrays inline to avoid perf hit. Once a is mounted, the following props should not change. If add/remove multiple JSX sources dynamically, make sure you use React's key prop to give each element a stable identity. id: string​ Unique identifier of the source. If not provided, a default id will be assigned. type: string​ Required. Type of the source.","s":"Properties","u":"/react-map-gl/docs/api-reference/source","h":"#properties","p":116},{"i":120,"t":"source.ts","s":"Source","u":"/react-map-gl/docs/api-reference/source","h":"#source-1","p":116},{"i":122,"t":"The following types can be imported from react-map-gl when using TypeScript.","s":"Types","u":"/react-map-gl/docs/api-reference/types","h":"","p":121},{"i":124,"t":"IControl​ A custom control implementation. CustomLayerInterface​ A custom layer implementation. MapRef​ Instance ref of a Map component. See Map documentation for details.","s":"Components","u":"/react-map-gl/docs/api-reference/types","h":"#components","p":121},{"i":126,"t":"MapStyle​ An object conforming to the Mapbox Style Specification. Fog​ An object conforming to the Fog Style Specification. Light​ An object conforming to the Light Style Specification. Terrain​ An object conforming to the Terrain Style Specification. Projection​ An object conforming to the Projection Style Specification. BackgroundLayer​ A JSON object that defines a background layer according to the Mapbox Style Specification. CircleLayer​ A JSON object that defines a circle layer according to the Mapbox Style Specification. FillExtrusionLayer​ A JSON object that defines a fill-extrusion layer according to the Mapbox Style Specification. FillLayer​ A JSON object that defines a fill layer according to the Mapbox Style Specification. HeatmapLayer​ A JSON object that defines a heatmap layer according to the Mapbox Style Specification. HillshadeLayer​ A JSON object that defines a hillshade layer according to the Mapbox Style Specification. LineLayer​ A JSON object that defines a line layer according to the Mapbox Style Specification. RasterLayer​ A JSON object that defines a raster layer according to the Mapbox Style Specification. SymbolLayer​ A JSON object that defines a symbol layer according to the Mapbox Style Specification. SkyLayer​ A JSON object that defines a sky layer according to the Mapbox Style Specification. GeoJSONSourceRaw​ A JSON object that defines a geojson source according to the Mapbox Style Specification. VideoSourceRaw​ A JSON object that defines a video source according to the Mapbox Style Specification. ImageSourceRaw​ A JSON object that defines a image source according to the Mapbox Style Specification. VectorSourceRaw​ A JSON object that defines a vector source according to the Mapbox Style Specification. RasterSource​ A JSON object that defines a raster source according to the Mapbox Style Specification. RasterDemSource​ A JSON object that defines a raster-dem source according to the Mapbox Style Specification. CanvasSourceRaw​ A JSON object that defines a canvas source type. See CanvasSourceOptions.","s":"Styling","u":"/react-map-gl/docs/api-reference/types","h":"#styling","p":121},{"i":128,"t":"ControlPosition​ One of 'top-right', 'top-left', 'bottom-right' and 'bottom-left'. PaddingOptions​ An object with the following fields: left: number - in pixels. top: number - in pixels. right: number - in pixels. bottom: number - in pixels.","s":"Configurations","u":"/react-map-gl/docs/api-reference/types","h":"#configurations","p":121},{"i":130,"t":"LngLat​ A mapboxgl.LngLat object. LngLatLike​ A LngLat object, an array of two numbers representing longitude and latitude, or an object with lng and lat or lon and lat properties. LngLatBounds​ A mapboxgl.LngLatBounds object. LngLatBoundsLike​ A LngLatBounds object, an array of LngLatLike objects in [sw, ne] order, or an array of numbers in [west, south, east, north] order. Point​ A mapboxgl.Point object. PointLike​ A Point or an array of two numbers representing x and y screen coordinates in pixels. MapGeoJSONFeature​ A GeoJSON feature that also contains the following library-specific fields: layer: Layer source: string sourceLayer: string state: { [key: string]: any } ViewState​ An object with the following fields: longitude: number - The longitude of the map center. latitude: number - The latitude of the map center. zoom: number - The zoom level. pitch: number - The pitch (tilt) of the map, in degrees. bearing: number - The bearing (rotation) of the map, in degrees.","s":"Data Types","u":"/react-map-gl/docs/api-reference/types","h":"#data-types","p":121},{"i":132,"t":"The following are implementations of source types that could be retrieved with Map.getSource (Mapbox | Maplibre). GeoJSONSource​ A source containing GeoJSON. See GeoJSONSource (Mapbox | Maplibre). VideoSource​ A source containing video. See VideoSource (Mapbox | Maplibre). ImageSource​ A source containing image. See ImageSource (Mapbox | Maplibre). CanvasSource​ A source containing the contents of an HTML canvas. See CanvasSource(Mapbox | Maplibre). VectorTileSource​ A source containing vector tiles in Mapbox Vector Tile format. See VectorTileSource (Mapbox | Maplibre).","s":"Sources","u":"/react-map-gl/docs/api-reference/types","h":"#sources","p":121},{"i":134,"t":"MapEvent​ An object with the following fields: type: string - Event type target: Map (Mapbox | Maplibre) originalEvent?: Event MapLayerMouseEvent​ An object with the following fields: type: string target: Map (Mapbox | Maplibre) originalEvent?: MouseEvent point: Point lngLat: LngLat preventDefault: () => void defaultPrevented: boolean features?: MapGeoJSONFeature[] MapWheelEvent​ An object with the following fields: type: string target: Map (Mapbox | Maplibre) originalEvent?: WheelEvent preventDefault: () => void defaultPrevented: boolean MapLayerTouchEvent​ An object with the following fields: type: string target: Map (Mapbox | Maplibre) originalEvent?: TouchEvent point: Point lngLat: LngLat points: Point[] lngLats: LngLat[] preventDefault: () => void defaultPrevented: boolean features?: MapGeoJSONFeature[] ViewStateChangeEvent​ An object with the following fields: type: string - Event type target: Map (Mapbox | Maplibre) viewState: ViewState - the next view state that the camera wants to change to based on user input or transition. MapBoxZoomEvent​ An object with the following fields: type: string target: Map (Mapbox | Maplibre) originalEvent?: MouseEvent boxZoomBounds: LngLatBounds MapStyleDataEvent​ An object with the following fields: type: string target: Map (Mapbox | Maplibre) dataType: 'style' MapSourceDataEvent​ An object with the following fields: type: string target: Map (Mapbox | Maplibre) dataType: 'source' isSourceLoaded: boolean source: string sourceId: string sourceDataType: 'metadata' | 'content' tile: any coord: Coordinate See MapDataEvent. ErrorEvent​ An object with the following fields: type: 'error' target: Map (Mapbox | Maplibre) error: Error GeolocateEvent​ An object with the following fields: type: string target: Map (Mapbox | Maplibre) target: GeolocateControl (Mapbox | Maplibre) GeolocateResultEvent​ An object with the following fields: type: string target: GeolocateControl (Mapbox | Maplibre) coords: GeolocationCoordinates - the current location. timestamp: number - the time at which the location was retrieved. GeolocateErrorEvent​ An object with the following fields: type: string target: GeolocateControl (Mapbox | Maplibre) code: PERMISSION_DENIED | POSITION_UNAVAILABLE | TIMEOUT - see GeolocationPositionError message: string - the details of the error. Specifications note that this is primarily intended for debugging use and not to be shown directly in a user interface. MarkerEvent​ An object with the following fields: type: string target: Marker (Mapbox | Maplibre) MarkerDragEvent​ An object with the following fields: type: string target: Marker (Mapbox | Maplibre) lngLat: LngLat - the new location of the marker PopupEvent​ An object with the following fields: type: string target: Popup (Mapbox | Maplibre)","s":"Events","u":"/react-map-gl/docs/api-reference/types","h":"#events","p":121},{"i":136,"t":"The useControl hook is used to create React wrappers for custom map controls. import MapboxDraw from '@mapbox/mapbox-gl-draw'; import Map, {useControl} from 'react-map-gl'; function DrawControl(props: DrawControlProps) { useControl(() => new MapboxDraw(props), { position: props.position }); return null; } function App() { return ( ); } See a full example here.","s":"useControl","u":"/react-map-gl/docs/api-reference/use-control","h":"","p":135},{"i":138,"t":"useControl( onCreate: ({map: MapRef, mapLib: mapboxgl}) => IControl, options?: { position?: ControlPosition; } ): T useControl( onCreate: ({map: MapRef, mapLib: mapboxgl}) => IControl, onRemove: ({map: MapRef, mapLib: mapboxgl}) => void, options?: { position?: ControlPosition; } ): T useControl( onCreate: ({map: MapRef, mapLib: mapboxgl}) => IControl, onAdd: ({map: MapRef, mapLib: mapboxgl}) => void, onRemove: ({map: MapRef, mapLib: mapboxgl}) => void, options?: { position?: ControlPosition; } ): T The hook creates an IControl instance, adds it to the map when it's available, and removes it upon unmount. Parameters: onCreate: ({map: MapRef, mapLib: mapboxgl}) => IControl - called to create an instance of the control. onAdd: ({map: MapRef, mapLib: mapboxgl}) => void - called when the control has been added to the map. onRemove: ({map: MapRef, mapLib: mapboxgl}) => void - called when the control is about to be removed from the map. options: object position: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' - control position relative to the map Returns: IControl - the control instance from onCreate.","s":"Signature","u":"/react-map-gl/docs/api-reference/use-control","h":"#signature","p":135},{"i":140,"t":"use-control.ts","s":"Source","u":"/react-map-gl/docs/api-reference/use-control","h":"#source","p":135},{"i":142,"t":"The useMap hook allows a custom component to reference the Map that contains it. Mapbox Maplibre import {Map, useMap} from 'react-map-gl'; function Root() { return ( ); } function NavigateButton() { const {current: map} = useMap(); const onClick = () => { map.flyTo({center: [-122.4, 37.8]}); }; return ; } import {Map, useMap} from 'react-map-gl/maplibre'; function Root() { return ( ); } function NavigateButton() { const {current: map} = useMap(); const onClick = () => { map.flyTo({center: [-122.4, 37.8]}); }; return ; } When used with the MapProvider, this hook can also reference maps that are rendered outside of the current component's direct render tree. Mapbox Maplibre import {MapProvider, Map, useMap} from 'react-map-gl'; function Root() { return ( ); } function NavigateButton() { const {myMapA, myMapB} = useMap(); const onClick = () => { myMapA.flyTo({center: [-122.4, 37.8]}); myMapB.flyTo({center: [-74, 40.7]}); }; return ; } import {MapProvider, Map, useMap} from 'react-map-gl/maplibre'; function Root() { return ( ); } function NavigateButton() { const {myMapA, myMapB} = useMap(); const onClick = () => { myMapA.flyTo({center: [-122.4, 37.8]}); myMapB.flyTo({center: [-74, 40.7]}); }; return ; } See a full example here.","s":"useMap","u":"/react-map-gl/docs/api-reference/use-map","h":"","p":141},{"i":144,"t":"useMap(): {current?: MapRef, [id: string]: MapRef} The hook returns an object that contains all mounted maps under the closest MapProvider. The keys are each map's id and the values are the MapRef. If the hook is used inside a decendent of a Map component, the returned object also contains a current field that references the containing map.","s":"Signature","u":"/react-map-gl/docs/api-reference/use-map","h":"#signature","p":141},{"i":146,"t":"use-map.tsx","s":"Source","u":"/react-map-gl/docs/api-reference/use-map","h":"#source","p":141},{"i":148,"t":"Thanks for taking the time to contribute! PRs and bug reports are welcome, and we are actively looking for new maintainers.","s":"Contributing","u":"/react-map-gl/docs/contributing","h":"","p":147},{"i":150,"t":"The master branch is the active development branch. Building react-map-gl locally from the source requires node.js >=8. We use yarn to manage the dependencies. git checkout master yarn bootstrap yarn test Test: $ yarn test Test in Node: $ yarn test node Test in browser (can use Chrome dev tools for debugging): $ yarn test browser","s":"Setting Up Dev Environment","u":"/react-map-gl/docs/contributing","h":"#setting-up-dev-environment","p":147},{"i":152,"t":"Any intended change to the code base must open a pull request and be approved. Generally speaking, all PRs are open against the master branch, unless the feature being affected no longer exists on master.","s":"Pull Requests","u":"/react-map-gl/docs/contributing","h":"#pull-requests","p":147},{"i":154,"t":"Tests yarn test must be successful. New code should be covered by unit tests whenever possible. Documentation If public APIs are added/modified, update component documentation in docs/api-reference. Breaking changes and deprecations must be added to docs/upgrade-guide.md. Noteworthy new features should be added to docs/whats-new.md. Description on GitHub Link to relevant issue. Label with a milestone (latest release or vNext). If public APIs are added/modified, describe the intended behavior. If visual/interaction is affected, consider attaching a screenshot/GIF.","s":"PR Checklist","u":"/react-map-gl/docs/contributing","h":"#pr-checklist","p":147},{"i":156,"t":"react-map-gl follows the Semantic Versioning guidelines. Steps for publishing releases can be found here.","s":"Release","u":"/react-map-gl/docs/contributing","h":"#release","p":147},{"i":158,"t":"vis.gl is part of the Urban Computing Foundation. See the organization's Technical Charter.","s":"Community Governance","u":"/react-map-gl/docs/contributing","h":"#community-governance","p":147},{"i":160,"t":"react-map-gl development is governed by the vis.gl Technical Steering Committee (TSC).","s":"Technical Steering Committee","u":"/react-map-gl/docs/contributing","h":"#technical-steering-committee","p":147},{"i":162,"t":"Xiaoji Chen Xintong Xia Maintainers of react-map-gl have commit access to this GitHub repository, and take part in the decision making process. If you are interested in becoming a maintainer, read the governance guidelines. The vis.gl TSC meets monthly and publishes meeting notes via a mailing list. This mailing list can also be utilized to reach out to the TSC.","s":"Maintainers","u":"/react-map-gl/docs/contributing","h":"#maintainers","p":147},{"i":164,"t":"Please be mindful of and adhere to the Linux Foundation's Code of Conduct when contributing to react-map-gl.","s":"Code of Conduct","u":"/react-map-gl/docs/contributing","h":"#code-of-conduct","p":147},{"i":166,"t":"You may find complete project setups in get-started examples.","s":"Get Started","u":"/react-map-gl/docs/get-started","h":"","p":165},{"i":168,"t":"Using react-map-gl requires node >= 12 and react >= 16.3. Mapbox Maplibre npm install --save react-map-gl mapbox-gl @types/mapbox-gl npm install --save react-map-gl maplibre-gl","s":"Installation","u":"/react-map-gl/docs/get-started","h":"#installation","p":165},{"i":170,"t":"Mapbox Maplibre app.tsx import * as React from 'react'; import Map from 'react-map-gl'; function App() { return ( \" initialViewState={{ longitude: -122.4, latitude: 37.8, zoom: 14 }} style={{width: 600, height: 400}} mapStyle=\"mapbox://styles/mapbox/streets-v9\" /> ); } See about Mapbox tokens for alternatives to providing a Mapbox token. app.tsx import * as React from 'react'; import Map from 'react-map-gl/maplibre'; function App() { return ( ); }","s":"Example","u":"/react-map-gl/docs/get-started","h":"#example","p":165},{"i":172,"t":"The base map library requires its stylesheet be included at all times. The marker, popup and navigation components in react-map-gl also need the stylesheet to work properly. You may add the stylesheet to the head of your page: Mapbox Maplibre index.html Find out your mapbox version by running yarn list mapbox-gl or npm ls mapbox-gl. index.html Find out your maplibre version by running yarn list maplibre-gl or npm ls maplibre-gl. Or embed it in your app by using css-loader with Webpack or postcss with rollup: Mapbox Maplibre app.tsx import 'mapbox-gl/dist/mapbox-gl.css'; app.tsx import 'maplibre-gl/dist/maplibre-gl.css';","s":"Styling","u":"/react-map-gl/docs/get-started","h":"#styling","p":165},{"i":174,"t":"npm install --save react-map-gl my-mapbox-fork Then override the mapLib prop of Map: app.tsx import * as React from 'react'; import Map from 'react-map-gl'; // Include style sheet import 'my-mapbox-fork/path/to/style-sheet.css'; function App() { return ; }","s":"Using with a Compatible Fork","u":"/react-map-gl/docs/get-started","h":"#using-with-a-compatible-fork","p":165},{"i":177,"t":"You can inject data and mapbox native layers using the Source and Layer components: import * as React from 'react'; import Map, {Source, Layer} from 'react-map-gl'; import type {CircleLayer} from 'react-map-gl'; import type {FeatureCollection} from 'geojson'; const geojson: FeatureCollection = { type: 'FeatureCollection', features: [ {type: 'Feature', geometry: {type: 'Point', coordinates: [-122.4, 37.8]}} ] }; const layerStyle: CircleLayer = { id: 'point', type: 'circle', paint: { 'circle-radius': 10, 'circle-color': '#007cbf' } }; function App() { return ( ); } For details about data sources and layer configuration, check out the Mapbox style specification. For dynamically updating data sources and layers, check out the GeoJSON and GeoJSON animation examples.","s":"Native Mapbox Layers","u":"/react-map-gl/docs/get-started/adding-custom-data","h":"#native-mapbox-layers","p":175},{"i":179,"t":"You can implement a custom HTML or SVG overlay on top of the map that redraws whenever the camera changes. By calling map.project() you can adjust the DOM or CSS properties so that the customly-drawn features are always aligned with the map. See a full example here.","s":"Custom Overlays","u":"/react-map-gl/docs/get-started/adding-custom-data","h":"#custom-overlays","p":175},{"i":181,"t":"For more feature rich and performant data visualization overlay use cases, you may consider using other visualization libraries. react-map-gl is part of the vis.gl ecosystem, a suite of high-performance data visualization tools for the Web. deck.gl - WebGL-powered framework for the visualization of large datasets. loaders.gl - loaders for file formats focused on visualization of big data, including point clouds, 3D geometries, images, geospatial formats as well as tabular data. nebula.gl - 3D-enabled GeoJSON editing based on deck.gl and React.","s":"Other vis.gl Libraries","u":"/react-map-gl/docs/get-started/adding-custom-data","h":"#other-visgl-libraries","p":175},{"i":183,"t":"react-map-gl itself is open source and free. It provides a React wrapper for mapbox-gl or derived projects. Depending on which Mapbox GL JS version (or fork) you use, you may need a Mapbox token. You will need a Mapbox token if you use: mapbox-gl@>=2.0.0 and above - 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 - 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 their website. 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. There are several ways to provide a token to your app, as showcased in some of the example folders: Provide a mapboxAccessToken prop to the map component Set the MapboxAccessToken environment variable (or set REACT_APP_MAPBOX_ACCESS_TOKEN if you are using Create React App) Provide it in the URL, e.g ?access_token=TOKEN We recommend using an environment variable to minimize leaking risks. See securing Mapbox token for examples.","s":"About Mapbox Tokens","u":"/react-map-gl/docs/get-started/mapbox-tokens","h":"","p":182},{"i":185,"t":"It is possible to use the map component without the Mapbox service, if you use another tile source (for example, if you host your own map tiles). Note that this is no longer allowed using mapbox-gl v2.0 and above. The options are: Stay on mapbox-gl@1.x. react-map-gl plans to continue supporting this release in the foreseeable future, however, this version will not include any of the latest features of the map renderer, nor get any future updates from Mapbox. Use a community fork of mapbox-gl, for example maplibre-gl. See Get Started for how to configure your project. To use your own map service, you will need a custom Mapbox GL style that points to your own vector tile source, and pass it to Map using the mapStyle prop. This custom style must match the schema of your tile source. Open source tile schemas include: TileZen schema OpenMapTiles schema Some useful resources for creating your own map service: Mapbox Vector Tile Spec Open source tools If you are using a third party service that requires header based authentication, you can do this by defining a function to pass to Map using the transformRequest prop. An example function: const transformRequest = (url, resourceType) => { if (resourceType === 'Tile' && url.match('yourTileSource.com')) { return { url: url, headers: { 'Authorization': 'Bearer ' + yourAuthToken } } } }","s":"Display Maps Without A Mapbox Token","u":"/react-map-gl/docs/get-started/mapbox-tokens","h":"#display-maps-without-a-mapbox-token","p":182},{"i":187,"t":"There are two ways to use a Map: Uncontrolled: The application sets the initial view state (Camera options) when the map is mounted, and the component automatically makes changes to the view states afterwards. This mode works very similarly to the mapbox-gl Map class. Controlled: The application manages the view state, and pass it to the map via props. The map invokes a callback with a new view state during user interaction transition, and the application can decide what to do with it. This mode is the most powerful when an application has other components that need to interact with the map, or implements its own user input and data handling logic.","s":"State Management","u":"/react-map-gl/docs/get-started/state-management","h":"","p":186},{"i":189,"t":"You may clone a full app configuration for this example here. import * as React from 'react'; import Map from 'react-map-gl'; function App() { return ; }","s":"Uncontrolled Map","u":"/react-map-gl/docs/get-started/state-management","h":"#uncontrolled-map","p":186},{"i":191,"t":"You may clone a full app configuration for this example here. import * as React from 'react'; import Map from 'react-map-gl'; function App() { const [viewState, setViewState] = React.useState({ longitude: -100, latitude: 40, zoom: 3.5 }); return setViewState(evt.viewState)} mapStyle=\"mapbox://styles/mapbox/streets-v9\" />; } A real-world application likely uses more complicated state flows: Using map with a state store (Redux) example Using map with SSR (Next.js) example","s":"Controlled Map","u":"/react-map-gl/docs/get-started/state-management","h":"#controlled-map","p":186},{"i":193,"t":"Map offers props that set basic constraints for the camera, e.g. maxBounds, minZoom, maxPitch. If you need more complicated logic to constrain the camera, you may use it as a controlled component. The following example restricts the map center inside a GeoJSON geofence: import * as React from 'react'; import Map from 'react-map-gl'; // npm install @turf/turf import * as turf from '@turf/turf'; // A circle of 5 mile radius of the Empire State Building const GEOFENCE = turf.circle([-74.0122106, 40.7467898], 5, {units: 'miles'}); function App() { const [viewState, setViewState] = React.useState({ longitude: -100, latitude: 40, zoom: 3.5 }); const onMove = React.useCallback(({viewState}) => { const newCenter = [viewState.longitude, viewState.latitude]; // Only update the view state if the center is inside the geofence if (turf.booleanPointInPolygon(newCenter, GEOFENCE)) { setViewState(newCenter); } }, []) return ; }","s":"Custom Camera Constraints","u":"/react-map-gl/docs/get-started/state-management","h":"#custom-camera-constraints","p":186},{"i":196,"t":"Because Mapbox tokens are required for the client application to make requests to Mapbox servers, you have to distribute it with your app. It is not possible to stop a visitor to your site from scraping the token. The practice outlined below can help you protect your token from being abused. Never commit your token in clear text into GitHub or other source control. In your local dev environment, define the token in an environment variable e.g. MapboxAccessTokenDev=... in the command line, or use something like dotenv and put MapboxAccessTokenDev=... in a .env file. Add .env to .gitignore so it's never tracked. If your app is deployed by a continuous integration pipeline, follow its documentation and set a secret environment variable. Create separate tokens for development (often times on http://localhost), public code snippet (Gist, Codepen etc.) and production (deployed to https://mycompany.com). The public token should be rotated regularly. The production token should have strict scope and URL restrictions that only allows it to be used on a domain that you own. Add the following to your bundler config: Webpack Rollup /// webpack.config.js const {DefinePlugin} = require('webpack'); module.exports = { ... plugins: [ new DefinePlugin({ 'process.env.MapboxAccessToken': JSON.stringify(process.env.NODE_ENV == 'production' ? process.env.MapboxAccessTokenProd : process.env.MapboxAccessTokenDev) }) ] }; /// rollup.config.js const replace = require('@rollup/plugin-replace').default; module.exports = { ... plugins: [ replace({ 'process.env.MapboxAccessToken': JSON.stringify(process.env.NODE_ENV == 'production' ? process.env.MapboxAccessTokenProd : process.env.MapboxAccessTokenDev) }) ] }; react-map-gl automatically picks up process.env.MapboxAccessToken or process.env.REACT_APP_MAPBOX_ACCESS_TOKEN if they are defined. Alternatively, you can use your own variable name (e.g. __SUPER_SECRET_TOKEN__) and pass it in manually with mapboxAccessToken={__SUPER_SECRET_TOKEN__}.","s":"Securing Mapbox Token","u":"/react-map-gl/docs/get-started/tips-and-tricks","h":"#securing-mapbox-token","p":194},{"i":198,"t":"In a moderately complex single-page app, as the user navigates through the UI, a map component may unmount and mount again many times during a session. Consider the following layout: /// Example using Tabs from Material UI {items.map(renderMarker)} {items.map(renderRow)}
Every time the user clicks the \"table\" tab, the map is unmounted. When they click the \"map\" tab, the map is mounted again. As of v2.0, mapbox-gl generates a billable event every time a Map object is initialized. It is obviously not ideal to get billed for just collapsing and expanding part of the UI. In this case, it is recommended that you set the reuseMaps prop to true: {items.map(renderMarker)} This bypasses the initialization when a map is removed then added back.","s":"Minimize Cost from Frequent Re-mounting","u":"/react-map-gl/docs/get-started/tips-and-tricks","h":"#minimize-cost-from-frequent-re-mounting","p":194},{"i":200,"t":"If your application uses externally managed camera state, like with Redux, the number of React rerenders may be very high when the user is interacting with the map. Consider the following setup: import {useSelector, useDispatch} from 'react-redux'; import Map, {Marker} from 'react-map-gl'; function MapView() { const viewState = useSelector((s: RootState) => s.viewState); const vehicles = useSelector((s: RootState) => s.vehicles); const dispatch = useDispatch(); const onMove = useCallback(evt => { dispatch({type: 'setViewState', payload: evt.viewState}); }, []); return ( > {vehicles.map(vehicle => ( // vehicle icon ) )} ); } This component is rerendered on every animation frame when the user is dragging the map. If it's trying to render hundreds of markers, the performance lag will become quite visible. One way to improve the performance is useMemo: const markers = useMemo(() => vehicles.map(vehicle => ( // vehicle icon ) ), [vehicles]); return ( > {markers} ); } This prevents React from rerendering the markers unless they have changed. If your application can do without complicated DOM objects and CSS styling, consider switching to a symbol layer. Layers are rendered in WebGL and are much more performant than markers: const vehiclesGeoJSON = useMemo(() => { return { type: 'FeatureCollection', features: vehicles.map(vehicle => turf.point(vehicle.coordinates, vehicle)) }; }, [vehicles]); return ( > );","s":"Performance with Many Markers","u":"/react-map-gl/docs/get-started/tips-and-tricks","h":"#performance-with-many-markers","p":194},{"i":202,"t":"There are some situations where you want to know if a point is currently visible on the map. Checking this is simple and can be done like so: const mapRef = useRef(); const checkIfPositionInViewport = (lat, lng) => { const bounds = mapRef.current.getBounds(); return bounds.contains([lng, lat]); } return ","s":"Finding out if a point is within the current viewport","u":"/react-map-gl/docs/get-started/tips-and-tricks","h":"#finding-out-if-a-point-is-within-the-current-viewport","p":194},{"i":205,"t":"maplibre-gl users no longer need to install mapbox-gl or a placeholder package as dependency. Change your imports to the new endpoint react-map-gl/maplibre. Components imported from here do not require setting the mapLib prop, and use the types defined by maplibre-gl. map-v7.0.tsx import Map from 'react-map-gl'; import maplibregl from 'maplibre-gl'; function App() { return ; } map-v7.1.tsx import Map from 'react-map-gl/maplibre'; // <- mind the updated import function App() { return } If you installed mapbox-gl from a placeholder such as npm:empty-npm-package@^1.0.0 as suggested by the previous version's documentation, it should be removed from your package.json. The @types/mapbox-gl dependency has relaxed its version constraint. If you use mapbox-gl as the base map library, it's recommended to explicitly list @types/mapbox-gl in your package.json with a version matching that of mapbox-gl (v1 or v2). This package is no longer required by the non-mapbox code path, and may be further demoted to an optional peer dependency in a future release. If you use the Map component as a child of the DeckGL component from deck.gl, upgrade deck.gl to >=8.9.18.","s":"Upgrading to v7.1","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v71","p":203},{"i":207,"t":"v7 is a complete rewrite of the library. It is redesigned to be fast, lightweight, fully typed, to behave the same and expose the same APIs as the wrapped map library, and to provide the maximum compatibility with third-party plugins. To take advantages of these new features, you need to make some changes to your code that was previously depending on react-map-gl v5 and v6. If you are using react-map-gl controls (Marker, Popup, NavigationControl etc.) with deck.gl's ContextProvider, do not upgrade to this version. The old approach no longer works with v7. We are moving the support for this use case to a new project that does not depend on mapbox.","s":"Upgrading to v7.0","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v70","p":203},{"i":209,"t":"Add mapbox-gl (or a compatible fork) to your package.json. react-map-gl no longer lists a specific map renderer in its dependencies, so you are free to use it with Mapbox v1, v2 or Maplibre. viewport-mercator-project (an alias of @math.gl/web-mercator) is no longer a dependency. You can still install the library on the side as a utility for viewport-related math, but it's no longer required.","s":"Dependencies","u":"/react-map-gl/docs/upgrade-guide","h":"#dependencies","p":203},{"i":211,"t":"InteractiveMap and StaticMap are removed. Instead, import Map. setRTLTextPlugin is removed. Use the Map component's RTLTextPlugin prop (default enabled). MapController is removed. v7.0 has removed its own implementation of user input handling in favor of the native handlers. If you are using a custom implementation of MapController, check if the native handlers offer options to address your application's needs. MapContext and useMapControl are removed. Check out the new API useMap and useControl. The overlay components (HTMLOverlay, CanvasOverlay and SVGOverlay) are removed. Check out this example for implementing similar controls in your own application. LinearInterpolator and FlyToInterpolator are removed. Use map.easeTo() and map.flyTo() instead, see this example.","s":"Module exports","u":"/react-map-gl/docs/upgrade-guide","h":"#module-exports","p":203},{"i":213,"t":"documentation Renamed props for better consistency with the wrapped library: mapboxApiAccessToken is now mapboxAccessToken mapboxApiUrl is now baseApiUrl preventStyleDiffing (default false) is replaced with styleDiffing (default true) mapStyle should be explicitly specified. The default value has changed from \"mapbox://styles/mapbox/light-v9\" to an empty style. The following props are removed and apps should use style instead: width height visible onViewportChange, onViewStateChange and onInteractionStateChange are removed. You can either use Map as an uncontrolled component with the new initialViewState prop, or if you need to manage the camera state externally (e.g. in Redux), use the onMove callback instead. See examples in state management. transition* props are removed. Use map.easeTo() and map.flyTo() instead, see this example. mapOptions is removed. Almost all of the options for the native Map class are exposed as props. onHover is removed. Use onMouseMove or onMouseEnter. The event argument is changed for all interaction callbacks. See documentation for details. getCursor is removed as part of the effort to get Map behave the same as the native component. To set the cursor, use the cursor prop. Follow this example to change cursor on hover. touchAction and eventRecognizerOptions are removed. Check out the cooperativeGestures prop.","s":"Map","u":"/react-map-gl/docs/upgrade-guide","h":"#map","p":203},{"i":215,"t":"capture* props are removed. *label props are removed. Use Map's locale prop. All map controls' props are now strictly aligned with their mapbox-gl counterparts. In heading this direction, we are able to remove a significant amount of custom code and have the components behave more predictably for developers switching from the native library. If your application is relying on an old feature that is no longer supported, please open a topic on Discussion so we can review on a case-by-case basis.","s":"Other components","u":"/react-map-gl/docs/upgrade-guide","h":"#other-components","p":203},{"i":217,"t":"MapContext is now an official API. The experimental _MapContext export will be removed in a future release. react-virtualized-auto-sizer is no longer a dependency. Inertia has been enabled by default on the map controller. To revert to the behavior in previous versions, set the interaction options: const CONTROLLER_OPTS = { dragPan: {inertia: 0}, dragRotate: {inertia: 0}, touchZoom: {inertia: 0} }; Source and Layer components no longer expose imperative methods via ref as part of the migration to functional components. This is to comply with the pattern recommended by the latest React. If you used to call sourceRef.getSource(), it can be replaced with mapRef().getMap().getSource(sourceId). If you used to call layerRef.getLayer(), it can be replaced with mapRef().getMap().getLayer(layerId).","s":"Upgrading to v5.3/v6.1","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v53v61","p":203},{"i":219,"t":"A valid Mapbox access token is always required. The default value of InteractiveMap's maxPitch prop is changed to 85 from 60. mapbox-gl v2 introduced a breaking change to the build system. Transpiling it may result in a crash in the production build with the message m is not defined. Find solutions in this thread.","s":"Upgrading to v6","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v6","p":203},{"i":221,"t":"onChangeViewport is removed, use onViewportChange instead Immutable.js is no longer a dependency Export experimental.MapControls is removed, use MapController instead InteractiveMap's mapControls prop is renamed to controller Removed support for the deprecated interactive property on the layer styles. Use the interactiveLayerIds prop to specify which layers are clickable.","s":"Upgrading to v4","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v4","p":203},{"i":223,"t":"The latest mapbox-gl release requires stylesheet to be included at all times. See Get Started for information about styling. Immutable.js is no longer a hard dependency and will be removed in the next major release. If you are importing immutable in your application, it is recommended that you explicitly list it in the application's dependencies.","s":"Upgrading to v3.2","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v32","p":203},{"i":225,"t":"v3 is a major upgrade of react-map-gl. While we have tried to gently deprecated any changed or removed features, a few breaking changes could not be avoided.","s":"Upgrading to v3","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v3","p":203},{"i":227,"t":"The Node Version Requirement for building react-map-gl is now >=v6.4.0. Using prebuilt react-map-gl does NOT has this limitation. This is introduced by Mapbox GL JS v0.38.0","s":"Version Requirements","u":"/react-map-gl/docs/upgrade-guide","h":"#version-requirements","p":203},{"i":229,"t":"Two Map Components - v3 now splits the Map component into two React components: StaticMap and InteractiveMap. InteractiveMap is the default export, and designed to be as compatible as possible with the v2 default component. onChangeViewport callback now includes width and height.​ The viewport parameter passed to the onChangeViewport callback now includes width and height. Application code that composed the viewport with width and height may have to be updated. Please double check your render code if you relied on this behavior. // BAD: 'width' and 'height' below will be overridden by what's in the 'viewport' object // GOOD: 'width' and 'height' below will override the values in 'viewport' ","s":"MapGL Component","u":"/react-map-gl/docs/upgrade-guide","h":"#mapgl-component","p":203},{"i":231,"t":"Some Overlays Moved to Examples - Some less frequently used overlays (DraggablePointsOverlay, ChoroplethOverlay, ScatterplotOverlay), have been moved to examples. Most users are now using mapbox styles or deck.gl layers and removing these overlays reduces the size of the react-map-gl library for the majority of users that don't need them. If you still use them, simply copy the overlay source file(s) into your application. Overlays must be Children of the Map - Overlays must now be rendered as children of the main react-map-gl component to automatically sync with the map viewport.","s":"Overlays","u":"/react-map-gl/docs/upgrade-guide","h":"#overlays","p":203},{"i":233,"t":"The fitBounds utility has been moved to the math.gl library. The function can now be called as follows: import WebMercatorViewport from 'viewport-mercator-project'; const viewport = new WebMercatorViewport({width: 600, height: 400}); const bound = viewport.fitBounds( [[-73.9876, 40.7661], [-72.9876, 41.7661]], {padding: 20, offset: [0, -40]} ); // => bounds: instance of WebMercatorViewport // {longitude: -73.48760000000007, latitude: 41.268014439447484, zoom: 7.209231188444142}","s":"fitBounds utility function","u":"/react-map-gl/docs/upgrade-guide","h":"#fitbounds-utility-function","p":203},{"i":235,"t":"We have started to deprecate a few React props. In all the cases below, the old props will still work (you'll get a warning in the console), but they will likely be removed in the next major version of react-map-gl so you should start using the new props as soon as possible. Old Prop New Prop onChangeViewport() onViewportChange() onHoverFeatures() onHover() onClickFeatures() onClick() perspectiveEnabled [default: false] dragRotate [default: true]","s":"Deprecations","u":"/react-map-gl/docs/upgrade-guide","h":"#deprecations","p":203},{"i":237,"t":"v2 is API compatible with v1, however if you are still using v1 of react-map-gl, make sure that you first upgrade: Your node version to v4 or higher Your react version to 15.4 or higher. Background: mapbox-gl 0.31.0 introduced a hard dependency on Node >= v4.","s":"Upgrading to v2","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v2","p":203},{"i":239,"t":"(Upgrading from 0.6.x) Importing Overlays - The map overlay components (HTMLOverlay, CanvasOverlay, SVGOverlay etc) are now named exports. They previously had to be imported via their relative source paths: // v1.0 import MapGL, {SVGOverlay} from 'react-map-gl'; // v0.6 import MapGL from 'react-map-gl'; import SVGOverlay from 'react-map-gl/src/api-reference/svg-overlay';. Map State - The map state reported by onViewportChanged will now contain additional state fields (tracking not only pitch and bearing needed for perspective mode, but also transient information about how the projection is being changed by the user). This information must be passed back to the react-map-gl component in the next render. To simplify and future proof applications, it is recommended to simply save the entire mapState in your app store whenever it changes and then pass it back to the component rather than trying to keep track of individual fields (like longitude, latitude and zoom).","s":"Upgrading to v1","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v1","p":203},{"i":242,"t":"Release date: June 30 2023 To better accommodate the API divergence between Mapbox and Maplibre, this version adds a new endpoint react-map-gl/maplibre. The new endpoint exports identical components as react-map-gl, but typed for maplibre-gl instead. After switching to this new endpoint, maplibre-gl users no longer need to install mapbox-gl or a placeholder package as dependency. See upgrade guide for an example. Marker, Popup and GeolocateControl components now expose the native instance via React ref.","s":"react-map-gl v7.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v71","p":240},{"i":244,"t":"Release date: Feb 4, 2022 v7 is a complete rewrite of the library. It addresses many long-standing issues in v5 and v6 limited by legacy architecture decisions. The most notable results of this redesign are: Performance: minimize the overhead of React, offer the same fast and smooth interaction as the native library Lightweight: the ESM build size is reduced from 219k to 57k Predictability: Components behave the same as their mapbox counterparts. Props are mapped 1:1 from the native options wherever appropriate. Almost all imperative APIs (flyTo, fitBounds etc.) can now be called directly without breaking the React binding. Compatibility: first and third-party plugins! Directly use mapbox-gl-draw, mapbox-gl-geocoder, to name a few. TypeScript compliant: the code base is now entirely written in TypeScript, and all types can be imported. Visit the upgrade guide if you are trying to upgrade from v5 and v6.","s":"react-map-gl v7.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v70","p":240},{"i":246,"t":"Release date: Jan 27, 2020","s":"react-map-gl v5.3/v6.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v53v61","p":240},{"i":248,"t":"TypeScript and Flow typings are now published with the library More controller customizations. Smooth easing on wheel scroll, three-finger gesture to change pitch, inertia after pan/pinch, and customizable keyboard navigation speed. See the updated interaction options for details. A new eventRecognizerOptions prop is added for fine-tuning the interaction experience. New component: AttributionControl Promoted to official API: MapContext Resolved React error over attempted state update during render GeolocateControl added supports for showAccuracyCircle All controls now support inline styling with a style prop All components and examples have been rewritten as functional components","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights","p":240},{"i":250,"t":"Release date: Dec 16, 2020","s":"react-map-gl v6.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v60","p":240},{"i":252,"t":"The 6.0 release upgrades its Mapbox GL JS dependency to v2.0. There are important changes to mapbox-gl's license and pricing model in this milestone. If you are NOT using a Mapbox account (e.g. self-hosting map tiles), do NOT upgrade to this version, and consider your options discussed in this document. See upgrade guide for a complete list of breaking changes.","s":"What's Changed","u":"/react-map-gl/docs/whats-new","h":"#whats-changed","p":240},{"i":254,"t":"Release date: Jan 6, 2020","s":"react-map-gl v5.2","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v52","p":240},{"i":256,"t":"New Components: ScaleControl NavigationControl: new label prop GeolocateControl: new label, onGeolocate, auto props New Export: WebMercatorViewport is re-exported from the viewport-mercator-project library for ease of use. It's recommended to import it from react-map-gl instead to avoid future dependency change. New Example: Clusters","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-1","p":240},{"i":258,"t":"Release date: Oct 30, 2019","s":"react-map-gl v5.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v51","p":240},{"i":260,"t":"New Components: Layer and Source have been added to provide better React parity with the Mapbox GL JS API. Viewport transition: transitionDuration can be set to 'auto' when using FlyToInterpolator. New Example: Add an example with drawing library react-map-gl-draw.","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-2","p":240},{"i":262,"t":"Release date: May 31, 2019","s":"react-map-gl v5.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v50","p":240},{"i":264,"t":"The only change between the 5.0 release and the latest 4.1 release is Mapbox GL JS v1.0. By using this version, you opt into Mapbox's new pricing model, which bills per map load instead of map views. 5.0.x and 4.1.x will continue to update in parallel with otherwise identical features until November 2019 when Mapbox moves all users of 0.xx to a new pricing scheme. For more details, see mapbox's changelog and blog post. Alongside Mapbox GL JS's new milestone, we have relaxed the mapbox-gl dependency from locking minor release (~0.53.0) to major release (^1.0.0). This will allow developers to upgrade faster without waiting for a new release from react-map-gl.","s":"What's Changed","u":"/react-map-gl/docs/whats-new","h":"#whats-changed-1","p":240},{"i":266,"t":"Release date: Mar 14, 2019","s":"react-map-gl v4.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v41","p":240},{"i":268,"t":"New Components: FullscreenControl, GeolocateControl have been added to provide better React parity with the Mapbox GL JS API. New callback props InteractiveMap supports more callbacks: onNativeClick","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-3","p":240},{"i":270,"t":"Release date: Nov 5, 2018","s":"react-map-gl v4.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v40","p":240},{"i":272,"t":"Relative dimensions Both InteractiveMap and StaticMap now support CSS strings supplied to map width and height props. New onResize callback is fired when the map resizes. React 16 Upgrade to React 16.3 context and ref patterns Babel 7 Upgrade build system to Babel 7, better support for tree-shaking Style diffing Now use Mapbox's native style diffing. Immutable is no longer required. Draggable Markers Marker component now supports a new prop draggable, along with callbacks onDragStart, onDrag, and onDragEnd. 3d Popups Popup component now supports a new prop sortByDepth to enable proper occlusion when multiple popups are used in a tilted map. Interaction states onViewportChange is now called with richer descriptors of the user interaction, including isPanning, isZooming and isRotating. Interactive layers Dropped the requirement for the deprecated interactive property on the layer styles. Use the interactiveLayerIds prop to specify which layers are clickable. New callback props InteractiveMap supports more callbacks: onDblClick onMouseDown onMouseMove onMouseUp onTouchStart onTouchMove onTouchEnd onMouseEnter onMouseLeave onWheel onMouseOut See upgrade guide for breaking changes.","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-4","p":240},{"i":274,"t":"Release date: July, 2018","s":"react-map-gl v3.3","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v33","p":240},{"i":276,"t":"New viewState Property: Makes it possible to specify all map state properties (longitude, latitude, zoom, bearing and pitch) as a single property. New onViewStateChange callback: An alternative callback that matches the new viewState prop.","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-5","p":240},{"i":278,"t":"Realease date: January, 2018","s":"react-map-gl v3.2","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v32","p":240},{"i":280,"t":"Viewport transition: feature equivalent to Mapbox's flyTo and easeTo; smooth transition when using keyboard navigation or the NavigationControl. Better parity of Mapbox interaction: navigation using keyboard and the navigation control matches Mapbox behavior, including smooth transition when zooming and panning. Support for Map Reuse (experimental): A new property reuseMaps is provided for applications that create and destroy maps, to help work around a mapbox-gl resource leak issue that can lead to a browser crash in certain situations. mapbox-gl 0.42.2 New props of the InteractiveMap component: Map creation: transformRequest, reuseMaps Interaction: touchZoom, touchRotate Transition: transitionDuration, transitionInterpolator, transitionEasing, transitionInterruption, onTransitionStart, onTransitionInterrupt, onTransitionEnd","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-6","p":240},{"i":282,"t":"Release date: October 19, 2017","s":"react-map-gl v3.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v31","p":240},{"i":284,"t":"Event handling Support right mouse drag to rotate Support keyboard navigation Allow controls and overlays to block map interactions React 16 - react-map-gl is now being tested with React 16, but the React peer dependency requirement is unchanged at >=15.4.x. mapbox-gl v0.40.1 No Token warning: react-map-gl now renders an HTML message if no mapbox token is supplied.","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-7","p":240},{"i":286,"t":"Release date: July 27th, 2017","s":"react-map-gl v3.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v30","p":240},{"i":288,"t":"Latest Mapbox GL JS: Bumps Mapbox GL JS to 0.38. Multi-Touch Support: Full support for multi-touch gestures such as pinch-to-zoom and rotate. New Components: The MapGL component has been split into StaticMap and InteractiveMap (the default). Also, Popup, Marker, NavigationControl have been added to provide better React parity with the Mapbox GL JS API. Improved Overlay Components: Supplying viewport props (width height zoom longitude and latitude) are no longer required if you render SVGOverlay, CanvasOverlay or HTMLOverlay as a child of the map. Perspective mode is now supported in all overlays. New Props: maxPitch, minPitch, dragPan, doubleClickZoom, touchZoomRotate, scrollZoom are now provided to allow granular control of map interactivity. Documentation: Significantly expanded and linked with our other geospatial frameworks. Examples: New stand-alone examples to get you started instantly with the new features. Event Handling: New event handling architecture that enables full customization of event handling (experimental).","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-8","p":240},{"i":290,"t":"InteractiveMap (New, MapGL replacement)​ This is a wrapper on top of StaticMap. It takes all the props of StaticMap and additional ones such as onViewportChange, scrollZoom, dragRotate, etc. to control interactivity on the map. See Source Code for more information. StaticMap (New)​ This is the React wrapper around Mapbox GL JS and takes in viewport properties such as width, height, latitude, longitude. Style diffing and updating logic also live here. See Source Code for more information. Overlays​ Three overlays (ScatterplotOverlay, DraggablePointsOverlay, ChoroplethOverlay), have been moved out of the library and are now only provided as examples.","s":"Components","u":"/react-map-gl/docs/whats-new","h":"#components","p":240},{"i":292,"t":"Property Names - some prop names have been modernized, the old ones will still work for now with a warning. Internal Properties such as isHovering, isDragging, startDragLngLat have been removed. These were never meant to be useful publicly and have caused confusions in the past.","s":"Property Changes","u":"/react-map-gl/docs/whats-new","h":"#property-changes","p":240},{"i":294,"t":"fitBounds: fitBounds has been moved to another repository and has been rewritten to provide a more logical interface. For more information, see the Upgrade Guide.","s":"Utilities","u":"/react-map-gl/docs/whats-new","h":"#utilities","p":240},{"i":296,"t":"Date: Jan 17, 2017","s":"react-map-gl v2.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v20","p":240},{"i":298,"t":"Latest mapbox-gl: Bump mapbox-gl to v0.31.0 new maxZoom prop - Add maxZoom prop and defaults to 20 New onLoad prop - Add onLoad event handler new onClick prop - Add onClick prop handler (#140)","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-9","p":240},{"i":300,"t":"Perspective Mode - Now supports bearing and pitch properties, per mapbox-gl api documentation. These props default to 0 which means that maps will still be rendered in flat/ortographic mode when they are not provided Support for ES6 imports - The map overlay components (HTMLOverlay, CanvasOverlay, SVGOverlay etc) previously had to be imported via their relative source paths can now be imported directly using `import {SVGOverlay} from 'react-map-gl'.","s":"react-map-gl v1.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v10","p":240},{"i":302,"t":"Initial public version","s":"react-map-gl v0.6","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v06","p":240}],"index":{"version":"2.3.9","fields":["t"],"fieldVectors":[["t/2",[0,3.436,1,3.436,2,2.462,3,3.469,4,1.244,5,0.752,6,1.435,7,3.053,8,0.691,9,1.548,10,4.186,11,2.337,12,2.258,13,3.053,14,1.065,15,4.624,16,4.871,17,3.898,18,1.447,19,3.327,20,2.925,21,2.801,22,4.179,23,2.452,24,2.801,25,6.131,26,2.337,27,2.136,28,2.337,29,3.053,30,1.514,31,2.613,32,1.91,33,2.337,34,3.436,35,3.898,36,2.136,37,1.514,38,2.23,39,3.053,40,2.801,41,2.053,42,3.436,43,2.337,44,3.062,45,2.337,46,2.613,47,1.978,48,2.053,49,2.613,50,2.462,51,1.256,52,2.053,53,2.801,54,2.801,55,1.229,56,2.23,57,2.337]],["t/4",[4,1.256,5,0.827,6,1.165,8,1.456,9,1.12,18,0.849,23,1.204,38,1.953,44,2.77,47,2.669,48,1.798,49,2.289,50,2.157,58,1.673,59,3.01,60,3.779,61,3.01,62,1.871,63,2.454,64,2.289,65,1.567,66,2.454,67,3.01,68,2.454,69,3.01,70,4.123,71,2.674,72,1.477,73,4.61,74,3.01,75,3.255,76,4.636,77,3.01,78,1.436,79,1.953,80,3.01,81,2.454,82,1.1,83,2.454,84,3.01,85,2.674,86,3.01,87,2.289,88,1.521,89,4.636,90,1.953,91,3.01,92,2.152,93,2.289,94,4.12,95,1.477,96,1.477,97,1.436,98,2.674,99,3.515,100,2.289,101,2.454,102,2.157,103,1.361,104,1.871,105,2.454,106,3.01,107,1.732,108,1.673,109,2.674,110,2.289,111,2.289,112,3.01,113,3.01,114,2.949,115,3.779,116,3.01,117,2.674,118,2.289,119,1.798,120,3.01,121,4.636,122,2.674,123,2.454,124,3.01,125,3.01,126,3.01,127,2.454,128,2.454,129,2.674,130,2.454,131,2.674,132,3.01,133,1.798,134,2.674,135,2.289,136,1.15,137,1.953,138,2.454,139,2.674,140,0.915,141,1.953,142,2.454,143,2.674,144,1.521,145,3.01,146,1.798]],["t/6",[4,1.115,5,0.726,6,1.034,9,0.769,10,2.511,12,1.922,33,2.968,36,2.712,73,3.557,75,2.511,78,2.906,82,1.595,114,2.025,137,3.953,139,3.877,140,2.132,146,2.607,147,3.877,148,3.557,149,2.712,150,3.318,151,2.968,152,3.877,153,4.363,154,3.557,155,4.363,156,4.363,157,4.555,158,3.877,159,3.773,160,3.877,161,3.348,162,4.143,163,2.425,164,4.363,165,2.345,166,3.877,167,4.363,168,3.318,169,4.363,170,3.557,171,3.557,172,2.204,173,3.877,174,2.607,175,3.557,176,3.877,177,4.363,178,3.127,179,4.363,180,4.363,181,3.877,182,3.318,183,3.318,184,3.318,185,3.127,186,3.557,187,3.877]],["t/8",[4,1.517,5,0.876,6,0.68,8,0.804,9,1.011,14,1.776,20,1.91,130,4.672,188,2.225,189,1.81,190,2.392,191,6.306,192,1.72,193,1.807,194,2.221,195,1.966,196,2.008,197,1.926,198,2.304,199,1.764,200,2.66,201,2.051,202,3.081,203,2.142,204,3.185,205,2.142,206,3.299,207,1.91,208,1.81,209,5.732,210,1.966,211,5.093,212,5.732,213,5.732,214,1.764,215,2.225]],["t/11",[103,3.232,216,2.931,217,4.445,218,3.843,219,4.115,220,4.64,221,5.123]],["t/13",[5,0.571,8,1.11,9,0.974,14,1.711,18,1.011,37,2.433,58,3.069,65,2.876,75,3.178,108,3.966,136,2.11,191,4.501,192,2.373,193,1.649,210,1.894,222,2.433,223,3.178,224,2.709,225,2.433,226,5.522,227,5.522,228,4.501,229,2.496,230,2.876,231,4.395,232,3.966,233,4.916,234,3.957,235,2.968]],["t/15",[211,6.751,236,5.167]],["t/17",[4,1.553,5,0.895,6,0.736,8,0.872,9,1.07,14,1.88,20,2.069,188,2.41,189,1.961,190,2.591,192,1.864,193,1.806,194,2.302,195,2.081,196,2.125,197,2.038,198,2.496,199,1.911,200,2.816,201,2.17,202,3.261,203,2.267,204,3.371,205,2.267,206,3.492,207,2.069,208,1.961,214,1.911,215,2.41,237,7.085]],["t/20",[103,3.232,216,2.931,217,4.445,218,3.843,219,4.115,220,4.64,221,5.123]],["t/22",[5,0.727,8,1.085,18,0.988,58,3,75,3.108,103,2.441,108,4.347,136,2.063,193,1.543,210,2.413,222,2.379,223,3.108,224,2.649,230,2.812,231,4.347,232,3.909,233,4.373,234,3.869,235,2.902,238,5.399,239,2.728,240,3.108,241,4.401,242,5.348,243,7.033,244,4.373,245,5.348]],["t/24",[236,5.167,246,7.597]],["t/26",[4,1.553,5,0.895,6,0.736,8,0.872,9,1.07,14,1.88,20,2.069,188,2.41,189,1.961,190,2.591,192,1.864,193,1.806,194,2.302,195,2.081,196,2.125,197,2.038,198,2.496,199,1.911,200,2.816,201,2.17,202,3.261,203,2.267,204,3.371,205,2.267,206,3.492,207,2.069,208,1.961,214,1.911,215,2.41,247,4.763]],["t/29",[103,3.232,216,2.931,217,4.445,218,3.843,219,4.115,220,4.64,221,5.123]],["t/31",[5,0.474,78,3.436,90,4.675,95,2.249,97,3.436,114,2.925,133,2.738,161,3.88,193,1.604,197,2.42,230,4.04,247,3.765,248,4.072,249,6.185,250,5.6,251,5.532,252,6.401,253,5.138,254,4.072,255,4.072,256,3.284,257,4.583,258,3.736,259,4.583,260,5.6,261,2.408,262,3.485,263,4.072,264,4.583,265,3.736]],["t/33",[5,0.558,8,1.085,9,0.952,14,1.673,18,0.988,37,2.379,58,3,65,2.812,75,3.108,108,3.909,136,2.063,192,2.32,193,1.635,210,1.852,222,2.379,223,3.108,224,2.649,225,2.379,228,4.401,229,2.441,230,2.812,231,4.347,232,3.909,233,4.863,234,3.869,235,2.902,247,3.225,266,5.399,267,4.797,268,5.399,269,4.797,270,5.399]],["t/35",[4,1.549,5,0.858,6,1.087,9,0.954,14,1.677,18,0.677,43,3.681,79,2.4,119,2.209,136,2.068,151,2.515,157,2.4,159,1.988,161,1.764,163,2.055,165,1.988,193,1.816,194,2.521,195,1.856,196,1.896,197,1.818,199,1.629,214,1.629,247,4.479,262,4.115,271,2.299,272,4.115,273,6.26,274,2.384,275,2.65,276,2.512,277,5.412,278,3.698,279,4.809,280,5.412,281,5.412,282,5.412,283,2.812,284,3.698]],["t/37",[236,5.167,252,6.751]],["t/39",[4,1.486,5,0.87,6,0.818,8,0.636,9,1.029,14,0.981,18,0.58,20,1.511,23,2.609,47,1.823,192,2.071,193,1.824,194,2.247,195,1.653,196,2.044,197,1.62,198,1.823,199,1.395,200,2.238,201,1.725,203,1.801,205,1.801,207,1.511,208,1.432,214,2.124,215,1.76,240,2.775,274,2.874,276,2.238,285,1.823,286,3.568,287,5.797,288,6.523,289,4.82,290,5.797,291,4.82,292,4.82,293,4.82,294,3.93,295,3.665,296,4.82,297,2.88,298,3.128,299,3.128]],["t/41",[8,1.548,9,1.099,97,2.972,140,2.341,216,2.183,261,2.381,286,3.576,300,3.057,301,4.738,302,3.587,303,5.537,304,5.858,305,4.738,306,4.465,307,3.874,308,5.537,309,5.537,310,5.08,311,5.08]],["t/43",[18,1.027,30,2.47,90,3.639,140,2.19,142,4.571,210,1.923,224,2.751,229,2.535,239,3.641,240,4.149,242,4.263,261,2.142,274,3.175,286,3.903,300,2.751,312,4.571,313,4.982,314,4.263,315,4.571,316,3.814,317,3.486,318,4.571,319,4.982,320,4.018,321,4.982,322,4.982,323,4.263,324,4.982,325,4.571]],["t/45",[5,0.489,8,0.951,9,0.834,18,1.341,23,3.144,28,3.219,30,2.085,111,3.598,117,4.205,140,1.957,146,2.827,216,2.257,224,2.322,230,2.464,235,2.544,239,3.254,240,3.708,261,1.808,274,2.085,286,4.102,302,2.724,315,3.858,316,4.382,326,6.442,327,4.205,328,4.732,329,4.205,330,4.732,331,4.732,332,3.858,333,3.858,334,3.219,335,2.942,336,6.442,337,4.732,338,3.598,339,4.205,340,4.732,341,4.205,342,3.391,343,4.732]],["t/47",[344,7.677]],["t/49",[4,1.559,5,0.88,6,0.985,8,0.818,9,1.023,14,1.797,20,1.942,188,2.262,189,1.84,190,2.432,192,1.749,193,1.811,194,2.238,195,1.99,196,2.032,197,1.949,198,2.343,199,1.793,200,2.692,201,2.075,203,2.167,205,2.167,207,1.942,208,1.84,210,1.396,214,1.793,215,2.262,297,3.465,298,3.764,299,3.764,345,2.642,346,4.157,347,5.154,348,4.728,349,3.465,350,4.728]],["t/51",[5,0.877,8,1.153,9,1.012,12,2.529,14,1.779,37,2.529,140,2.223,173,6.501,174,3.429,189,3.307,190,3.429,192,2.466,193,1.132,210,1.969,225,2.529,351,5.74,352,4.548,353,4.113,354,4.679,355,5.74,356,5.74,357,5.74,358,4.364,359,5.74,360,4.364,361,3.429]],["t/53",[5,0.792,103,3.464,202,4.119,210,2.628,216,2.164,217,3.841,218,3.321,230,3.217,235,3.321,239,3.871,240,4.411,274,2.722,349,3.691,362,4.01,363,6.247,364,4.427,365,4.01]],["t/55",[5,0.596,9,0.836,41,1.852,48,1.852,55,1.109,56,2.012,62,1.927,65,2.469,82,1.133,92,2.201,97,2.262,133,1.852,137,2.012,189,1.401,193,1.136,205,1.158,210,2.213,216,2.883,222,2.842,239,2.396,244,1.927,261,1.184,285,1.784,300,2.327,301,4.905,302,3.713,305,2.357,307,1.927,314,2.357,334,2.108,365,2.012,366,6.178,367,3.866,368,2.826,369,5.732,370,3.398,371,3.1,372,2.527,373,2.754,374,4.214,375,1.478,376,2.754,377,2.754,378,4.22,379,4.379,380,2.754,381,5.759,382,3.1,383,4.742,384,3.1,385,3.1,386,3.1,387,3.1,388,4.742,389,3.1,390,3.1,391,3.1,392,3.1,393,3.1,394,3.1,395,3.1,396,2.221,397,2.108,398,2.527,399,3.1,400,2.527,401,3.1,402,3.1,403,3.398,404,3.315,405,2.754,406,2.527,407,2.754,408,2.221,409,3.1,410,2.754,411,2.012,412,2.527,413,3.1,414,6.178]],["t/57",[5,0.898,8,0.519,18,0.753,55,0.924,70,1.676,82,0.944,114,1.909,140,0.785,172,2.077,175,2.105,200,1.909,201,2.432,203,2.539,205,2.765,210,2.828,219,1.486,225,1.812,245,1.964,258,2.105,267,2.295,375,1.962,397,3.974,410,2.295,415,5.464,416,1.757,417,2.949,418,1.543,419,2.583,420,2.295,421,1.851,422,2.105,423,4.443,424,3.654,425,3.974,426,2.583,427,1.964,428,2.583,429,5.307,430,2.583,431,2.583,432,3.654,433,5.819,434,4.443,435,4.225,436,3.127,437,3.792,438,2.556,439,4.112,440,3.352,441,2.583,442,2.295,443,4.553,444,2.583,445,2.295,446,2.295,447,3.654,448,1.757,449,2.105,450,1.435,451,2.295,452,3.654,453,4.112,454,2.583,455,2.947,456,2.295,457,1.964,458,2.295,459,2.295]],["t/59",[5,0.274,9,1.269,14,2.314,32,3.818,41,4.46,55,2.311,96,3.532,103,1.197,174,3.54,193,1.612,205,2.214,210,2.637,216,0.928,222,1.848,223,1.524,225,3.289,239,1.338,286,1.229,333,2.159,375,3.561,403,5.35,404,4.939,417,2.415,418,1.582,425,1.801,435,1.646,438,2.608,460,2.648,461,2.353,462,2.648,463,2.353,464,2.353,465,3.006,466,2.648,467,2.014,468,3.543,469,2.648,470,2.159,471,2.159,472,5.926,473,2.648,474,3.19,475,2.648,476,2.648,477,2.159,478,2.353,479,2.648,480,2.648,481,2.648,482,2.353,483,2.353,484,2.648,485,2.014,486,2.648,487,2.353,488,4.195,489,2.648,490,4.195,491,3.728,492,1.898,493,2.159,494,1.898,495,2.679,496,1.801,497,2.648,498,2.648,499,2.648,500,1.719,501,2.159]],["t/61",[5,0.786,8,0.513,18,0.468,23,0.585,32,4.659,43,2.043,44,0.471,48,3.16,52,0.874,55,0.914,58,0.438,60,0.643,64,0.6,65,1.331,70,0.512,72,1.254,82,0.288,90,0.512,92,0.679,95,1.474,96,2.271,97,1.219,99,2.715,102,1.466,103,2.92,104,2.115,114,1.186,136,0.976,137,1.328,140,0.776,144,1.034,157,1.658,161,3.757,168,1.943,178,1.048,193,1.569,201,0.282,203,0.295,205,1.819,210,0.271,216,0.276,230,0.411,231,0.438,242,0.6,245,0.6,249,0.6,251,5.357,253,0.643,254,0.701,256,0.565,261,1.944,286,2.362,320,0.565,329,2.669,332,1.193,342,0.565,363,4.464,365,0.512,368,0.387,416,2.043,417,3.78,418,0.471,423,0.6,434,1.556,435,1.588,436,1.556,437,1.658,438,1.272,452,0.701,461,2.27,465,0.565,468,1.392,471,1.668,485,3.869,487,1.3,493,3.774,494,1.048,495,2.869,502,0.701,503,2.449,504,0.701,505,0.701,506,0.701,507,0.6,508,0.789,509,2.438,510,3.758,511,0.789,512,0.6,513,0.701,514,0.789,515,0.789,516,0.701,517,2.046,518,0.789,519,3.598,520,0.789,521,0.6,522,0.949,523,0.789,524,2.449,525,0.701,526,0.701,527,0.789,528,0.701,529,4.113,530,2.909,531,4.367,532,4.367,533,4.113,534,2.555,535,3.774,536,3.004,537,4.113,538,0.701,539,0.838,540,0.789,541,0.6,542,1.3,543,0.909,544,0.643,545,1.463,546,1.668,547,0.643,548,0.643,549,0.701,550,1.463,551,0.701,552,0.6,553,0.701,554,0.789,555,0.789,556,0.789,557,0.6,558,0.701,559,0.789,560,0.701,561,0.701,562,0.701,563,0.701,564,2.27,565,0.789,566,0.701,567,0.789,568,0.701,569,0.789,570,0.789,571,0.789,572,0.789,573,5.018,574,2.555,575,4.148,576,0.6,577,3.004,578,2.284,579,0.789,580,2.555,581,2.555,582,2.083,583,2.555,584,2.083,585,0.789,586,0.643,587,0.643,588,0.643,589,0.789,590,0.789,591,0.789,592,0.789,593,0.789,594,0.789,595,0.789,596,0.789,597,0.789,598,0.789,599,0.789,600,0.789,601,0.789,602,1.3,603,0.789,604,0.789,605,0.789,606,0.789,607,0.701,608,0.6,609,0.789,610,0.789,611,1.3,612,1.3,613,1.818,614,1.392,615,0.789,616,0.789,617,0.471,618,0.789]],["t/63",[3,0.806,4,1.272,5,0.881,6,1.239,8,1.016,9,0.973,12,1.673,14,0.524,18,0.695,20,1.38,28,1.968,29,1.501,31,1.285,32,0.939,35,1.285,37,0.744,41,1.009,43,3.059,44,1.009,45,1.149,46,1.285,51,1.058,55,0.604,64,1.285,65,0.88,68,1.377,72,0.829,75,1.666,78,0.806,82,0.618,88,0.853,101,1.377,137,1.878,140,1.367,146,1.729,151,3.059,160,1.501,161,0.806,163,3.066,172,1.918,174,1.009,182,2.201,185,1.211,189,0.764,192,1.243,193,1.439,194,2.111,195,1.302,196,1.33,197,1.275,199,0.744,200,0.784,210,2.229,214,0.744,216,0.592,223,0.972,224,1.42,225,1.673,229,0.764,231,0.939,232,0.939,239,2.272,275,1.211,285,0.972,300,1.863,306,1.211,312,1.377,316,1.149,334,2.582,339,1.501,346,1.211,352,1.05,375,0.806,398,1.377,403,1.211,404,1.666,408,1.211,415,2.074,417,1.666,420,3.373,425,1.149,429,2.796,455,1.211,491,1.501,506,1.501,507,1.285,521,1.285,522,1.878,539,0.692,541,1.285,543,1.799,619,1.501,620,1.377,621,1.285,622,1.689,623,1.501,624,1.501,625,2.894,626,1.689,627,1.689,628,4.498,629,1.689,630,1.689,631,1.377,632,1.377,633,1.689,634,1.501,635,2.894,636,1.689,637,1.689,638,1.689,639,1.689,640,1.377,641,1.501,642,2.894,643,1.689,644,1.689,645,1.285,646,1.211,647,1.501,648,1.501,649,2.359,650,2.359,651,1.501,652,1.501,653,2.894,654,1.501,655,1.689,656,1.689,657,1.211,658,1.285,659,2.572,660,1.501,661,1.689,662,1.689,663,1.501,664,1.501,665,1.689,666,1.689,667,1.501,668,1.689,669,1.689,670,3.796,671,1.689,672,1.689,673,1.377,674,1.689,675,1.689,676,1.689,677,1.501,678,1.689,679,1.689,680,1.689,681,1.377,682,1.501,683,1.377,684,1.377,685,1.377,686,2.572,687,2.894,688,1.377,689,1.501,690,1.211,691,1.689,692,1.501,693,2.894,694,1.689,695,1.689,696,1.689,697,1.501,698,1.501,699,1.501,700,1.689,701,1.285,702,1.501,703,1.689,704,1.377,705,1.689,706,1.689,707,0.908,708,1.689]],["t/65",[4,1.548,5,0.834,6,0.76,8,0.579,9,0.969,14,1.704,19,1.868,79,1.868,81,3.651,82,1.052,97,1.373,114,1.336,119,1.72,140,1.361,146,1.72,151,1.958,157,3.568,159,1.548,161,2.137,162,1.958,163,1.6,165,2.408,166,3.98,170,2.347,186,2.347,187,2.558,193,1.853,194,2.334,195,1.536,196,1.569,197,1.847,199,1.973,214,1.973,216,1.008,261,1.1,271,2.785,272,3.406,274,1.973,276,2.88,370,2.063,375,2.137,652,2.558,709,2.063,710,5.512,711,4.817,712,3.98,713,4.479,714,4.479,715,3.98,716,4.479,717,2.063,718,2.879,719,1.868,720,2.558,721,2.879,722,4.479,723,2.879,724,2.879,725,1.868,726,2.879]],["t/67",[727,6.259]],["t/69",[4,0.96,5,0.88,6,0.89,8,1.387,48,3.133,53,4.274,55,1.876,72,2.573,92,3.203,102,3.758,144,3.486,162,3.566,188,2.914,193,1.784,194,1.593,195,1.799,197,1.762,199,2.31,338,3.987,614,3.566,698,4.659,709,3.758,728,5.243,729,5.243,730,3.758,731,6.287,732,4.659,733,5.243,734,5.243]],["t/71",[18,1.391,727,6.193]],["t/73",[4,1.481,5,0.858,6,0.628,8,1.088,9,0.954,14,1.677,18,0.677,20,1.764,92,1.717,188,2.055,189,1.672,190,2.209,192,1.589,193,1.784,194,2.14,195,1.856,196,1.896,197,1.818,198,2.129,199,1.629,200,2.512,201,2.521,202,3.787,203,2.022,204,3.008,205,2.022,206,3.115,207,1.764,208,1.672,210,1.268,214,1.629,215,2.055,224,2.655,342,2.65,417,2.129,492,2.65,701,4.115,735,4.549,736,4.809,737,4.809,738,5.412,739,5.412]],["t/76",[5,0.841,9,0.563,14,0.99,30,2.138,51,1.168,103,1.444,150,4.983,163,2.697,172,2.451,174,2.899,192,1.373,193,1.464,201,1.736,203,1.813,210,2.417,216,1.7,217,1.986,218,1.717,219,1.839,220,3.149,230,2.527,232,1.775,235,3.523,364,5.317,367,2.604,375,1.524,397,2.173,403,2.289,404,1.839,408,2.289,425,3.991,427,3.69,429,3.648,433,2.289,437,2.073,438,4.793,440,2.604,442,4.312,445,2.839,448,2.173,450,4.285,468,2.173,492,3.477,496,2.173,735,4.145,740,2.604,741,3.956,742,3.956,743,3.195,744,2.839,745,2.839,746,2.429,747,3.195,748,2.429,749,5.868,750,3.413,751,2.839,752,2.839,753,3.195,754,5.868,755,2.604,756,3.195,757,2.839]],["t/78",[52,3.324,161,3.999,193,1.654,249,6.375,251,5.702,332,4.536,404,4.568,465,3.987,468,5.398,503,4.536,552,4.231,586,4.536,587,4.536,588,4.536,735,2.991,740,6.47,758,7.052]],["t/80",[8,1.297,9,1.138,14,2,18,1.181,37,2.843,58,3.586,65,3.36,75,3.714,87,4.906,192,2.772,193,1.273,222,2.843,223,3.714,224,3.166,225,2.843,295,4.906,735,3.468,741,5.26,759,6.452]],["t/82",[4,1.477,5,0.814,6,0.978,9,0.836,14,1.47,18,0.567,79,2.012,119,1.852,151,2.108,157,2.012,159,1.666,161,1.478,163,1.723,165,1.666,193,1.866,194,2.391,195,1.627,196,1.661,197,2.167,199,1.366,201,1.697,214,1.366,271,1.927,272,3.606,275,2.221,276,3.403,283,2.357,297,2.833,406,3.866,557,3.606,710,5.732,735,3.737,750,2.469,760,5.732,761,4.742,762,3.1,763,3.1,764,4.742,765,4.742,766,4.214,767,4.742,768,4.742,769,4.742,770,4.742,771,4.742,772,3.1,773,3.1]],["t/84",[774,7.677]],["t/86",[4,1.553,5,0.895,6,0.736,8,0.872,9,1.07,14,1.88,20,2.069,188,2.41,189,1.961,190,2.591,192,1.864,193,1.806,194,2.302,195,2.081,196,2.125,197,2.038,198,2.496,199,1.911,200,2.816,201,2.17,202,3.261,203,2.267,204,3.371,205,2.267,206,3.492,207,2.069,208,1.961,214,1.911,215,2.41,775,5.423]],["t/89",[103,3.232,216,2.931,217,4.445,218,3.843,219,4.115,220,4.64,221,5.123]],["t/91",[5,0.567,8,1.101,9,0.966,14,1.698,18,1.003,37,2.414,58,3.046,65,2.854,75,3.154,108,4.379,136,2.094,192,2.355,193,1.644,210,1.88,222,2.414,223,3.154,224,2.689,225,2.414,228,4.468,229,2.477,230,2.854,231,4.379,232,3.947,233,4.415,234,3.927,235,2.946,775,3.728,776,5.48,777,5.48,778,5.48]],["t/93",[236,5.167,779,5.167]],["t/95",[4,1.531,5,0.847,6,0.6,8,0.711,9,0.923,14,1.623,20,1.687,188,1.965,189,1.599,190,2.113,192,1.519,193,1.813,194,2.342,195,1.796,196,1.834,197,1.759,198,2.035,199,1.558,200,2.431,201,2.467,202,3.706,203,1.957,204,2.91,205,1.957,206,3.014,207,1.687,208,1.599,214,1.558,215,1.965,276,2.431,736,4.653,737,4.653,750,4.154,780,5.237,781,6.894,782,5.237,783,5.237,784,4.653,785,5.237,786,3.128]],["t/98",[5,0.364,90,2.284,103,2.811,108,3.456,165,1.892,172,3.142,192,1.512,193,1.701,201,1.259,203,1.315,210,1.79,216,1.828,217,2.188,218,3.343,219,2.026,220,3.386,222,1.55,230,2.717,231,3.456,232,3.822,233,4.276,239,3.475,302,2.026,308,3.127,316,2.394,362,2.284,367,2.869,375,1.679,397,2.394,417,3.579,425,2.394,427,4.728,429,3.244,448,2.394,455,2.522,492,3.739,493,2.869,530,2.102,688,2.869,741,5.069,742,5.988,744,3.127,745,4.637,746,2.676,750,3.238,752,3.127,787,2.284,788,3.127,789,2.522,790,3.519,791,3.519,792,3.519,793,3.519,794,3.519,795,2.522,796,2.188,797,3.519,798,6.878,799,2.869,800,3.127,801,3.127,802,3.519]],["t/100",[15,4.238,95,3.057,102,4.465,161,3.675,193,1.52,249,5.858,251,5.24,404,3.587,465,4.465,557,4.738,750,4.012,784,5.537,803,6.231,804,6.845,805,7.703,806,5.537]],["t/102",[8,1.297,9,1.138,14,2,18,1.181,37,2.843,58,3.586,65,3.36,75,3.714,192,2.772,193,1.273,222,2.843,223,3.714,224,3.166,225,2.843,750,3.36,806,5.733,807,6.452,808,6.452,809,6.452]],["t/104",[4,1.553,5,0.86,6,1.093,9,0.961,14,1.69,18,0.684,79,2.425,119,2.232,151,2.541,157,2.425,159,2.008,161,1.782,163,2.076,165,2.008,193,1.799,194,2.528,195,1.87,196,1.91,197,1.832,199,1.646,201,1.951,214,1.646,271,2.323,272,4.146,273,6.29,275,2.677,276,2.531,283,2.841,297,3.257,750,4.227,766,4.845,810,5.452,811,3.736,812,5.452,813,5.452,814,5.452,815,5.452,816,3.736]],["t/106",[817,7.677]],["t/108",[4,1.553,5,0.895,6,0.736,8,0.872,9,1.07,14,1.88,20,2.069,188,2.41,189,1.961,190,2.591,192,1.864,193,1.806,194,2.302,195,2.081,196,2.125,197,2.038,198,2.496,199,1.911,200,2.816,201,2.17,202,3.261,203,2.267,204,3.371,205,2.267,206,3.492,207,2.069,208,1.961,214,1.911,215,2.41,818,7.085]],["t/111",[87,4.581,103,2.724,136,2.302,193,1.488,202,3.239,210,2.588,216,2.642,217,3.745,218,3.239,219,3.468,220,3.91,221,4.317,239,3.044,448,4.098,455,4.317,800,5.354,801,5.354,819,6.025,820,6.15,821,6.025,822,7.544,823,6.025]],["t/113",[5,0.628,8,1.221,18,1.112,58,3.376,75,3.497,108,4.594,136,2.321,193,1.631,210,2.084,222,2.677,223,3.497,224,2.981,230,3.164,231,4.594,232,4.214,233,4.714,234,4.354,235,3.266]],["t/115",[87,5.777,236,5.167]],["t/117",[4,1.394,5,0.824,6,0.868,8,0.824,9,0.454,14,0.798,18,0.471,23,2.846,44,2.45,47,1.481,103,1.163,193,1.832,194,2.245,195,1.407,196,1.791,197,1.378,200,1.903,201,1.467,203,1.532,205,1.532,207,1.228,208,1.163,214,1.807,215,1.43,240,2.36,274,3.574,276,2.707,285,1.481,286,2.956,294,3.343,295,3.118,297,3.483,298,3.784,299,2.661,495,2.636,530,3.483,632,2.098,789,2.939,824,2.287,825,4.753,826,5.531,827,3.784,828,3.343,829,5.181,830,5.159,831,3.343,832,3.644,833,3.644,834,3.644,835,3.343,836,3.644]],["t/119",[8,1.312,9,0.851,18,0.884,23,3.413,30,2.126,90,3.132,97,2.302,140,2.409,142,3.934,210,1.655,224,2.368,229,2.182,239,3.298,240,3.758,242,3.67,261,2.494,274,2.876,300,3.203,301,3.67,302,2.778,303,4.288,306,3.459,307,3,309,4.288,310,3.934,312,3.934,313,4.288,314,3.67,315,3.934,316,3.283,317,3,318,3.934,319,4.288,320,3.459,321,4.288,322,4.288,323,3.67,324,4.288,325,3.934,412,3.934,837,4.288,838,4.826,839,4.826]],["t/120",[840,7.677]],["t/122",[4,1.309,5,0.739,6,1.214,18,1.309,194,2.172,229,3.232,274,3.15,841,5.436]],["t/124",[5,0.823,8,1.32,55,2.35,136,2.51,163,3.65,271,4.084,286,3.049,361,3.924,711,4.707,842,5.837,843,4.753,844,5.702,845,6.569,846,4.468]],["t/126",[9,1.505,23,2.799,55,0.883,216,3.081,265,2.012,274,1.088,286,3.578,287,2.194,290,3.525,301,4.743,302,5.062,307,5.307,366,3.525,369,3.525,370,1.769,374,7.586,375,4.22,378,2.283,414,3.525,546,2.012,646,1.769,647,4.418,825,2.012,827,1.602,830,1.877,837,2.194,847,2.469,848,8.456,849,2.469,850,2.469,851,2.469,852,2.469,853,2.469,854,2.469,855,2.469,856,2.194,857,2.469,858,2.469,859,2.194,860,2.469,861,2.469,862,2.469,863,2.469,864,2.194,865,2.469,866,2.469,867,2.012,868,2.469,869,2.469,870,2.469,871,2.469]],["t/128",[48,3.629,108,4.594,229,2.746,231,4.594,232,4.594,233,5.139,375,2.898,429,5.382,432,5.398,448,5.889,536,3.943,872,5.398]],["t/130",[5,0.734,12,1.654,23,1.502,93,4.162,103,1.698,111,4.162,114,1.743,193,1.08,201,2.311,203,2.413,205,2.045,222,1.654,229,2.474,239,3.262,245,2.855,286,2.54,302,2.161,320,2.691,333,5.785,375,3.974,397,3.723,424,3.337,427,2.855,429,5.179,434,2.855,435,3.402,436,2.855,437,3.552,438,2.335,440,4.462,446,3.337,448,2.554,495,1.698,530,3.27,536,3.552,789,2.691,827,2.437,873,4.863,874,3.755,875,5.473,876,5.473,877,3.337,878,4.863,879,3.755,880,4.863,881,3.755,882,3.755,883,3.755,884,3.755,885,3.755,886,3.755,887,3.755,888,3.755,889,3.755,890,3.337,891,3.755,892,2.554]],["t/132",[9,1.496,14,2.63,23,3.394,55,2.943,103,3.718,193,1.674,229,2.139,274,2.085,522,4.181,546,3.858,646,3.391,701,3.598,827,3.071,844,3.391,864,4.205,867,5.251,893,4.205,894,4.732,895,6.442,896,6.442,897,6.442,898,4.732,899,3.858,900,4.732,901,6.442,902,4.205]],["t/134",[5,0.73,9,1.402,14,2.465,18,0.349,23,1.282,28,1.297,32,2.306,51,0.697,55,1.147,95,1.573,99,1.185,114,0.885,162,1.297,182,1.449,189,0.862,193,1.698,216,0.668,229,3.545,239,4.069,247,2.479,250,1.694,251,2.823,255,1.694,256,3.487,260,1.694,261,0.728,274,3.548,302,1.097,365,1.237,375,3.741,403,3.487,416,1.297,429,1.185,492,2.974,495,1.449,503,1.554,519,1.297,522,1.237,526,1.694,529,1.694,530,3.513,536,5.09,543,1.185,561,1.694,564,1.694,573,1.694,602,1.694,611,1.694,612,1.694,613,1.694,657,1.366,701,1.449,707,1.025,735,2.231,750,0.993,758,1.694,789,1.366,804,1.694,846,1.297,873,5.834,880,1.694,890,2.849,892,2.181,893,1.694,903,7.953,904,5.428,905,3.206,906,4.15,907,4.15,908,1.906,909,1.906,910,1.554,911,1.906,912,3.206,913,1.906,914,1.906,915,1.906,916,1.906,917,3.206,918,1.906,919,1.906,920,1.906,921,1.906,922,1.906,923,1.906,924,1.554,925,1.906,926,1.554,927,1.694,928,1.906,929,1.906]],["t/136",[4,1.12,5,0.828,6,1.195,18,0.804,47,2.527,51,1.605,55,1.571,82,1.605,100,3.338,119,2.622,135,3.338,136,2.337,193,1.809,194,1.859,195,2.098,196,1.538,197,2.055,200,2.037,201,1.571,203,1.64,205,1.64,208,1.984,230,2.286,232,2.439,244,2.729,297,2.622,298,2.849,299,2.849,404,3.521,425,2.986,632,3.578,786,2.622,843,2.622,930,6.256,931,4.389,932,4.389,933,4.389,934,4.389,935,4.389,936,4.389,937,4.389,938,4.389,939,4.389,940,4.389,941,4.389,942,4.389]],["t/138",[5,0.89,47,2.738,108,2.644,119,1.86,136,2.661,141,2.02,161,2.754,163,3.209,193,1.798,197,1.046,225,2.849,230,3.628,231,2.644,232,2.644,233,2.958,235,1.673,251,4.738,275,5.788,335,1.935,354,2.538,368,2.334,375,1.485,380,2.766,525,5.131,621,6.141,650,2.538,711,5.788,796,1.935,842,7.177,872,5.131,943,5.774,944,5.774,945,6.966,946,5.774,947,4.757,948,3.113]],["t/140",[18,1.391,236,5.167]],["t/142",[4,1.009,5,0.894,6,0.644,8,0.469,9,0.668,14,1.175,18,0.427,55,0.835,82,0.853,92,1.76,102,1.673,103,1.055,119,2.265,193,1.9,194,1.674,195,2.445,197,2.395,214,1.67,244,1.451,276,3.308,285,1.343,297,3.292,298,3.576,338,1.775,360,2.883,365,3.107,552,4.19,557,4.19,709,5.28,731,5.577,732,4.897,786,1.394,843,1.394,949,3.791,950,6.493,951,3.791,952,5.511,953,2.074,954,2.074,955,3.791,956,3.791,957,3.791,958,3.791,959,3.791,960,3.791,961,3.791,962,3.791]],["t/144",[5,0.827,8,1.136,18,1.034,90,3.667,103,3.614,119,4.327,137,3.667,174,3.376,197,2.434,224,2.772,239,2.855,240,4.169,320,4.049,360,4.297,365,4.701,375,3.455,536,3.667,537,5.021,548,4.606,709,4.049,711,5.729,731,4.606,788,5.021,963,5.651]],["t/146",[18,1.391,727,6.193]],["t/148",[40,5.608,51,2.515,54,5.608,262,5.231,543,4.277,690,4.93,755,5.608,964,6.879,965,6.879,966,6.113,967,6.879,968,6.879]],["t/150",[4,0.953,5,0.538,6,0.884,18,1.257,23,2.082,30,2.294,50,3.731,56,3.379,62,3.236,70,3.379,193,1.516,262,3.959,730,4.921,927,4.626,969,6.102,970,6.102,971,4.244,972,5.206,973,5.206,974,7.112,975,2.63,976,5.206,977,5.206,978,5.206,979,7.252,980,6.102,981,5.206,982,4.626]],["t/152",[15,5.268,33,4.275,40,5.123,176,5.585,189,2.841,261,2.401,327,5.585,421,4.504,495,2.841,501,5.123,521,4.779,707,3.379,926,5.123,969,6.882,970,5.585,983,6.285,984,6.285,985,6.285,986,5.585,987,3.379]],["t/154",[8,0.996,13,4.405,27,3.082,36,3.082,51,2.43,78,3.171,97,2.365,146,2.962,253,4.041,261,1.894,335,4.133,360,3.77,361,3.972,377,4.405,495,2.241,501,4.041,512,3.77,539,2.029,707,2.665,719,3.217,751,4.405,820,4.041,926,4.041,974,4.041,979,6.114,988,4.958,989,5.419,990,6.648,991,4.958,992,3.553,993,4.958,994,4.958,995,4.958,996,4.958,997,4.958,998,4.041,999,4.041,1000,4.958,1001,4.041,1002,4.041,1003,4.041,1004,4.958,1005,4.958,1006,3.553,1007,4.958]],["t/156",[3,3.281,4,1.259,5,0.711,6,1.168,229,3.11,539,2.816,786,4.11,1008,6.879,1009,6.113,1010,6.879,1011,5.608,1012,6.879]],["t/158",[55,2.533,787,4.595,1013,5.383,1014,7.08,1015,7.08,1016,7.08,1017,7.08,1018,6.291,1019,7.08]],["t/160",[4,1.284,5,0.725,6,1.19,56,4.55,1013,5.332,1018,6.23,1020,6.23,1021,7.012,1022,7.012,1023,6.23]],["t/162",[4,1.003,5,0.567,6,0.93,28,3.728,133,3.274,143,4.87,165,2.946,199,2.414,317,3.407,352,4.415,607,6.311,690,3.927,755,5.79,787,3.557,998,4.468,1009,4.87,1011,4.468,1013,4.167,1020,4.87,1023,6.311,1024,5.48,1025,5.48,1026,5.48,1027,5.48,1028,4.87,1029,4.87,1030,4.87,1031,5.48,1032,5.48,1033,4.87,1034,5.48,1035,7.102,1036,4.468,1037,5.48]],["t/164",[4,1.271,5,0.718,6,1.179,54,5.661,707,3.733,1038,5.661,1039,6.171,1040,6.945,1041,6.945,1042,6.945,1043,6.945]],["t/166",[52,4.357,82,2.666,378,4.198,509,5.226,1044,5.945,1045,6.48]],["t/168",[4,1.562,5,0.839,6,1.527,9,1.303,14,2.29,18,1.068,30,2.569,193,1.458,658,5.62,730,4.179,1046,5.832,1047,5.182,1048,5.296,1049,5.027,1050,5.182]],["t/170",[4,1.504,5,0.849,6,0.723,9,1.222,14,1.32,20,3.305,55,1.525,193,1.813,194,2.284,195,2.055,196,2.099,197,2.013,198,2.453,199,1.877,200,2.781,201,2.144,203,2.239,205,2.239,207,2.033,208,1.926,214,1.877,215,2.368,297,3.579,298,3.888,299,3.888,300,2.091,346,4.293,347,5.324,348,4.884,349,3.579,350,4.884,1051,3.474]],["t/172",[3,2.767,4,0.745,5,0.6,6,1.374,8,0.818,9,1.427,12,1.793,14,2.508,18,0.745,30,1.793,88,2.056,133,3.465,189,1.84,193,1.144,194,1.762,196,1.426,218,2.188,346,4.157,352,3.606,541,3.095,543,2.53,617,2.432,634,5.154,683,3.318,684,3.318,735,2.188,750,2.12,779,2.769,796,2.53,974,4.728,999,4.728,1044,4.728,1048,4.157,1052,6.005,1053,2.769,1054,4.07,1055,3.617,1056,4.07,1057,4.07,1058,7.365,1059,5.8,1060,5.8,1061,5.8,1062,4.07,1063,4.07,1064,4.07,1065,3.617,1066,4.07,1067,4.07,1068,4.07]],["t/174",[4,1.522,5,0.891,6,1.2,9,1.384,16,5.065,140,1.653,193,1.699,194,2.385,195,1.866,196,1.905,197,1.828,216,1.905,219,3.131,346,3.898,617,3.25,621,4.136,658,4.136,1048,3.898,1049,3.7,1069,5.439,1070,5.439,1071,5.439,1072,5.439]],["t/177",[4,1.25,5,0.755,6,0.876,8,0.697,9,0.91,18,0.635,23,3.06,44,4.08,82,1.268,97,1.655,133,3.084,159,1.865,193,1.799,194,2.075,195,1.19,196,1.215,197,1.165,200,1.61,201,1.241,203,1.296,205,1.296,216,1.215,240,1.997,274,3.372,276,2.396,286,3.553,294,2.828,295,2.638,297,2.072,298,2.251,299,2.251,302,1.997,316,2.359,396,2.486,495,2.334,524,2.828,530,3.084,789,2.486,825,4.208,826,5.026,827,4.432,828,2.828,829,4.587,830,4.688,831,2.828,832,3.082,833,3.082,834,3.082,835,2.828,836,3.082,846,2.359,1073,3.469,1074,3.469,1075,3.469,1076,3.699]],["t/179",[5,0.78,55,2.156,82,2.203,99,3.745,107,3.468,108,3.348,127,4.911,150,4.581,161,2.874,218,3.239,222,2.654,241,4.911,244,3.745,261,2.302,495,2.724,512,4.581,513,5.354,786,3.599,843,3.599,844,4.317,899,4.911,1077,5.354,1078,6.025,1079,6.025,1080,6.025,1081,6.025]],["t/181",[4,1.179,5,0.489,6,0.803,7,4.205,12,2.085,18,1.179,38,3.071,41,2.827,44,4.697,50,3.391,60,6.705,63,3.858,64,3.598,66,3.858,105,3.858,107,2.724,110,4.898,122,4.205,144,2.391,189,2.139,304,4.898,495,2.139,530,2.827,617,2.827,646,3.391,787,3.071,827,3.071,828,3.858,902,5.724,1006,3.391,1013,3.598,1065,4.205,1082,4.732,1083,4.732,1084,4.205,1085,4.205,1086,4.732,1087,4.732,1088,4.732,1089,4.205,1090,4.732,1091,4.732,1092,4.732,1093,5.724,1094,4.732,1095,4.732,1096,4.732]],["t/183",[3,1.544,4,1.083,5,0.801,6,1.12,8,0.651,9,1.492,10,1.863,14,1.003,15,2.202,16,2.32,18,1.365,19,2.101,20,3.896,22,3.996,23,1.295,24,2.639,30,2.16,31,2.462,32,1.799,33,2.202,43,2.202,44,1.934,45,2.202,46,3.727,47,1.863,52,1.934,55,1.754,82,1.792,88,2.988,92,1.503,111,2.462,131,2.877,135,2.462,140,0.984,172,2.476,196,1.717,199,2.606,216,1.134,223,1.863,300,3.237,325,2.639,334,2.202,353,2.32,378,1.863,400,2.639,434,2.462,522,3.839,584,2.639,620,2.639,624,2.877,640,3.996,702,2.877,704,3.996,746,2.462,975,1.636,1097,3.237,1098,3.237,1099,3.237,1100,3.237,1101,3.237,1102,4.902,1103,2.877,1104,3.237,1105,3.237,1106,3.237,1107,2.877,1108,3.237,1109,3.237,1110,2.639,1111,3.237,1112,3.237,1113,4.356,1114,3.237,1115,2.32,1116,3.237,1117,2.101,1118,2.877]],["t/185",[3,1.448,4,0.556,5,0.808,6,1.169,8,0.61,9,1.335,14,0.941,15,3.174,16,2.175,18,1.468,19,1.97,23,2.754,27,1.887,28,2.064,30,1.337,35,2.308,36,1.887,37,1.337,46,4.852,47,1.747,50,2.175,52,1.813,55,1.086,82,2.078,88,1.533,92,1.409,97,1.448,140,1.418,183,2.308,184,2.308,189,1.372,193,1.707,195,1.6,197,1.02,216,1.634,225,1.337,276,1.409,285,1.747,307,1.887,334,3.866,370,2.175,376,5.67,378,1.747,396,2.175,495,1.372,496,2.064,507,2.308,522,4.915,530,1.813,539,1.242,575,2.474,617,2.787,620,2.474,843,2.787,867,3.804,987,1.631,1103,2.697,1119,2.474,1120,3.035,1121,3.035,1122,2.474,1123,3.035,1124,3.344,1125,3.035,1126,3.344,1127,3.035,1128,3.035,1129,3.035,1130,4.666,1131,3.035,1132,4.146,1133,4.666,1134,3.035,1135,3.035,1136,3.035,1137,3.035]],["t/187",[5,0.872,6,0.788,8,1.278,9,0.818,18,0.85,44,2.773,51,1.697,63,3.784,70,3.012,72,3.827,88,2.345,93,3.529,95,3.119,96,3.119,99,2.885,114,3.62,136,1.773,140,1.41,165,2.495,172,2.345,192,1.994,224,2.277,225,2.045,261,1.773,317,2.885,415,3.326,416,5.305,422,3.784,500,3.012,519,3.157,578,3.529,748,3.529,844,3.326,910,3.784,1053,3.157,1110,3.784,1126,3.326,1138,4.641,1139,4.834,1140,4.124,1141,4.641,1142,4.641,1143,4.641,1144,3.529,1145,3.529]],["t/189",[4,1.48,5,0.836,6,0.982,82,2.115,193,1.732,194,2.234,195,1.984,196,2.576,197,1.944,200,2.685,201,2.07,202,3.11,203,2.162,204,3.215,205,2.162,206,3.33,207,2.76,208,2.615,244,3.597,396,4.146,786,3.456,1146,5.141]],["t/191",[4,1.345,5,0.852,6,0.809,18,1.345,72,2.337,82,2.687,114,3.003,115,3.883,118,3.622,128,3.883,144,2.406,193,1.716,194,1.966,195,1.634,196,2.267,197,1.6,201,1.704,202,2.56,203,1.78,204,2.647,205,1.78,206,2.742,207,2.272,208,2.153,244,2.961,276,2.211,396,3.413,406,3.883,786,2.845,892,4.401,1146,4.232,1147,3.883,1148,4.232,1149,4.763,1150,4.763,1151,4.763,1152,3.883,1153,4.763,1154,4.763]],["t/193",[4,1.148,5,0.764,6,0.606,8,0.718,18,0.654,62,2.22,82,1.306,88,1.804,97,1.703,99,3.279,114,2.448,136,1.364,140,1.085,144,1.804,171,2.911,172,1.804,193,1.815,194,1.906,195,1.225,196,1.251,197,1.2,201,1.278,202,1.92,203,1.334,204,1.985,205,1.334,206,2.055,207,1.703,208,1.614,229,1.614,258,2.911,276,3.215,358,2.715,397,3.588,416,2.429,451,3.173,457,2.715,459,3.173,548,4.3,576,2.715,820,2.911,827,2.317,830,2.715,831,2.911,892,3.588,1048,2.559,1049,2.429,1115,2.559,1145,2.715,1147,2.911,1148,3.173,1152,2.911,1155,3.571,1156,3.173,1157,6.927,1158,5.275,1159,3.571,1160,4.687,1161,5.275,1162,3.571,1163,3.571,1164,3.571,1165,3.571,1166,3.571,1167,3.571,1168,3.571,1169,3.571,1170,3.571,1171,3.571,1172,3.173]],["t/196",[4,0.505,5,0.285,6,0.468,9,0.764,18,0.979,20,3.612,23,1.103,30,1.215,36,1.715,47,1.588,51,1.009,56,1.79,72,1.354,81,2.249,85,2.451,136,1.054,138,3.532,141,1.79,172,1.394,185,3.105,193,1.792,196,1.518,229,1.959,276,2.011,285,1.588,307,2.693,311,2.249,317,1.715,334,1.876,353,1.977,361,1.648,418,1.648,421,1.977,438,1.715,521,2.098,543,1.715,673,2.249,682,2.451,683,2.249,684,2.249,688,2.249,689,2.451,697,2.451,699,2.451,704,4.361,707,1.483,746,2.098,748,2.098,795,1.977,796,2.693,856,2.451,971,2.249,982,2.451,989,3.532,998,2.249,1028,2.451,1051,2.249,1089,2.451,1113,4.754,1115,3.105,1122,2.249,1126,1.977,1156,2.451,1173,2.759,1174,2.759,1175,2.759,1176,2.759,1177,2.759,1178,2.759,1179,2.759,1180,2.759,1181,2.759,1182,2.759,1183,2.759,1184,4.333,1185,2.759,1186,2.759,1187,4.333,1188,2.759,1189,2.451,1190,4.333,1191,2.759,1192,2.759,1193,2.759,1194,2.759,1195,2.759,1196,2.759,1197,5.386,1198,2.759,1199,2.759,1200,2.759,1201,2.759,1202,2.759,1203,2.759,1204,4.333,1205,2.759,1206,4.333,1207,5.35,1208,4.333,1209,4.333,1210,4.333,1211,2.759,1212,3.294,1213,2.759,1214,2.759,1215,2.759,1216,2.759,1217,2.759,1218,2.759,1219,2.759]],["t/198",[5,0.884,6,0.612,8,0.725,9,0.636,18,0.66,31,2.742,32,2.004,33,2.453,38,2.34,49,2.742,71,3.205,82,1.318,95,2.607,101,5.143,140,1.096,172,1.822,181,3.205,193,1.464,196,1.263,207,2.534,208,2.402,224,2.607,229,1.63,335,2.242,368,1.769,375,1.72,404,2.076,415,3.808,465,3.808,541,2.742,543,3.922,578,2.742,649,4.331,650,4.331,654,4.721,663,6.593,664,3.205,779,2.453,787,2.34,799,2.94,1006,2.584,1117,2.34,1119,2.94,1220,3.606,1221,3.606,1222,3.205,1223,3.606,1224,5.313,1225,3.606,1226,5.313,1227,3.606,1228,3.606,1229,6.308,1230,3.606,1231,5.313,1232,7.762,1233,5.313,1234,6.308,1235,3.606,1236,3.606,1237,3.606,1238,3.205,1239,3.205,1240,3.606,1241,3.205]],["t/200",[4,1.013,5,0.785,6,0.399,8,0.472,18,0.43,19,1.525,23,1.524,48,1.403,70,1.525,72,1.87,92,1.769,95,1.87,96,1.153,99,1.46,105,1.915,114,1.09,118,2.898,141,1.525,144,1.187,193,1.851,194,1.158,195,0.806,197,1.859,207,2.293,208,2.173,216,0.823,218,1.263,229,1.062,240,1.352,241,1.915,261,0.898,274,1.035,276,3.023,286,2.232,304,3.656,375,1.121,429,1.46,468,1.598,494,1.683,495,1.062,516,2.087,524,1.915,536,1.525,576,1.786,608,1.786,646,1.683,648,5.403,673,1.915,681,1.915,735,4.079,760,4.272,826,1.915,835,1.915,859,2.087,892,3.763,986,2.087,1006,2.731,1033,2.087,1045,2.087,1077,4.915,1084,2.087,1110,1.915,1140,2.087,1147,1.915,1152,1.915,1172,4.272,1222,2.087,1242,4.808,1243,2.349,1244,3.811,1245,2.349,1246,3.811,1247,3.811,1248,2.349,1249,6.859,1250,2.349,1251,2.349,1252,2.349,1253,2.349,1254,2.349,1255,2.349,1256,4.808,1257,3.811,1258,3.811,1259,3.811,1260,1.786,1261,2.349,1262,2.349,1263,2.349,1264,2.087,1265,2.349,1266,1.915,1267,2.349,1268,2.349,1269,2.349,1270,2.349,1271,2.349,1272,2.349,1273,2.349]],["t/202",[5,0.753,53,4.642,193,1.815,197,2.446,276,3.725,365,3.696,423,4.33,494,4.081,530,3.402,711,4.081,712,5.06,715,5.06,877,5.06,878,6.469,1076,4.081,1274,5.06,1275,5.695,1276,5.695,1277,5.695,1278,5.695,1279,5.695,1280,5.695]],["t/205",[3,2.212,4,1.035,5,0.859,6,1.411,8,1.136,9,1.278,12,1.326,14,1.752,17,2.289,18,1.035,21,2.454,24,2.454,26,2.047,30,2.043,33,2.047,51,1.1,65,1.567,88,1.521,95,1.477,97,1.436,110,3.525,123,2.454,140,0.915,141,3.009,171,2.454,172,1.521,189,1.361,193,1.611,194,2.202,195,1.59,196,1.624,197,1.558,210,1.032,214,2.043,225,2.043,256,2.157,261,1.15,274,1.326,283,2.289,307,2.882,342,2.157,352,1.871,361,1.798,368,1.477,496,2.047,539,1.232,621,3.525,623,2.674,685,3.779,707,1.618,786,1.798,841,2.289,975,2.857,987,2.492,1039,2.674,1048,2.157,1049,3.153,1050,4.12,1117,1.953,1124,2.157,1281,4.12,1282,2.674,1283,3.01,1284,3.01,1285,4.636,1286,4.636,1287,3.01,1288,3.01,1289,3.01,1290,3.01,1291,3.01,1292,4.12,1293,2.674,1294,2.454,1295,2.454,1296,3.01,1297,3.01,1298,3.01,1299,1.673,1300,3.01]],["t/207",[2,3.305,3,2.2,4,1.159,5,0.747,6,1.075,9,0.813,11,3.137,12,2.789,18,1.159,37,2.032,38,2.993,51,2.314,73,3.76,78,2.2,88,2.33,104,2.867,136,1.762,178,4.536,183,3.507,184,3.507,185,3.305,188,2.563,261,1.762,274,2.032,300,2.263,317,2.867,378,2.655,418,2.755,455,3.305,495,2.085,509,3.305,690,3.305,707,2.479,717,3.305,735,2.479,750,2.402,775,3.137,975,3.198,987,2.479,1053,3.137,1299,2.563,1301,5.625,1302,4.098,1303,4.098,1304,4.098,1305,4.098,1306,3.507,1307,4.612,1308,3.76,1309,4.098,1310,4.098,1311,4.612,1312,4.612,1313,4.612]],["t/209",[4,0.996,5,0.731,6,1.2,9,1.246,11,3.7,12,2.396,14,1.686,16,3.898,17,4.136,18,0.996,22,4.434,26,3.7,30,2.396,92,2.525,94,4.833,141,3.53,302,3.131,352,3.382,378,3.131,379,5.374,450,3.928,725,3.53,796,3.382,975,3.57,987,4.22,1036,4.434,1049,3.7,1292,4.833,1314,5.439,1315,5.439,1316,5.439,1317,5.439]],["t/211",[5,0.641,8,0.898,18,1.302,41,2.671,51,1.634,55,1.6,72,2.193,78,2.132,82,2.265,83,3.644,88,2.258,95,2.193,107,2.573,133,3.701,136,1.708,140,1.358,147,3.972,159,3.33,194,1.358,210,1.533,225,1.97,358,3.399,368,4.196,411,4.021,667,3.972,709,3.204,843,2.671,844,5.095,910,3.644,930,3.972,953,3.972,1076,5.095,1144,3.399,1318,2.901,1319,3.204,1320,4.47,1321,5.505,1322,4.47,1323,5.505,1324,3.972,1325,3.972,1326,3.644,1327,4.47,1328,3.399,1329,3.399,1330,3.399,1331,4.47,1332,4.47,1333,3.972,1334,3.972]],["t/213",[5,0.627,8,1.016,12,1.486,18,1.387,32,1.874,51,1.233,55,2.169,70,3.28,82,2.217,83,2.749,88,1.704,96,1.655,99,2.097,114,2.346,118,2.564,133,2.015,140,2.386,149,2.097,159,2.717,172,1.704,174,2.015,178,2.417,188,1.874,192,1.449,196,1.181,200,1.565,208,1.525,210,2.08,216,1.771,225,1.486,229,2.285,261,2.316,341,2.997,349,2.015,361,3.02,362,2.189,363,4.943,368,3.853,370,2.417,373,2.997,404,1.941,407,2.997,408,2.417,411,3.935,417,1.941,422,2.749,494,2.417,500,3.28,519,2.294,544,2.749,547,2.749,576,2.564,640,2.749,641,2.997,681,2.749,717,2.417,787,2.189,846,2.294,1076,2.417,1115,2.417,1212,2.564,1294,2.749,1306,2.564,1334,2.997,1335,2.997,1336,3.372,1337,2.346,1338,3.372,1339,3.372,1340,3.372,1341,2.417,1342,2.997,1343,3.372,1344,3.372,1345,3.372,1346,3.372,1347,3.372,1348,3.372,1349,3.372,1350,3.372,1351,2.997,1352,3.372]],["t/215",[2,3.678,5,0.531,6,0.871,8,1.031,9,0.905,12,2.261,15,3.491,18,0.94,37,2.261,38,4.415,56,3.331,72,2.518,136,1.961,137,3.331,140,2.469,144,2.593,150,3.903,159,2.759,368,3.744,495,2.32,707,2.759,843,3.066,954,4.561,971,4.184,987,2.759,1002,4.184,1038,4.184,1055,4.561,1266,4.184,1306,3.903,1337,2.382,1353,5.132,1354,5.132,1355,4.561,1356,5.132,1357,5.132,1358,4.561,1359,4.561,1360,5.132,1361,4.561,1362,5.132,1363,5.132]],["t/217",[3,2.069,4,1.111,5,0.448,8,1.219,18,1.111,21,3.536,23,1.734,27,2.696,41,2.591,78,2.069,79,2.815,96,2.128,136,1.657,146,2.591,154,3.536,157,2.815,161,2.894,165,2.331,172,2.191,193,1.573,195,1.488,210,1.488,225,1.911,271,2.696,276,2.013,286,2.013,345,2.815,364,3.108,368,2.128,433,5.013,467,3.298,470,3.536,539,1.775,717,3.108,787,2.815,975,2.191,987,3.261,1117,2.815,1124,3.108,1212,4.613,1326,3.536,1337,2.013,1364,3.854,1365,3.536,1366,4.337,1367,4.337,1368,4.337,1369,6.732,1370,4.337,1371,6.066,1372,3.854,1373,3.298,1374,4.337,1375,4.337,1376,4.337,1377,4.337,1378,4.337,1379,4.337]],["t/219",[6,0.974,9,1.29,20,2.738,26,3.904,30,2.529,62,4.548,127,4.679,140,1.744,168,4.364,174,3.429,199,2.529,210,1.969,261,2.795,307,3.568,443,5.1,457,4.364,458,5.1,719,3.725,924,4.679,1044,4.679,1197,5.1,1380,5.74,1381,5.1,1382,4.679,1383,5.1,1384,5.74,1385,5.1,1386,5.74,1387,5.74,1388,5.74]],["t/221",[18,1.48,37,2.549,96,2.839,136,2.21,140,2.234,216,2.027,222,2.549,286,3.413,345,3.755,368,3.966,411,4.772,417,3.33,485,4.399,975,2.923,987,3.11,992,4.146,1321,6.534,1335,5.141,1341,4.146,1381,5.141,1389,5.141,1390,5.141,1391,5.785,1392,5.141]],["t/223",[6,1.014,9,1.054,27,3.715,30,2.633,52,3.57,55,2.138,72,2.932,194,1.816,216,2.093,352,3.715,368,2.932,372,4.871,539,3.072,543,3.715,614,4.064,617,3.57,657,4.282,975,3.791,987,3.212,1052,5.31,1117,3.878,1294,4.871,1325,5.31,1390,5.31,1393,5.31,1394,4.282]],["t/225",[4,1.213,5,0.685,6,1.125,261,3.056,306,4.75,368,3.252,495,2.996,719,4.302,992,4.75,1260,5.04,1299,3.684,1394,4.75,1395,5.89,1396,6.628,1397,5.403]],["t/227",[3,3.051,4,1.433,5,0.809,6,1.436,9,1.128,10,3.681,18,1.171,30,2.818,62,3.976,730,4.583,1337,2.969,1382,5.214,1398,6.395,1399,6.395,1400,5.683,1401,6.395]],["t/229",[4,0.776,5,0.617,8,1.507,11,2.881,26,2.881,36,2.634,72,2.078,92,1.966,93,4.537,97,2.021,130,3.453,146,2.531,174,2.531,193,1.479,210,2.047,219,2.438,345,2.749,349,4.722,353,4.276,354,3.453,362,5.129,375,2.021,450,4.557,464,3.764,500,3.872,617,3.565,631,3.453,707,3.207,1038,3.453,1076,3.036,1126,3.036,1318,3.872,1319,3.036,1337,3.206,1359,3.764,1389,5.302,1395,3.764,1402,4.236,1403,4.236,1404,4.236,1405,4.236,1406,5.967,1407,5.967,1408,5.967,1409,4.236]],["t/231",[4,1.206,5,0.824,6,1.118,8,0.983,9,0.862,12,2.155,18,1.364,23,1.956,72,2.4,82,2.408,88,2.471,92,2.27,95,3.232,104,4.095,107,4.933,110,3.719,134,4.346,216,1.713,286,2.27,368,2.4,405,4.346,450,2.718,608,3.719,660,4.346,725,3.174,748,3.719,824,5.854,1337,3.058,1394,3.505,1410,4.891,1411,4.346,1412,4.346,1413,4.346,1414,4.346,1415,4.891,1416,4.346,1417,4.891,1418,4.891]],["t/233",[12,2.23,51,1.85,104,3.146,161,2.414,163,2.813,193,1.77,194,1.538,195,1.736,201,1.811,203,1.891,204,2.813,205,1.891,229,2.288,276,3.129,348,4.126,349,3.024,350,4.126,378,2.913,379,3.848,423,5.125,433,3.627,447,4.497,450,3.746,742,4.126,1036,4.126,1337,2.349,1419,4.126,1420,5.061,1421,5.989,1422,5.061,1423,5.061,1424,5.061,1425,5.061,1426,5.061,1427,5.061,1428,4.497,1429,5.061,1430,5.061,1431,5.061]],["t/235",[2,4.992,3,2.538,4,1.275,5,0.55,6,0.903,18,0.974,36,3.307,38,3.453,51,2.547,52,4.162,140,2.599,210,2.389,279,4.727,353,3.812,368,2.61,404,3.062,408,3.812,467,4.045,657,3.812,725,3.453,992,3.812,1053,3.619,1394,3.812,1397,4.337,1432,5.32,1433,4.337,1434,5.32,1435,5.32,1436,5.32,1437,5.32,1438,5.32,1439,5.32,1440,5.32,1441,5.32]],["t/237",[3,3.508,4,1.346,5,0.598,6,1.248,9,1.02,11,3.935,17,5.591,18,1.059,26,3.935,58,3.215,78,2.76,193,1.141,265,4.716,317,3.597,318,4.716,725,3.755,730,5.269,975,2.923,1299,3.215,1382,4.716,1393,5.141,1442,7.353,1443,7.353,1444,5.785,1445,5.785]],["t/239",[4,1.305,5,0.843,6,1.103,8,1.305,23,1.517,72,1.862,88,1.917,92,1.761,95,1.862,103,1.715,107,3.739,114,3.015,115,3.093,165,2.04,193,1.088,194,2.302,196,1.329,201,1.358,203,1.418,205,1.418,235,2.04,261,2.107,345,2.462,378,2.184,418,2.267,421,2.719,435,2.359,437,2.462,512,2.885,535,3.093,536,3.579,614,3.751,657,2.719,658,2.885,795,2.719,966,3.372,1117,2.462,1124,2.719,1126,3.952,1139,2.885,1189,4.9,1241,4.9,1260,2.885,1295,3.093,1299,2.109,1308,3.093,1328,2.885,1329,2.885,1330,4.94,1337,2.56,1341,2.719,1373,4.193,1416,3.372,1446,3.794,1447,3.372,1448,3.794,1449,3.794,1450,3.794,1451,3.093,1452,3.794,1453,3.794,1454,3.794,1455,3.372,1456,3.794,1457,3.794,1458,3.794]],["t/242",[3,2.257,4,1.341,5,0.666,6,1.335,8,1.295,9,1.136,14,2.27,51,2.678,55,1.693,57,3.219,78,2.257,82,1.73,88,2.391,95,2.322,149,2.942,159,2.544,163,2.63,165,2.544,214,2.085,247,2.827,271,2.942,274,2.085,323,3.598,345,3.071,411,3.071,539,1.937,685,3.858,717,3.391,735,2.544,750,2.464,796,2.942,975,2.391,987,2.544,1049,3.219,1266,3.858,1281,4.205,1282,6.508,1299,2.63,1337,2.196,1459,2.391,1460,4.732,1461,4.205,1462,4.732,1463,4.732,1464,4.732,1465,4.205]],["t/244",[4,1.01,5,0.392,6,0.936,8,0.763,9,1.145,11,2.581,12,2.43,18,0.695,19,2.462,49,2.885,57,2.581,58,2.109,62,2.359,78,1.81,79,2.462,96,1.862,100,2.885,109,3.372,129,3.372,140,1.153,152,3.372,158,3.372,159,2.964,161,1.81,162,3.751,168,2.885,178,3.952,183,2.885,184,2.885,185,2.719,189,1.715,194,1.153,225,1.672,274,1.672,304,2.885,358,2.885,400,3.093,418,2.267,509,2.719,539,1.553,582,3.093,608,2.885,677,3.372,707,2.04,719,2.462,720,3.372,795,2.719,841,4.193,1001,3.093,1030,3.372,1260,2.885,1299,3.065,1301,3.372,1302,3.372,1303,3.372,1304,3.372,1305,3.372,1306,2.885,1309,4.9,1310,4.9,1324,3.372,1337,2.56,1355,3.372,1358,3.372,1397,3.093,1400,3.372,1414,3.372,1419,3.093,1455,3.372,1459,1.917,1466,3.794,1467,3.794,1468,3.794,1469,3.372,1470,3.794,1471,3.372,1472,3.794,1473,3.093,1474,3.794,1475,3.794,1476,3.794,1477,3.794,1478,3.794,1479,3.794,1480,3.794]],["t/246",[539,3.016,1459,3.721,1481,6.005,1482,7.366,1483,6.005]],["t/248",[4,0.818,8,1.429,12,1.97,37,2.729,51,2.265,55,1.6,78,2.132,82,1.634,92,2.075,96,3.04,97,2.955,114,2.075,128,3.644,136,2.367,140,1.882,144,2.258,148,3.644,191,3.644,195,1.533,216,2.17,225,1.97,247,2.671,256,3.204,261,1.708,269,3.972,274,1.97,310,3.644,335,3.851,412,3.644,435,2.779,474,3.399,478,3.972,562,3.972,578,3.399,692,3.972,779,3.041,841,3.399,843,2.671,846,3.041,1011,3.644,1326,3.644,1337,2.876,1351,3.972,1364,3.972,1369,3.972,1473,3.644,1484,3.972,1485,3.972,1486,4.47,1487,3.972,1488,4.47,1489,4.47,1490,4.47,1491,4.47,1492,4.47,1493,4.47,1494,4.47,1495,4.47]],["t/250",[539,3.016,645,5.601,1459,3.721,1483,6.005,1496,7.366]],["t/252",[3,2.654,5,0.575,6,0.945,9,1.399,10,3.203,18,1.019,35,4.231,55,1.991,57,3.785,68,4.536,194,1.691,225,2.451,261,2.74,352,3.459,361,3.324,509,3.987,522,3.611,539,2.278,686,4.944,719,3.611,975,2.811,1003,4.536,1006,3.987,1115,3.987,1119,4.536,1299,4.411,1361,4.944,1497,5.564,1498,5.564,1499,4.944,1500,4.944,1501,5.564]],["t/254",[539,3.016,1459,3.721,1481,6.005,1483,6.005,1502,7.366]],["t/256",[4,1.011,5,0.571,6,0.937,8,1.11,12,2.433,18,1.011,51,3.165,82,2.019,140,2.169,141,3.584,194,1.678,247,3.299,248,4.907,261,2.11,306,3.957,345,4.632,364,3.957,378,3.178,379,4.199,411,3.584,450,3.069,775,3.756,818,4.907,975,2.79,1002,5.818,1117,3.584,1124,3.957,1421,4.907,1484,4.907,1503,5.522,1504,5.522]],["t/258",[539,3.016,1459,3.721,1461,6.546,1505,7.366,1506,5.601]],["t/260",[4,1.36,5,0.608,6,1.261,8,1.181,9,1.036,10,3.384,12,2.59,18,1.076,23,2.351,51,2.716,78,2.804,82,2.716,100,5.648,149,3.655,172,2.97,286,2.729,300,2.884,335,3.655,364,4.213,450,3.267,519,3.999,796,3.655,1333,5.224,1507,4.47,1508,5.224]],["t/262",[539,3.046,1459,3.76,1506,5.659,1509,7.442]],["t/264",[3,2.021,4,0.776,5,0.714,6,1.273,9,1.322,10,2.438,18,0.776,19,2.749,27,2.634,39,3.764,43,2.881,45,4.058,51,2.741,55,1.516,56,2.749,95,2.078,97,2.021,104,2.634,144,2.14,261,1.618,263,3.764,285,2.438,323,3.221,398,3.453,411,2.749,416,2.881,495,1.915,539,3.235,584,3.453,846,2.881,975,2.14,1003,3.453,1122,3.453,1238,3.764,1293,3.764,1299,2.354,1394,3.036,1447,3.764,1465,3.764,1499,5.302,1500,3.764,1506,3.221,1510,4.236,1511,4.236,1512,4.236,1513,3.764,1514,4.236,1515,4.236,1516,4.236,1517,4.236,1518,4.236,1519,4.236,1520,4.236,1521,4.236,1522,4.236,1523,4.236,1524,4.236,1525,4.236,1526,4.236,1527,4.236,1528,4.236]],["t/266",[299,4.781,539,3.016,1459,3.721,1506,5.601,1529,7.366]],["t/268",[4,1.161,6,1.076,8,1.274,9,1.118,10,3.649,37,2.793,51,2.846,78,3.024,140,1.926,144,3.203,149,3.941,237,5.633,247,3.787,300,3.111,335,3.941,500,5.053,1318,4.114,1507,4.821,1530,6.34]],["t/270",[539,3.016,1160,6.546,1459,3.721,1531,7.366,1532,6.005]],["t/272",[4,0.894,5,0.61,8,0.982,18,1.08,30,2.152,37,3.117,41,1.926,45,2.192,51,2.407,55,1.153,57,2.192,62,2.004,95,1.581,96,3.23,98,2.864,114,1.496,140,2.149,144,1.628,149,2.004,154,2.627,159,1.733,161,1.537,216,2.066,218,1.733,222,1.42,235,1.733,239,1.628,261,1.231,271,2.004,286,2.738,305,3.715,314,2.451,338,2.451,349,1.926,362,2.092,372,2.627,417,1.855,436,2.451,485,2.451,500,4.272,502,2.864,504,2.864,528,2.864,538,2.864,542,2.864,544,2.627,547,2.627,549,2.864,551,2.864,553,2.864,558,2.864,560,2.864,563,2.864,566,2.864,568,2.864,586,2.627,587,2.627,588,2.627,617,1.926,619,2.864,645,2.451,719,2.092,735,2.626,740,3.982,750,3.072,987,1.733,992,2.31,1047,2.864,1093,2.864,1299,3.278,1318,3.17,1319,2.31,1337,3.284,1341,2.31,1383,2.864,1392,2.864,1533,3.223,1534,2.627,1535,4.885,1536,4.885,1537,3.223,1538,3.223,1539,3.223,1540,3.223,1541,3.223,1542,3.223,1543,3.223,1544,3.223,1545,3.223,1546,3.223]],["t/274",[539,3.046,1459,3.76,1532,6.067,1547,6.613]],["t/276",[5,0.633,36,3.809,51,3.034,114,2.844,140,1.861,201,2.192,203,2.289,205,2.289,222,3.656,317,3.809,417,3.526,435,3.809,437,3.976,496,4.167,500,4.947,799,4.994,892,5.185,1051,4.994,1342,5.444]],["t/278",[1459,3.76,1532,6.067,1548,7.442,1549,7.442]],["t/280",[5,0.716,6,1.017,8,0.856,9,1.325,18,1.097,37,1.877,45,2.898,47,2.453,51,2.19,72,2.091,96,2.94,136,1.628,140,1.295,146,2.546,149,2.649,186,3.474,205,1.592,222,1.877,300,2.091,311,3.474,449,3.474,450,2.368,471,3.474,474,4.556,495,1.926,496,2.898,507,3.24,519,5.113,582,3.474,617,2.546,649,4.884,659,3.786,757,3.786,775,2.898,779,4.713,980,3.786,1001,3.474,1053,2.898,1107,3.786,1118,3.786,1132,3.786,1274,3.786,1318,2.765,1365,3.474,1372,3.786,1385,3.786,1473,4.884,1507,3.24,1508,3.786,1550,4.261,1551,4.261,1552,4.261,1553,4.261,1554,4.261,1555,4.261,1556,4.261,1557,4.261,1558,4.261,1559,4.261,1560,4.261]],["t/282",[539,3.016,1459,3.721,1561,7.366,1562,7.366,1563,6.005]],["t/284",[4,1.551,5,0.792,6,1.3,9,1.205,20,3.26,30,2.277,32,2.873,37,3.011,92,2.399,96,2.536,107,2.975,123,4.214,136,1.975,231,2.873,285,2.975,421,3.704,438,3.213,468,3.516,474,3.93,533,4.593,645,5.197,779,3.516,899,4.214,924,4.214,975,2.611,979,4.214,1144,3.93,1337,3.173,1433,4.214,1534,4.214,1564,5.169,1565,5.169,1566,5.169,1567,5.169]],["t/286",[539,3.016,1459,3.721,1547,6.546,1563,6.005,1568,7.366]],["t/288",[4,0.664,5,0.551,6,1.074,8,1.271,9,1.115,10,3.642,27,2.253,30,1.597,32,3.516,37,2.787,41,2.165,51,2.718,52,2.165,65,1.887,66,2.955,78,1.729,82,1.95,92,1.682,96,1.778,107,3.069,136,1.385,140,1.62,149,2.253,201,1.297,203,1.354,205,1.993,210,1.243,244,3.315,285,2.086,300,2.616,335,2.253,342,2.597,349,2.165,361,2.165,362,2.352,438,2.253,450,2.014,456,3.221,457,2.756,463,3.221,470,2.955,477,2.955,482,3.221,483,3.221,495,1.638,631,2.955,735,1.948,750,1.887,775,2.465,843,2.165,987,1.948,999,2.955,1085,3.221,1139,2.756,1144,4.811,1239,3.221,1264,3.221,1318,2.352,1319,2.597,1328,2.756,1329,2.756,1330,2.756,1337,2.475,1365,2.955,1373,2.756,1451,2.955,1469,3.221,1471,3.221,1487,3.221,1507,2.756,1534,2.955,1569,3.221,1570,3.624,1571,5.333,1572,5.333,1573,3.624,1574,3.624,1575,3.624,1576,3.624]],["t/290",[4,0.844,5,0.477,6,0.783,9,0.813,10,2.655,12,2.032,23,2.531,48,2.755,51,2.314,55,2.265,65,3.296,82,1.686,96,2.263,97,2.2,104,2.867,107,3.643,108,2.563,133,2.755,135,4.813,136,1.762,140,1.401,144,3.198,201,1.65,203,1.723,216,1.616,222,2.032,300,2.263,305,3.507,349,2.755,362,2.993,418,2.755,449,3.76,450,2.563,467,3.507,477,3.76,535,3.76,614,4.305,690,4.536,707,3.403,786,2.755,1145,3.507,1212,3.507,1318,2.993,1319,5.179,1337,2.141,1341,3.305,1373,3.507,1411,4.098,1412,4.098,1413,4.098,1485,4.098,1577,4.612]],["t/292",[2,4.39,18,1.122,48,3.66,65,3.19,138,4.994,140,1.861,170,4.994,222,3.358,368,3.006,651,5.444,725,3.976,795,5.463,1053,4.167,1337,2.844,1433,4.994,1578,6.126,1579,6.126,1580,6.126,1581,6.126,1582,6.126,1583,6.126,1584,6.126,1585,6.126]],["t/294",[55,2.393,57,4.55,104,4.159,144,4.064,148,5.453,182,5.086,300,3.282,575,5.453,614,4.55,1029,5.944,1145,5.086,1299,3.718,1419,6.558]],["t/296",[1459,3.76,1481,6.067,1563,6.067,1586,7.442]],["t/298",[6,1.261,9,1.31,27,3.655,32,3.267,51,2.977,140,2.681,175,6.056,210,2.016,505,6.601,552,5.648,796,5.063,1323,6.601,1428,5.224,1569,5.224,1587,5.879,1588,5.879]],["t/300",[4,0.946,5,0.792,6,1.16,8,1.039,9,0.911,18,0.946,23,2.067,37,3.011,78,2.466,92,2.399,107,2.975,140,1.571,162,3.516,165,2.779,194,2.476,210,1.773,222,2.277,235,2.779,300,2.536,361,3.088,418,3.088,433,3.704,435,3.213,437,3.355,725,3.355,1139,5.197,1295,4.214,1308,4.214,1328,3.93,1329,3.93,1330,5.197,1337,3.173,1451,4.214,1513,4.593,1589,5.169,1590,5.169,1591,5.169]],["t/302",[3,3.586,415,5.388,989,6.129]]],"invertedIndex":[["",{"_index":193,"t":{"8":{"position":[[79,1],[115,1],[209,1],[326,2],[374,2],[436,1],[495,2],[506,1],[515,1],[618,1],[693,2],[777,2],[839,1],[898,2],[909,1]]},"13":{"position":[[163,1],[252,1],[265,1],[282,1]]},"17":{"position":[[78,1],[114,1],[207,1],[324,2],[372,1],[393,2],[404,1],[413,1],[515,1],[590,2],[674,1],[695,2],[706,1]]},"22":{"position":[[264,1],[277,1],[294,1]]},"26":{"position":[[77,1],[113,1],[205,1],[322,2],[370,1],[390,2],[401,1],[410,1],[511,1],[586,2],[670,1],[690,2],[701,1]]},"31":{"position":[[41,2],[159,2],[288,2],[460,2],[582,2]]},"33":{"position":[[161,1],[311,1],[324,1],[341,1]]},"35":{"position":[[154,1],[326,1],[348,1],[400,2],[403,1],[405,2],[484,2],[564,2],[575,1],[584,1],[769,1],[791,1],[845,2],[848,1],[850,2],[929,2],[1009,2],[1020,1]]},"39":{"position":[[85,1],[223,1],[225,1],[314,6],[346,1],[372,1],[374,2],[392,1],[512,2],[560,1],[584,2],[595,1],[604,1],[760,1],[762,1],[851,6],[883,1],[909,1],[911,2],[929,1],[1007,2],[1091,1],[1115,2],[1126,1]]},"49":{"position":[[64,1],[159,1],[231,1],[240,1],[353,2],[435,2],[438,2],[441,1],[458,1],[539,1],[548,1],[619,2],[737,2],[740,2],[743,1]]},"51":{"position":[[114,1]]},"55":{"position":[[256,1],[265,1],[467,1]]},"59":{"position":[[107,1],[254,1],[386,1],[416,1],[577,1],[692,1],[725,1],[892,1],[924,1],[1089,1],[1127,1],[1309,1]]},"61":{"position":[[28,2],[101,2],[264,2],[348,2],[588,2],[664,2],[686,2],[784,2],[1062,2],[1343,2],[1597,2],[1820,2],[2233,2],[2455,2],[2571,2],[2877,2],[3212,2],[3512,2],[3612,2],[3870,2],[4127,2],[4387,2],[4649,2],[4769,2],[5237,2],[5364,2],[5459,2],[5563,2],[5661,2],[5787,2],[6187,2],[6322,2],[6458,2],[6874,2],[7016,2],[7145,2],[7550,2],[7683,2],[7776,2],[7869,2],[8034,1],[8056,2],[8187,2],[8323,2]]},"63":{"position":[[69,1],[571,1],[677,1],[709,3],[713,1],[772,1],[844,1],[887,3],[891,1],[1049,1],[1121,1],[1160,3],[1164,1]]},"65":{"position":[[93,1],[250,1],[265,1],[301,1],[318,2],[321,1],[349,2],[352,2],[355,1],[357,2],[373,3],[377,2],[380,4],[429,3],[433,3],[437,1],[446,1],[621,1],[636,1],[672,1],[689,2],[692,1],[720,2],[723,2],[726,1],[728,2],[744,3],[748,2],[751,4],[800,3],[804,3],[808,1],[856,1],[1282,1]]},"69":{"position":[[241,1],[250,1],[266,1],[268,2],[316,2],[345,1],[362,2],[365,1]]},"73":{"position":[[67,1],[103,1],[185,1],[302,2],[350,1],[407,1],[430,2],[451,1],[460,1],[551,1],[626,2],[710,1],[767,1],[790,2],[811,1]]},"76":{"position":[[412,1],[425,1],[627,1],[674,1],[975,1],[988,1]]},"78":{"position":[[25,2],[108,2],[199,2],[287,2]]},"80":{"position":[[151,1]]},"82":{"position":[[144,1],[312,1],[330,1],[371,1],[384,2],[387,1],[438,2],[441,3],[463,1],[480,2],[483,1],[519,2],[522,4],[534,2],[628,2],[690,4],[695,1],[704,1],[885,1],[903,1],[946,1],[959,2],[962,1],[1015,2],[1018,3],[1040,1],[1057,2],[1060,1],[1096,2],[1099,4],[1111,2],[1205,2],[1267,4],[1272,1]]},"86":{"position":[[78,1],[114,1],[207,1],[324,2],[372,1],[393,2],[404,1],[413,1],[515,1],[590,2],[674,1],[695,2],[706,1]]},"91":{"position":[[162,1],[261,1],[274,1],[291,1]]},"95":{"position":[[66,1],[102,1],[215,1],[249,1],[391,2],[439,1],[452,2],[455,1],[523,2],[580,1],[589,1],[711,1],[745,1],[845,2],[929,1],[942,2],[945,1],[1013,2],[1070,1]]},"98":{"position":[[17,1],[26,1],[36,1],[44,1],[55,1],[68,1],[82,1],[98,1],[115,1],[476,1],[488,1]]},"100":{"position":[[26,2],[95,2]]},"102":{"position":[[150,1]]},"104":{"position":[[143,1],[299,1],[316,1],[357,2],[360,1],[396,2],[489,1],[516,1],[525,1],[694,1],[711,1],[754,2],[757,1],[793,2],[886,1],[913,1]]},"108":{"position":[[73,1],[109,1],[197,1],[314,2],[362,1],[378,2],[389,1],[398,1],[495,1],[570,2],[654,1],[670,2],[681,1]]},"111":{"position":[[181,1],[192,1]]},"113":{"position":[[123,1],[136,1],[153,1]]},"117":{"position":[[131,1],[333,1],[335,1],[374,1],[433,1],[450,1],[452,2],[485,1],[487,1],[525,1],[574,1],[576,2],[594,1],[701,2],[749,1],[826,2],[847,1],[856,1],[1076,1],[1078,1],[1117,1],[1176,1],[1193,1],[1195,2],[1228,1],[1230,1],[1268,1],[1317,1],[1319,2],[1337,1],[1415,2],[1499,1],[1576,2],[1597,1]]},"130":{"position":[[657,1],[678,1]]},"132":{"position":[[101,1],[184,1],[261,1],[338,1],[441,1],[564,1]]},"134":{"position":[[93,1],[217,1],[300,2],[303,2],[453,1],[508,2],[511,2],[635,1],[752,2],[755,2],[925,1],[1137,1],[1293,1],[1413,1],[1527,1],[1668,1],[1779,1],[1824,1],[1941,1],[2178,1],[2214,1],[2237,1],[2528,1],[2630,1],[2774,1]]},"136":{"position":[[219,1],[235,2],[261,1],[288,3],[305,1],[322,1],[331,1],[431,2],[481,1],[586,2],[589,2],[599,2],[602,1]]},"138":{"position":[[76,2],[99,1],[129,1],[131,2],[212,2],[269,2],[288,1],[318,1],[320,2],[401,2],[455,2],[508,2],[527,1],[557,1],[559,2],[728,2],[828,2],[933,2],[1041,1],[1055,1],[1071,1]]},"142":{"position":[[155,1],[164,1],[171,3],[175,1],[195,2],[205,2],[208,1],[236,1],[259,1],[285,1],[287,2],[290,2],[293,1],[314,1],[332,2],[381,1],[450,1],[459,1],[466,3],[470,1],[490,2],[500,2],[503,1],[531,1],[554,1],[580,1],[582,2],[585,2],[588,1],[609,1],[627,2],[676,1],[904,1],[913,1],[946,3],[950,2],[970,3],[974,2],[993,2],[1011,2],[1014,1],[1042,1],[1067,1],[1093,1],[1095,2],[1098,2],[1101,1],[1125,1],[1165,1],[1180,2],[1229,1],[1311,1],[1320,1],[1353,3],[1357,2],[1377,3],[1381,2],[1400,2],[1418,2],[1421,1],[1449,1],[1474,1],[1500,1],[1502,2],[1505,2],[1508,1],[1532,1],[1572,1],[1587,2],[1636,1]]},"150":{"position":[[211,1],[237,1],[312,1]]},"168":{"position":[[33,2],[49,2]]},"170":{"position":[[31,1],[103,1],[112,1],[225,2],[307,2],[310,2],[313,1],[400,1],[481,1],[490,1],[561,2],[679,2],[682,2],[685,1]]},"172":{"position":[[363,2],[563,2]]},"174":{"position":[[100,1],[157,2],[244,1],[292,3],[296,1]]},"177":{"position":[[91,1],[293,1],[295,1],[334,1],[393,1],[410,1],[412,2],[445,1],[447,1],[485,1],[534,1],[536,2],[554,1],[563,1],[636,3],[715,2],[735,2],[738,1]]},"185":{"position":[[1172,1],[1194,2],[1197,1],[1216,3],[1227,2],[1263,1],[1272,1],[1293,1],[1320,1],[1322,1],[1338,1],[1340,1],[1342,1],[1344,1]]},"189":{"position":[[69,1],[141,1],[216,2],[264,3],[268,1]]},"191":{"position":[[69,1],[141,1],[175,1],[235,3],[278,2],[355,3],[359,1]]},"193":{"position":[[278,1],[335,2],[368,1],[397,2],[470,1],[548,1],[582,1],[642,3],[659,1],[693,2],[696,1],[714,1],[759,2],[879,1],[906,1],[908,2],[911,3],[1003,3],[1007,1]]},"196":{"position":[[1138,3],[1181,1],[1218,1],[1220,1],[1222,3],[1235,1],[1325,2],[1341,1],[1377,1],[1413,2],[1416,1],[1418,2],[1421,3],[1456,1],[1516,1],[1518,1],[1520,3],[1533,1],[1614,2],[1630,1],[1666,1],[1702,2],[1705,1],[1707,2]]},"198":{"position":[[183,3],[322,2],[357,2],[444,1],[1040,1]]},"200":{"position":[[310,1],[328,1],[357,2],[389,1],[418,2],[449,1],[479,1],[497,2],[500,1],[560,2],[563,4],[575,1],[658,1],[660,1],[684,2],[687,1],[790,2],[824,2],[834,2],[837,1],[1082,1],[1095,2],[1119,2],[1122,1],[1225,2],[1259,2],[1282,1],[1365,1],[1367,1],[1386,2],[1389,1],[1674,1],[1687,2],[1690,1],[1699,1],[1759,2],[1804,2],[1807,2],[1830,1],[1913,1],[1915,1],[2083,2],[2086,2],[2106,2]]},"202":{"position":[[155,1],[207,1],[220,2],[223,1],[238,1],[304,1],[331,3],[335,2]]},"205":{"position":[[367,1],[432,2],[516,3],[520,1],[576,2],[579,1],[621,1],[635,2],[714,2],[717,1]]},"217":{"position":[[322,1],[324,1],[399,2],[430,3],[434,2]]},"229":{"position":[[535,2],[675,2],[678,2],[804,2]]},"233":{"position":[[180,1],[246,1],[268,2],[290,1],[344,2],[347,2],[350,2],[393,2]]},"237":{"position":[[253,2]]},"239":{"position":[[207,2],[263,2]]}}}],["0",{"_index":433,"t":{"57":{"position":[[709,2],[779,2],[829,2],[893,2],[965,2],[1217,2],[1443,1],[1479,2],[1550,2],[1585,1],[1616,2],[1683,2]]},"76":{"position":[[809,1]]},"217":{"position":[[345,3],[371,3],[396,2]]},"233":{"position":[[334,3]]},"300":{"position":[[118,1]]}}}],["0.31.0",{"_index":1445,"t":{"237":{"position":[[209,6]]}}}],["0.38",{"_index":1570,"t":{"288":{"position":[[43,5]]}}}],["0.42.2",{"_index":1552,"t":{"280":{"position":[[554,6]]}}}],["0.53.0",{"_index":1525,"t":{"264":{"position":[[531,9]]}}}],["0.6.x",{"_index":1446,"t":{"239":{"position":[[16,6]]}}}],["0.xx",{"_index":1518,"t":{"264":{"position":[[337,4]]}}}],["007cbf",{"_index":833,"t":{"117":{"position":[[564,9],[1307,9]]},"177":{"position":[[524,9]]}}}],["1",{"_index":1273,"t":{"200":{"position":[[2052,2]]}}}],["1.0.0",{"_index":1526,"t":{"264":{"position":[[558,9]]}}}],["10",{"_index":832,"t":{"117":{"position":[[544,3],[1287,3]]},"177":{"position":[[504,3]]}}}],["100",{"_index":202,"t":{"8":{"position":[[297,4],[664,4]]},"17":{"position":[[295,4],[561,4]]},"26":{"position":[[293,4],[557,4]]},"53":{"position":[[91,7],[107,7]]},"73":{"position":[[273,4],[372,4],[597,4],[732,4]]},"86":{"position":[[295,4],[561,4]]},"95":{"position":[[362,4],[476,4],[816,4],[966,4]]},"108":{"position":[[285,4],[541,4]]},"111":{"position":[[27,3]]},"189":{"position":[[187,4]]},"191":{"position":[[206,4]]},"193":{"position":[[613,4]]}}}],["12",{"_index":1046,"t":{"168":{"position":[[36,2]]}}}],["122.4",{"_index":297,"t":{"39":{"position":[[480,6],[975,6]]},"49":{"position":[[321,6],[587,6]]},"82":{"position":[[563,6],[1140,6]]},"104":{"position":[[451,6],[848,6]]},"117":{"position":[[435,6],[669,6],[1178,6],[1383,6]]},"136":{"position":[[399,6]]},"142":{"position":[[316,6],[611,6],[1127,6],[1534,6]]},"170":{"position":[[193,6],[529,6]]},"177":{"position":[[395,6]]}}}],["122.45",{"_index":1074,"t":{"177":{"position":[[602,7]]}}}],["14",{"_index":299,"t":{"39":{"position":[[509,2],[1004,2]]},"49":{"position":[[350,2],[616,2]]},"117":{"position":[[698,2],[1412,2]]},"136":{"position":[[428,2]]},"170":{"position":[[222,2],[558,2]]},"177":{"position":[[633,2]]},"266":{"position":[[18,3]]}}}],["140",{"_index":1588,"t":{"298":{"position":[[186,6]]}}}],["15.4",{"_index":1444,"t":{"237":{"position":[[171,4]]}}}],["15.4.x",{"_index":1566,"t":{"284":{"position":[[249,9]]}}}],["16",{"_index":645,"t":{"63":{"position":[[1401,2]]},"250":{"position":[[18,3]]},"272":{"position":[[177,2]]},"284":{"position":[[138,2],[187,3]]}}}],["16.3",{"_index":1047,"t":{"168":{"position":[[52,5]]},"272":{"position":[[197,4]]}}}],["17",{"_index":1586,"t":{"296":{"position":[[10,3]]}}}],["19",{"_index":1562,"t":{"282":{"position":[[22,3]]}}}],["1:1",{"_index":158,"t":{"6":{"position":[[190,3]]},"244":{"position":[[468,3]]}}}],["2",{"_index":29,"t":{"2":{"position":[[451,1]]},"63":{"position":[[2887,1]]}}}],["20",{"_index":1428,"t":{"233":{"position":[[322,3]]},"298":{"position":[[96,2]]}}}],["2017",{"_index":1563,"t":{"282":{"position":[[26,4]]},"286":{"position":[[25,4]]},"296":{"position":[[14,4]]}}}],["2018",{"_index":1532,"t":{"270":{"position":[[21,4]]},"274":{"position":[[20,4]]},"278":{"position":[[24,4]]}}}],["2019",{"_index":1506,"t":{"258":{"position":[[22,4]]},"262":{"position":[[22,4]]},"264":{"position":[[301,4]]},"266":{"position":[[22,4]]}}}],["2020",{"_index":1483,"t":{"246":{"position":[[22,4]]},"250":{"position":[[22,4]]},"254":{"position":[[21,4]]}}}],["2022",{"_index":1468,"t":{"244":{"position":[[21,4]]}}}],["2023",{"_index":1462,"t":{"242":{"position":[[22,4]]}}}],["219k",{"_index":1475,"t":{"244":{"position":[[366,4]]}}}],["22",{"_index":454,"t":{"57":{"position":[[1513,2]]}}}],["24",{"_index":453,"t":{"57":{"position":[[1482,4],[1553,4]]}}}],["240px",{"_index":802,"t":{"98":{"position":[[830,5]]}}}],["27",{"_index":1482,"t":{"246":{"position":[[18,3]]}}}],["27th",{"_index":1568,"t":{"286":{"position":[[19,5]]}}}],["3.5",{"_index":206,"t":{"8":{"position":[[322,3],[689,3]]},"17":{"position":[[320,3],[586,3]]},"26":{"position":[[318,3],[582,3]]},"73":{"position":[[298,3],[622,3]]},"86":{"position":[[320,3],[586,3]]},"95":{"position":[[387,3],[841,3]]},"108":{"position":[[310,3],[566,3]]},"189":{"position":[[212,3]]},"191":{"position":[[231,3]]},"193":{"position":[[638,3]]}}}],["30",{"_index":1461,"t":{"242":{"position":[[19,2]]},"258":{"position":[[18,3]]}}}],["31",{"_index":1509,"t":{"262":{"position":[[18,3]]}}}],["37.78",{"_index":1075,"t":{"177":{"position":[[620,6]]}}}],["37.8",{"_index":298,"t":{"39":{"position":[[497,5],[992,5]]},"49":{"position":[[338,5],[604,5]]},"117":{"position":[[442,7],[686,5],[1185,7],[1400,5]]},"136":{"position":[[416,5]]},"142":{"position":[[323,8],[618,8],[1134,8],[1541,8]]},"170":{"position":[[210,5],[546,5]]},"177":{"position":[[402,7]]}}}],["3d",{"_index":1093,"t":{"181":{"position":[[416,2],[495,2]]},"272":{"position":[[513,2]]}}}],["4",{"_index":1467,"t":{"244":{"position":[[18,2]]}}}],["4.1",{"_index":1511,"t":{"264":{"position":[[55,3]]}}}],["4.1.x",{"_index":1515,"t":{"264":{"position":[[210,5]]}}}],["40",{"_index":204,"t":{"8":{"position":[[312,3],[679,3]]},"17":{"position":[[310,3],[576,3]]},"26":{"position":[[308,3],[572,3]]},"73":{"position":[[288,3],[612,3]]},"86":{"position":[[310,3],[576,3]]},"95":{"position":[[377,3],[831,3]]},"108":{"position":[[300,3],[556,3]]},"189":{"position":[[202,3]]},"191":{"position":[[221,3]]},"193":{"position":[[628,3]]},"233":{"position":[[339,4]]}}}],["40.7",{"_index":962,"t":{"142":{"position":[[1171,8],[1578,8]]}}}],["40.7467898",{"_index":1165,"t":{"193":{"position":[[498,12]]}}}],["40.7661",{"_index":1425,"t":{"233":{"position":[[280,9]]}}}],["400",{"_index":350,"t":{"49":{"position":[[384,5],[650,5]]},"170":{"position":[[256,5],[592,5]]},"233":{"position":[[227,6]]}}}],["41.268014439447484",{"_index":1430,"t":{"233":{"position":[[438,19]]}}}],["41.7661",{"_index":1427,"t":{"233":{"position":[[301,10]]}}}],["4e3fc8",{"_index":296,"t":{"39":{"position":[[362,9],[899,9]]}}}],["5",{"_index":1160,"t":{"193":{"position":[[412,1],[511,2]]},"270":{"position":[[18,2]]}}}],["5.0",{"_index":1510,"t":{"264":{"position":[[28,3]]}}}],["5.0.x",{"_index":1514,"t":{"264":{"position":[[200,5]]}}}],["57k",{"_index":1476,"t":{"244":{"position":[[374,3]]}}}],["6",{"_index":1502,"t":{"254":{"position":[[18,2]]}}}],["6.0",{"_index":1497,"t":{"252":{"position":[[4,3]]}}}],["60",{"_index":458,"t":{"57":{"position":[[1651,2]]},"219":{"position":[[122,3]]}}}],["600",{"_index":348,"t":{"49":{"position":[[371,4],[637,4]]},"170":{"position":[[243,4],[579,4]]},"233":{"position":[[214,4]]}}}],["7",{"_index":1536,"t":{"272":{"position":[[233,1],[265,2]]}}}],["7.209231188444142",{"_index":1431,"t":{"233":{"position":[[464,18]]}}}],["72.9876",{"_index":1426,"t":{"233":{"position":[[292,8]]}}}],["73.48760000000007",{"_index":1429,"t":{"233":{"position":[[409,18]]}}}],["73.9876",{"_index":1424,"t":{"233":{"position":[[271,8]]}}}],["74",{"_index":961,"t":{"142":{"position":[[1167,3],[1574,3]]}}}],["74.0122106",{"_index":1164,"t":{"193":{"position":[[486,11]]}}}],["8",{"_index":973,"t":{"150":{"position":[[115,4]]}}}],["8.9.18",{"_index":1300,"t":{"205":{"position":[[1383,9]]}}}],["85",{"_index":443,"t":{"57":{"position":[[1220,4],[1619,4],[1686,4]]},"219":{"position":[[114,2]]}}}],["__super_secret_token__",{"_index":1217,"t":{"196":{"position":[[1898,23]]}}}],["_mapcontext",{"_index":1366,"t":{"217":{"position":[[52,11]]}}}],["abov",{"_index":620,"t":{"63":{"position":[[92,6]]},"183":{"position":[[259,5]]},"185":{"position":[[207,6]]}}}],["abus",{"_index":1182,"t":{"196":{"position":[[285,7]]}}}],["accept",{"_index":42,"t":{"2":{"position":[[764,9]]}}}],["access",{"_index":199,"t":{"8":{"position":[[250,6]]},"17":{"position":[[248,6]]},"26":{"position":[[246,6]]},"35":{"position":[[51,10]]},"39":{"position":[[433,6]]},"49":{"position":[[274,6]]},"63":{"position":[[1207,6]]},"65":{"position":[[23,10],[1201,6]]},"69":{"position":[[166,6]]},"73":{"position":[[226,6]]},"82":{"position":[[41,10]]},"86":{"position":[[248,6]]},"95":{"position":[[315,6]]},"104":{"position":[[40,10]]},"108":{"position":[[238,6]]},"162":{"position":[[64,6]]},"170":{"position":[[146,6]]},"183":{"position":[[285,6],[310,6],[465,6]]},"219":{"position":[[15,6]]}}}],["access_token=token",{"_index":1116,"t":{"183":{"position":[[1137,19]]}}}],["accommod",{"_index":1463,"t":{"242":{"position":[[37,11]]}}}],["accord",{"_index":848,"t":{"126":{"position":[[387,9],[487,9],[602,9],[698,9],[800,9],[906,9],[1002,9],[1102,9],[1202,9],[1296,9],[1403,9],[1506,9],[1609,9],[1714,9],[1816,9],[1925,9]]}}}],["account",{"_index":1501,"t":{"252":{"position":[[180,7]]}}}],["accpt",{"_index":472,"t":{"59":{"position":[[502,5],[814,5],[1012,5],[1226,5]]}}}],["achiev",{"_index":180,"t":{"6":{"position":[[623,8]]}}}],["activ",{"_index":262,"t":{"31":{"position":[[517,6]]},"35":{"position":[[408,8],[853,8]]},"148":{"position":[[86,8]]},"150":{"position":[[25,6]]}}}],["actual",{"_index":583,"t":{"61":{"position":[[5060,8],[6085,8],[6767,8],[7446,8]]}}}],["ad",{"_index":335,"t":{"45":{"position":[[250,5]]},"138":{"position":[[871,5]]},"154":{"position":[[241,5],[307,5]]},"198":{"position":[[1147,5]]},"248":{"position":[[319,5],[520,5]]},"260":{"position":[[43,5]]},"268":{"position":[[62,5]]},"288":{"position":[[291,5]]}}}],["add",{"_index":796,"t":{"98":{"position":[[437,3]]},"138":{"position":[[603,4]]},"172":{"position":[[182,3]]},"196":{"position":[[572,3],[1081,3]]},"209":{"position":[[0,3]]},"242":{"position":[[110,4]]},"260":{"position":[[211,3]]},"298":{"position":[[63,3],[117,3],[161,3]]}}}],["add/remov",{"_index":313,"t":{"43":{"position":[[73,10]]},"119":{"position":[[320,10]]}}}],["added/modifi",{"_index":990,"t":{"154":{"position":[[129,15],[450,15]]}}}],["addit",{"_index":535,"t":{"61":{"position":[[931,10],[1210,10],[2099,10],[2745,10],[3077,10],[3388,10],[3738,10],[3994,10],[4252,10],[4514,10]]},"239":{"position":[[448,10]]},"290":{"position":[[120,10]]}}}],["address",{"_index":1324,"t":{"211":{"position":[[381,7]]},"244":{"position":[[70,9]]}}}],["adher",{"_index":1040,"t":{"164":{"position":[[25,6]]}}}],["adjust",{"_index":1080,"t":{"179":{"position":[[140,6]]}}}],["advantag",{"_index":1307,"t":{"207":{"position":[[243,10]]}}}],["affect",{"_index":501,"t":{"59":{"position":[[1827,8]]},"152":{"position":[[168,8]]},"154":{"position":[[523,9]]}}}],["afterward",{"_index":1138,"t":{"187":{"position":[[198,11]]}}}],["again",{"_index":654,"t":{"63":{"position":[[1678,6]]},"198":{"position":[[117,5],[698,6]]}}}],["against",{"_index":985,"t":{"152":{"position":[[116,7]]}}}],["agnost",{"_index":756,"t":{"76":{"position":[[1174,8]]}}}],["alber",{"_index":381,"t":{"55":{"position":[[573,6],[580,11],[828,6]]}}}],["alia",{"_index":1314,"t":{"209":{"position":[[221,5]]}}}],["align",{"_index":150,"t":{"6":{"position":[[52,5]]},"76":{"position":[[455,6],[507,6],[1018,6],[1119,6]]},"179":{"position":[[220,7]]},"215":{"position":[[118,7]]}}}],["allow",{"_index":285,"t":{"39":{"position":[[15,6]]},"55":{"position":[[902,5]]},"63":{"position":[[3184,7]]},"117":{"position":[[15,6]]},"142":{"position":[[16,6]]},"185":{"position":[[174,7]]},"196":{"position":[[1034,6]]},"264":{"position":[[578,5]]},"284":{"position":[[78,5]]},"288":{"position":[[709,5]]}}}],["alon",{"_index":1575,"t":{"288":{"position":[[861,5]]}}}],["along",{"_index":619,"t":{"63":{"position":[[21,5]]},"272":{"position":[[456,5]]}}}],["alongsid",{"_index":1523,"t":{"264":{"position":[[423,9]]}}}],["altern",{"_index":1051,"t":{"170":{"position":[[343,12]]},"196":{"position":[[1842,14]]},"276":{"position":[[182,11]]}}}],["alway",{"_index":127,"t":{"4":{"position":[[1148,6]]},"179":{"position":[[213,6]]},"219":{"position":[[31,6]]}}}],["amount",{"_index":1357,"t":{"215":{"position":[[224,6]]}}}],["analyt",{"_index":67,"t":{"4":{"position":[[145,9]]}}}],["anchor",{"_index":741,"t":{"76":{"position":[[155,6],[222,6]]},"80":{"position":[[172,6]]},"98":{"position":[[0,7],[269,6],[747,6]]}}}],["anchor=\"bottom",{"_index":737,"t":{"73":{"position":[[391,15],[751,15]]},"95":{"position":[[495,15],[985,15]]}}}],["angl",{"_index":753,"t":{"76":{"position":[[824,5]]}}}],["anim",{"_index":524,"t":{"61":{"position":[[533,10],[4806,8],[5824,8],[6495,8],[7182,8]]},"177":{"position":[[922,9]]},"200":{"position":[[877,9]]}}}],["anoth",{"_index":575,"t":{"61":{"position":[[4722,8],[4843,8],[5312,8],[5740,8],[5867,8],[6268,8],[6409,8],[6546,8],[6963,8],[7097,8],[7227,8],[7633,8]]},"185":{"position":[[79,7]]},"294":{"position":[[39,7]]}}}],["anywher",{"_index":499,"t":{"59":{"position":[[1727,8]]}}}],["api",{"_index":78,"t":{"4":{"position":[[309,4]]},"6":{"position":[[62,3],[219,3]]},"31":{"position":[[77,3],[195,3],[324,3]]},"63":{"position":[[1299,3]]},"154":{"position":[[120,4],[441,4]]},"207":{"position":[[135,4]]},"211":{"position":[[475,3]]},"217":{"position":[[30,4]]},"237":{"position":[[6,3]]},"242":{"position":[[53,3]]},"244":{"position":[[540,4]]},"248":{"position":[[424,4]]},"260":{"position":[[102,4]]},"268":{"position":[[121,4]]},"288":{"position":[[350,4]]},"300":{"position":[[76,3]]}}}],["app",{"_index":196,"t":{"8":{"position":[[203,5],[612,5]]},"17":{"position":[[201,5],[509,5]]},"26":{"position":[[199,5],[505,5]]},"35":{"position":[[320,5],[763,5]]},"39":{"position":[[22,4],[386,5],[923,5]]},"49":{"position":[[225,5],[533,5]]},"63":{"position":[[671,5],[838,5],[1115,5]]},"65":{"position":[[244,5],[615,5]]},"73":{"position":[[179,5],[545,5]]},"82":{"position":[[306,5],[879,5]]},"86":{"position":[[201,5],[509,5]]},"95":{"position":[[209,5],[705,5]]},"104":{"position":[[293,5],[688,5]]},"108":{"position":[[191,5],[489,5]]},"117":{"position":[[22,4],[588,5],[1331,5]]},"136":{"position":[[316,5]]},"170":{"position":[[97,5],[475,5]]},"172":{"position":[[673,3]]},"174":{"position":[[238,5]]},"177":{"position":[[548,5]]},"183":{"position":[[886,4],[1105,4]]},"189":{"position":[[21,3],[135,5]]},"191":{"position":[[21,3],[135,5]]},"193":{"position":[[542,5]]},"196":{"position":[[134,4],[626,3]]},"198":{"position":[[36,4]]},"205":{"position":[[361,5],[615,5]]},"213":{"position":[[400,4]]},"239":{"position":[[816,3]]}}}],["app.tsx",{"_index":346,"t":{"49":{"position":[[144,7],[443,7]]},"63":{"position":[[1034,7]]},"170":{"position":[[16,7],[385,7]]},"172":{"position":[[750,7],[797,7]]},"174":{"position":[[85,7]]}}}],["append",{"_index":331,"t":{"45":{"position":[[118,8]]}}}],["appli",{"_index":220,"t":{"11":{"position":[[46,7]]},"20":{"position":[[46,7]]},"29":{"position":[[46,7]]},"76":{"position":[[318,5],[1279,7]]},"89":{"position":[[46,7]]},"98":{"position":[[547,7],[948,7]]},"111":{"position":[[128,7]]}}}],["applic",{"_index":72,"t":{"4":{"position":[[226,13]]},"61":{"position":[[5086,11],[6111,11],[6793,11],[7472,11]]},"63":{"position":[[1946,11]]},"69":{"position":[[271,11]]},"187":{"position":[[51,11],[285,11],[448,11],[530,11]]},"191":{"position":[[374,11]]},"196":{"position":[[50,11]]},"200":{"position":[[8,11],[1474,11]]},"211":{"position":[[651,12]]},"215":{"position":[[352,11]]},"223":{"position":[[255,12]]},"229":{"position":[[376,11]]},"231":{"position":[[413,12]]},"239":{"position":[[741,13]]},"280":{"position":[[393,12]]}}}],["application'",{"_index":1325,"t":{"211":{"position":[[394,13]]},"223":{"position":[[321,13]]}}}],["approach",{"_index":1313,"t":{"207":{"position":[[528,8]]}}}],["appropri",{"_index":1477,"t":{"244":{"position":[[505,12]]}}}],["approv",{"_index":984,"t":{"152":{"position":[[69,9]]}}}],["arab",{"_index":674,"t":{"63":{"position":[[2470,6]]}}}],["architectur",{"_index":1471,"t":{"244":{"position":[[137,12]]},"288":{"position":[[963,12]]}}}],["argument",{"_index":1346,"t":{"213":{"position":[[1005,8]]}}}],["around",{"_index":449,"t":{"57":{"position":[[1396,6]]},"280":{"position":[[449,6]]},"290":{"position":[[309,6]]}}}],["array",{"_index":333,"t":{"45":{"position":[[152,6]]},"59":{"position":[[1600,5]]},"130":{"position":[[66,5],[271,5],[324,5],[435,5]]}}}],["asid",{"_index":351,"t":{"51":{"position":[[0,5]]}}}],["assign",{"_index":142,"t":{"4":{"position":[[1458,9]]},"43":{"position":[[274,9]]},"119":{"position":[[523,9]]}}}],["associ",{"_index":652,"t":{"63":{"position":[[1596,10]]},"65":{"position":[[1303,10]]}}}],["attach",{"_index":751,"t":{"76":{"position":[[689,6]]},"154":{"position":[[542,9]]}}}],["attempt",{"_index":412,"t":{"55":{"position":[[1289,10]]},"119":{"position":[[165,7]]},"248":{"position":[[466,9]]}}}],["attribut",{"_index":211,"t":{"8":{"position":[[397,11],[800,11]]},"15":{"position":[[0,11]]}}}],["attributioncontrol",{"_index":191,"t":{"8":{"position":[[46,18],[152,20],[438,19],[552,20],[841,19]]},"13":{"position":[[130,18]]},"248":{"position":[[384,18]]}}}],["attributioncontrol={fals",{"_index":212,"t":{"8":{"position":[[409,26],[812,26]]}}}],["authent",{"_index":1131,"t":{"185":{"position":[[1025,15]]}}}],["author",{"_index":1135,"t":{"185":{"position":[[1295,16]]}}}],["auto",{"_index":364,"t":{"53":{"position":[[159,6]]},"76":{"position":[[427,7],[444,6],[555,4],[990,7],[1007,6],[1201,4]]},"217":{"position":[[126,4]]},"256":{"position":[[105,4]]},"260":{"position":[[161,6]]}}}],["automat",{"_index":748,"t":{"76":{"position":[[560,13]]},"187":{"position":[[151,13]]},"196":{"position":[[1723,13]]},"231":{"position":[[545,13]]}}}],["avail",{"_index":380,"t":{"55":{"position":[[547,9]]},"138":{"position":[[632,10]]}}}],["avoid",{"_index":306,"t":{"41":{"position":[[184,5]]},"63":{"position":[[2049,5]]},"119":{"position":[[234,5]]},"225":{"position":[[149,8]]},"256":{"position":[[282,5]]}}}],["away",{"_index":441,"t":{"57":{"position":[[1183,4]]}}}],["babel",{"_index":1535,"t":{"272":{"position":[[227,5],[259,5]]}}}],["back",{"_index":1241,"t":{"198":{"position":[[1153,5]]},"239":{"position":[[657,4],[863,4]]}}}],["background",{"_index":265,"t":{"31":{"position":[[639,10]]},"126":{"position":[[370,10]]},"237":{"position":[[187,11]]}}}],["backgroundlay",{"_index":847,"t":{"126":{"position":[[324,16]]}}}],["bad",{"_index":1403,"t":{"229":{"position":[[538,4]]}}}],["base",{"_index":189,"t":{"8":{"position":[[31,4]]},"17":{"position":[[31,4]]},"26":{"position":[[31,4]]},"49":{"position":[[31,4]]},"51":{"position":[[194,4],[290,4]]},"55":{"position":[[1307,5]]},"63":{"position":[[422,4]]},"73":{"position":[[31,4]]},"86":{"position":[[31,4]]},"95":{"position":[[31,4]]},"108":{"position":[[31,4]]},"134":{"position":[[1015,5]]},"152":{"position":[[32,4]]},"172":{"position":[[4,4]]},"181":{"position":[[522,5]]},"185":{"position":[[1019,5]]},"205":{"position":[[997,4]]},"244":{"position":[[773,4]]}}}],["baseapiurl",{"_index":641,"t":{"63":{"position":[[1261,11]]},"213":{"position":[[143,10]]}}}],["basemap",{"_index":25,"t":{"2":{"position":[[348,8],[580,9],[778,9]]}}}],["basi",{"_index":1363,"t":{"215":{"position":[[491,6]]}}}],["basic",{"_index":1155,"t":{"193":{"position":[[26,5]]}}}],["be",{"_index":421,"t":{"57":{"position":[[194,5]]},"152":{"position":[[162,5]]},"196":{"position":[[279,5]]},"239":{"position":[[597,5]]},"284":{"position":[[163,5]]}}}],["bear",{"_index":437,"t":{"57":{"position":[[896,8],[926,7],[1225,8],[1254,7]]},"61":{"position":[[6387,7],[6524,7],[6817,7],[6941,7]]},"76":{"position":[[1082,7]]},"130":{"position":[[920,8],[942,7]]},"239":{"position":[[501,7]]},"276":{"position":[[106,7]]},"300":{"position":[[32,7]]}}}],["bearer",{"_index":1136,"t":{"185":{"position":[[1312,7]]}}}],["becom",{"_index":1033,"t":{"162":{"position":[[169,8]]},"200":{"position":[[999,6]]}}}],["befor",{"_index":329,"t":{"45":{"position":[[67,7]]},"61":{"position":[[394,6],[4670,6],[5682,6],[6343,6],[7037,6]]}}}],["beforeid",{"_index":326,"t":{"45":{"position":[[0,9],[423,8]]}}}],["begin",{"_index":574,"t":{"61":{"position":[[4685,6],[5697,6],[6358,6],[7052,6]]}}}],["behav",{"_index":1306,"t":{"207":{"position":[[99,6]]},"213":{"position":[[1141,6]]},"215":{"position":[[270,6]]},"244":{"position":[[405,6]]}}}],["behavior",{"_index":146,"t":{"4":{"position":[[1494,8]]},"6":{"position":[[730,10]]},"45":{"position":[[447,9]]},"63":{"position":[[1914,8],[3250,9]]},"65":{"position":[[1176,10]]},"154":{"position":[[488,9]]},"217":{"position":[[240,8]]},"229":{"position":[[525,9]]},"280":{"position":[[250,9]]}}}],["belong",{"_index":618,"t":{"61":{"position":[[8407,9]]}}}],["below",{"_index":353,"t":{"51":{"position":[[28,6]]},"183":{"position":[[598,5]]},"196":{"position":[[236,5]]},"229":{"position":[[564,5],[708,5]]},"235":{"position":[[65,6]]}}}],["better",{"_index":149,"t":{"6":{"position":[[45,6]]},"213":{"position":[[32,6]]},"242":{"position":[[30,6]]},"260":{"position":[[60,6]]},"268":{"position":[[79,6]]},"272":{"position":[[268,6]]},"280":{"position":[[145,6]]},"288":{"position":[[308,6]]}}}],["between",{"_index":1465,"t":{"242":{"position":[[68,7]]},"264":{"position":[[16,7]]}}}],["bewar",{"_index":356,"t":{"51":{"position":[[127,6]]}}}],["big",{"_index":1091,"t":{"181":{"position":[[382,3]]}}}],["bill",{"_index":1238,"t":{"198":{"position":[[827,6]]},"264":{"position":[[159,5]]}}}],["billabl",{"_index":31,"t":{"2":{"position":[[513,8]]},"63":{"position":[[2064,8]]},"183":{"position":[[349,8]]},"198":{"position":[[739,8]]}}}],["bind",{"_index":720,"t":{"65":{"position":[[917,9]]},"244":{"position":[[623,8]]}}}],["blob",{"_index":708,"t":{"63":{"position":[[3223,4]]}}}],["block",{"_index":1564,"t":{"284":{"position":[[109,5]]}}}],["blog",{"_index":1521,"t":{"264":{"position":[[412,4]]}}}],["boolean",{"_index":403,"t":{"55":{"position":[[1020,8],[1130,8]]},"59":{"position":[[9,8],[136,8],[279,8],[408,7],[600,8],[717,7],[916,7],[1119,7]]},"63":{"position":[[1496,8]]},"76":{"position":[[11,8]]},"134":{"position":[[329,7],[537,7],[781,7],[1460,7]]}}}],["bootstrap",{"_index":978,"t":{"150":{"position":[[185,9]]}}}],["both",{"_index":98,"t":{"4":{"position":[[630,4]]},"272":{"position":[[20,4]]}}}],["bottom",{"_index":233,"t":{"13":{"position":[[267,7],[284,7],[308,7]]},"22":{"position":[[279,7],[296,7]]},"33":{"position":[[326,7],[343,7],[367,7]]},"91":{"position":[[276,7],[293,7]]},"98":{"position":[[46,8],[84,7],[100,7],[373,9]]},"113":{"position":[[138,7],[155,7]]},"128":{"position":[[49,7],[68,7],[214,7]]},"138":{"position":[[1057,7],[1073,7]]}}}],["bound",{"_index":423,"t":{"57":{"position":[[270,7],[309,6],[469,6],[1778,7]]},"61":{"position":[[7945,8]]},"202":{"position":[[231,6]]},"233":{"position":[[240,5],[353,7]]}}}],["bounds.contains([lng",{"_index":1280,"t":{"202":{"position":[[275,21]]}}}],["box",{"_index":461,"t":{"59":{"position":[[45,4]]},"61":{"position":[[7706,4],[7799,4],[7909,4],[7954,3]]}}}],["boxzoom",{"_index":460,"t":{"59":{"position":[[0,8]]}}}],["boxzoombound",{"_index":911,"t":{"134":{"position":[[1176,14]]}}}],["boxzoomhandl",{"_index":462,"t":{"59":{"position":[[84,14]]}}}],["branch",{"_index":970,"t":{"150":{"position":[[11,6],[44,7]]},"152":{"position":[[135,7]]}}}],["break",{"_index":719,"t":{"65":{"position":[[898,8]]},"154":{"position":[[199,8]]},"219":{"position":[[152,8]]},"225":{"position":[[119,8]]},"244":{"position":[[604,8]]},"252":{"position":[[346,8]]},"272":{"position":[[1178,8]]}}}],["browser",{"_index":980,"t":{"150":{"position":[[262,7],[324,7]]},"280":{"position":[[507,7]]}}}],["bug",{"_index":965,"t":{"148":{"position":[[50,3]]}}}],["build",{"_index":62,"t":{"4":{"position":[[101,5]]},"55":{"position":[[1255,8]]},"150":{"position":[[52,8]]},"193":{"position":[[446,8]]},"219":{"position":[[175,5],[244,5]]},"227":{"position":[[33,8]]},"244":{"position":[[339,5]]},"272":{"position":[[243,5]]}}}],["bump",{"_index":1569,"t":{"288":{"position":[[21,5]]},"298":{"position":[[18,4]]}}}],["bundl",{"_index":628,"t":{"63":{"position":[[555,8],[746,6],[910,7],[3034,6]]}}}],["bundler",{"_index":682,"t":{"63":{"position":[[2699,8]]},"196":{"position":[[1107,7]]}}}],["button",{"_index":557,"t":{"61":{"position":[[3243,6]]},"82":{"position":[[638,7],[1215,7]]},"100":{"position":[[170,6]]},"142":{"position":[[342,7],[637,7],[1190,7],[1597,7]]}}}],["bypass",{"_index":1240,"t":{"198":{"position":[[1092,8]]}}}],["call",{"_index":161,"t":{"6":{"position":[[254,4],[418,7],[557,7]]},"31":{"position":[[50,6],[168,6],[297,6],[469,6],[591,6]]},"35":{"position":[[102,4]]},"61":{"position":[[37,6],[110,6],[273,6],[357,6],[597,6],[714,6],[793,6],[1071,6],[1352,6],[1606,6],[1829,6],[2242,6],[2464,6],[2580,6],[2886,6],[3221,6],[3521,6],[3621,6],[3879,6],[4136,6],[4396,6],[4658,6],[4778,6],[5246,6],[5373,6],[5468,6],[5572,6],[5670,6],[5796,6],[6196,6],[6331,6],[6467,6],[6883,6],[7025,6],[7154,6],[7559,6],[7692,6],[7785,6],[7878,6],[8065,6],[8196,6],[8332,6]]},"63":{"position":[[2571,7]]},"65":{"position":[[885,4],[1057,7]]},"78":{"position":[[34,6],[117,6],[208,6],[296,6]]},"82":{"position":[[92,4]]},"100":{"position":[[35,6],[104,6]]},"104":{"position":[[91,4]]},"138":{"position":[[742,6],[838,6],[943,6]]},"179":{"position":[[110,7]]},"217":{"position":[[643,4],[749,4]]},"233":{"position":[[85,6]]},"244":{"position":[[580,6]]},"272":{"position":[[692,6]]}}}],["callback",{"_index":500,"t":{"59":{"position":[[1805,9]]},"187":{"position":[[373,8]]},"213":{"position":[[703,8],[1045,10]]},"229":{"position":[[241,8],[336,8]]},"268":{"position":[[130,8],[174,10]]},"272":{"position":[[131,8],[467,9],[975,8],[1019,10]]},"276":{"position":[[169,9],[194,8]]}}}],["camera",{"_index":99,"t":{"4":{"position":[[635,8],[711,7],[1406,6]]},"61":{"position":[[436,6],[4945,6],[5044,6],[5968,6],[6069,6],[6650,6],[6751,6],[7329,6],[7430,6]]},"134":{"position":[[989,6]]},"179":{"position":[[91,6]]},"187":{"position":[[91,7]]},"193":{"position":[[52,7],[147,7]]},"200":{"position":[[44,6]]},"213":{"position":[[647,6]]}}}],["cancel",{"_index":606,"t":{"61":{"position":[[7899,7]]}}}],["canva",{"_index":546,"t":{"61":{"position":[[1771,7],[2407,7],[2526,7]]},"126":{"position":[[2016,6]]},"132":{"position":[[409,7]]}}}],["canvasoverlay",{"_index":1329,"t":{"211":{"position":[[539,13]]},"239":{"position":[[85,14]]},"288":{"position":[[501,13]]},"300":{"position":[[284,14]]}}}],["canvassourc",{"_index":898,"t":{"132":{"position":[[351,13]]}}}],["canvassource(mapbox",{"_index":900,"t":{"132":{"position":[[421,19]]}}}],["canvassourceopt",{"_index":837,"t":{"119":{"position":[[96,20]]},"126":{"position":[[2040,20]]}}}],["canvassourceraw",{"_index":871,"t":{"126":{"position":[[1970,16]]}}}],["captur",{"_index":1353,"t":{"215":{"position":[[0,8]]}}}],["carrée/wgs84",{"_index":386,"t":{"55":{"position":[[642,12]]}}}],["case",{"_index":38,"t":{"2":{"position":[[708,5]]},"4":{"position":[[816,6]]},"181":{"position":[[68,6]]},"198":{"position":[[892,5]]},"207":{"position":[[601,4]]},"215":{"position":[[478,4],[486,4]]},"235":{"position":[[59,5]]}}}],["caus",{"_index":170,"t":{"6":{"position":[[455,5]]},"65":{"position":[[1089,5]]},"292":{"position":[[249,6]]}}}],["center",{"_index":397,"t":{"55":{"position":[[865,6]]},"57":{"position":[[693,7],[763,7],[1012,7],[1062,7]]},"76":{"position":[[350,7]]},"98":{"position":[[8,8]]},"130":{"position":[[773,7],[824,7]]},"193":{"position":[[237,6],[796,6]]}}}],["certain",{"_index":1107,"t":{"183":{"position":[[798,7]]},"280":{"position":[[524,7]]}}}],["chang",{"_index":261,"t":{"31":{"position":[[502,7],[624,7]]},"41":{"position":[[104,6]]},"43":{"position":[[58,7]]},"45":{"position":[[359,7]]},"55":{"position":[[1182,8]]},"61":{"position":[[2003,7],[5069,6],[5989,6],[6094,6],[6671,6],[6776,6],[7350,6],[7455,6],[8099,8],[8233,8],[8378,8],[8438,8]]},"65":{"position":[[1018,7]]},"119":{"position":[[128,6],[309,7]]},"134":{"position":[[1005,6]]},"152":{"position":[[13,6]]},"154":{"position":[[208,7]]},"179":{"position":[[98,8]]},"187":{"position":[[171,7]]},"200":{"position":[[1457,8]]},"205":{"position":[[94,6]]},"207":{"position":[[299,7]]},"213":{"position":[[298,7],[1017,7],[1245,6]]},"219":{"position":[[103,7],[161,6]]},"225":{"position":[[84,7],[128,7]]},"239":{"position":[[603,7],[838,7]]},"248":{"position":[[150,6]]},"252":{"position":[[82,7],[355,8]]},"256":{"position":[[306,7]]},"264":{"position":[[9,6]]},"272":{"position":[[1187,8]]}}}],["changelog",{"_index":1520,"t":{"264":{"position":[[398,9]]}}}],["charter",{"_index":1019,"t":{"158":{"position":[[83,8]]}}}],["check",{"_index":1076,"t":{"177":{"position":[[796,5],[888,5]]},"202":{"position":[[93,8]]},"211":{"position":[[335,5],[457,5],[582,5]]},"213":{"position":[[1321,5]]},"229":{"position":[[480,5]]}}}],["checkifpositioninviewport",{"_index":1278,"t":{"202":{"position":[[181,25]]}}}],["checkout",{"_index":977,"t":{"150":{"position":[[164,8]]}}}],["chen",{"_index":1025,"t":{"162":{"position":[[7,4]]}}}],["child",{"_index":342,"t":{"45":{"position":[[573,5]]},"61":{"position":[[1539,5]]},"73":{"position":[[839,5]]},"205":{"position":[[1320,5]]},"288":{"position":[[535,5]]}}}],["children",{"_index":824,"t":{"117":{"position":[[98,9]]},"231":{"position":[[443,8],[498,8]]}}}],["choroplethoverlay",{"_index":1412,"t":{"231":{"position":[[94,18]]},"290":{"position":[[563,19]]}}}],["chrome",{"_index":981,"t":{"150":{"position":[[279,6]]}}}],["circl",{"_index":830,"t":{"117":{"position":[[508,9],[527,7],[548,7],[1251,9],[1270,7],[1291,7]]},"126":{"position":[[474,6]]},"177":{"position":[[468,9],[487,7],[508,7]]},"193":{"position":[[402,6]]}}}],["circlelay",{"_index":825,"t":{"117":{"position":[[217,13],[473,11],[951,13],[1216,11]]},"126":{"position":[[432,12]]},"177":{"position":[[177,13],[433,11]]}}}],["class",{"_index":192,"t":{"8":{"position":[[65,5]]},"13":{"position":[[149,5]]},"17":{"position":[[64,5]]},"26":{"position":[[63,5]]},"33":{"position":[[147,5]]},"39":{"position":[[321,8],[858,8]]},"49":{"position":[[50,5]]},"51":{"position":[[88,5]]},"63":{"position":[[55,5],[2783,5]]},"73":{"position":[[53,5]]},"76":{"position":[[660,5]]},"80":{"position":[[137,5]]},"86":{"position":[[64,5]]},"91":{"position":[[148,5]]},"95":{"position":[[52,5]]},"98":{"position":[[422,5]]},"102":{"position":[[136,5]]},"108":{"position":[[59,5]]},"187":{"position":[[262,6]]},"213":{"position":[[914,5]]}}}],["classnam",{"_index":793,"t":{"98":{"position":[[383,10]]}}}],["clear",{"_index":1183,"t":{"196":{"position":[[320,5]]}}}],["click",{"_index":465,"t":{"59":{"position":[[180,5],[1436,5]]},"61":{"position":[[3266,7]]},"78":{"position":[[60,7]]},"100":{"position":[[148,8]]},"198":{"position":[[602,6],[658,5]]}}}],["clickabl",{"_index":1392,"t":{"221":{"position":[[364,10]]},"272":{"position":[[960,10]]}}}],["clicktoler",{"_index":759,"t":{"80":{"position":[[191,14]]}}}],["client",{"_index":1173,"t":{"196":{"position":[[43,6]]}}}],["clockwis",{"_index":445,"t":{"57":{"position":[[1313,9]]},"76":{"position":[[939,10]]}}}],["clone",{"_index":1146,"t":{"189":{"position":[[8,5]]},"191":{"position":[[8,5]]}}}],["close",{"_index":805,"t":{"100":{"position":[[129,6],[164,5]]}}}],["closebutton",{"_index":807,"t":{"102":{"position":[[171,11]]}}}],["closeonclick",{"_index":806,"t":{"100":{"position":[[192,13]]},"102":{"position":[[183,12]]}}}],["closeonmov",{"_index":808,"t":{"102":{"position":[[196,11]]}}}],["closest",{"_index":788,"t":{"98":{"position":[[196,7]]},"144":{"position":[[119,7]]}}}],["cloud",{"_index":1092,"t":{"181":{"position":[[408,7]]}}}],["cluster",{"_index":1504,"t":{"256":{"position":[[327,8]]}}}],["code",{"_index":707,"t":{"63":{"position":[[3211,4]]},"134":{"position":[[2190,5]]},"152":{"position":[[27,4]]},"154":{"position":[[40,4]]},"164":{"position":[[58,4]]},"196":{"position":[[825,4]]},"205":{"position":[[1196,4]]},"207":{"position":[[315,4]]},"215":{"position":[[241,4]]},"229":{"position":[[388,4],[498,4]]},"244":{"position":[[768,4]]},"290":{"position":[[239,4],[466,4]]}}}],["codepen",{"_index":1196,"t":{"196":{"position":[[845,7]]}}}],["collaps",{"_index":664,"t":{"63":{"position":[[2020,11]]},"198":{"position":[[843,10]]}}}],["color",{"_index":295,"t":{"39":{"position":[[354,7],[891,7]]},"80":{"position":[[179,5]]},"117":{"position":[[556,7],[1299,7]]},"177":{"position":[[516,7]]}}}],["color=\"r",{"_index":767,"t":{"82":{"position":[[586,11],[1163,11]]}}}],["command",{"_index":85,"t":{"4":{"position":[[426,7]]},"196":{"position":[[480,7]]}}}],["commit",{"_index":1028,"t":{"162":{"position":[[57,6]]},"196":{"position":[[299,6]]}}}],["committe",{"_index":1022,"t":{"160":{"position":[[70,9]]}}}],["commun",{"_index":1125,"t":{"185":{"position":[[469,9]]}}}],["compact",{"_index":226,"t":{"13":{"position":[[184,7]]}}}],["compat",{"_index":11,"t":{"2":{"position":[[107,10]]},"207":{"position":[[195,13]]},"209":{"position":[[20,10]]},"229":{"position":[[170,10]]},"237":{"position":[[10,10]]},"244":{"position":[[632,14]]}}}],["complet",{"_index":509,"t":{"61":{"position":[[191,8],[549,9],[5272,9],[6222,9],[6909,9],[7585,9]]},"166":{"position":[[13,8]]},"207":{"position":[[8,8]]},"244":{"position":[[34,8]]},"252":{"position":[[329,8]]}}}],["complex",{"_index":71,"t":{"4":{"position":[[206,10]]},"198":{"position":[[16,7]]}}}],["compli",{"_index":1375,"t":{"217":{"position":[[571,6]]}}}],["compliant",{"_index":1479,"t":{"244":{"position":[[753,10]]}}}],["complic",{"_index":1152,"t":{"191":{"position":[[403,11]]},"193":{"position":[[112,11]]},"200":{"position":[[1501,11]]}}}],["compon",{"_index":8,"t":{"2":{"position":[[79,10]]},"4":{"position":[[88,9],[489,10],[840,10],[977,9],[1253,10],[1352,9]]},"8":{"position":[[6,9]]},"13":{"position":[[77,9]]},"17":{"position":[[6,9]]},"22":{"position":[[77,9]]},"26":{"position":[[6,9]]},"33":{"position":[[77,9]]},"39":{"position":[[5,9]]},"41":{"position":[[27,9],[126,9]]},"45":{"position":[[591,10]]},"49":{"position":[[6,9]]},"51":{"position":[[43,9]]},"57":{"position":[[224,10]]},"61":{"position":[[4885,10],[5909,10],[6588,10],[7269,10]]},"63":{"position":[[451,10],[1549,9],[1760,9],[1855,9],[2258,9]]},"65":{"position":[[1324,10]]},"69":{"position":[[66,9],[109,9]]},"73":{"position":[[6,9],[845,11]]},"80":{"position":[[77,9]]},"86":{"position":[[6,9]]},"91":{"position":[[77,9]]},"95":{"position":[[6,9]]},"102":{"position":[[77,9]]},"108":{"position":[[6,9]]},"113":{"position":[[77,9]]},"117":{"position":[[5,9],[84,10]]},"119":{"position":[[27,9],[150,9]]},"124":{"position":[[126,10]]},"142":{"position":[[32,9]]},"144":{"position":[[246,10]]},"154":{"position":[[152,9]]},"172":{"position":[[104,10]]},"177":{"position":[[72,11]]},"183":{"position":[[980,9]]},"185":{"position":[[30,9]]},"187":{"position":[[141,9],[552,10]]},"193":{"position":[[186,10]]},"198":{"position":[[85,9]]},"200":{"position":[[844,9]]},"205":{"position":[[157,10],[1305,9],[1340,9]]},"211":{"position":[[514,10]]},"213":{"position":[[572,9],[1171,10]]},"215":{"position":[[259,10]]},"217":{"position":[[454,10],[548,11]]},"229":{"position":[[8,10],[43,9],[68,11],[213,10]]},"231":{"position":[[532,9]]},"239":{"position":[[60,10],[682,9],[875,9]]},"242":{"position":[[188,10],[452,10]]},"244":{"position":[[394,10]]},"248":{"position":[[373,10],[620,10],[678,10]]},"256":{"position":[[4,11]]},"260":{"position":[[4,11]]},"268":{"position":[[4,11]]},"272":{"position":[[411,9],[529,9]]},"280":{"position":[[593,10]]},"288":{"position":[[146,11],[168,9],[372,11]]},"300":{"position":[[259,10]]}}}],["component'",{"_index":953,"t":{"142":{"position":[[785,11]]},"211":{"position":[[104,11]]}}}],["component(",{"_index":734,"t":{"69":{"position":[[319,12]]}}}],["compos",{"_index":1402,"t":{"229":{"position":[[398,8]]}}}],["comput",{"_index":1015,"t":{"158":{"position":[[28,9]]}}}],["conduct",{"_index":1043,"t":{"164":{"position":[[66,7]]}}}],["config",{"_index":1202,"t":{"196":{"position":[[1115,7]]}}}],["configur",{"_index":396,"t":{"55":{"position":[[852,12]]},"177":{"position":[[781,14]]},"185":{"position":[[550,9]]},"189":{"position":[[25,13]]},"191":{"position":[[25,13]]}}}],["conform",{"_index":301,"t":{"41":{"position":[[47,10]]},"55":{"position":[[46,7],[192,7],[355,10],[1375,7]]},"119":{"position":[[47,10]]},"126":{"position":[[20,10],[81,10],[141,10],[205,10],[274,10]]}}}],["confus",{"_index":1584,"t":{"292":{"position":[[256,10]]}}}],["conic",{"_index":395,"t":{"55":{"position":[[802,5]]}}}],["consid",{"_index":1006,"t":{"154":{"position":[[533,8]]},"181":{"position":[[83,8]]},"198":{"position":[[152,8]]},"200":{"position":[[165,8],[1542,8]]},"252":{"position":[[255,8]]}}}],["consist",{"_index":341,"t":{"45":{"position":[[436,10]]},"213":{"position":[[39,11]]}}}],["consol",{"_index":1434,"t":{"235":{"position":[[131,9]]}}}],["console.error(evt.error",{"_index":527,"t":{"61":{"position":[[689,24]]}}}],["const",{"_index":276,"t":{"35":{"position":[[328,5],[771,5]]},"39":{"position":[[196,5],[733,5]]},"65":{"position":[[252,5],[285,5],[623,5],[656,5]]},"82":{"position":[[314,5],[359,5],[445,5],[887,5],[934,5],[1022,5]]},"95":{"position":[[217,5],[713,5]]},"104":{"position":[[301,5],[696,5]]},"117":{"position":[[300,5],[455,5],[1043,5],[1198,5]]},"142":{"position":[[238,5],[271,5],[533,5],[566,5],[1044,5],[1079,5],[1451,5],[1486,5]]},"177":{"position":[[260,5],[415,5]]},"185":{"position":[[1149,5]]},"191":{"position":[[143,5]]},"193":{"position":[[455,5],[550,5],[646,5],[698,5]]},"196":{"position":[[1160,5],[1442,5]]},"200":{"position":[[312,5],[374,5],[434,5],[466,5],[1068,5],[1652,5]]},"202":{"position":[[142,5],[175,5],[225,5]]},"217":{"position":[[300,5]]},"233":{"position":[[165,5],[234,5]]}}}],["constant",{"_index":308,"t":{"41":{"position":[[199,8]]},"98":{"position":[[682,8]]}}}],["constrain",{"_index":459,"t":{"57":{"position":[[1753,11]]},"193":{"position":[[133,9]]}}}],["constraint",{"_index":171,"t":{"6":{"position":[[471,10]]},"193":{"position":[[32,11]]},"205":{"position":[[957,11]]}}}],["construct",{"_index":420,"t":{"57":{"position":[[132,12]]},"63":{"position":[[119,9],[253,12],[1707,12]]}}}],["constructor",{"_index":355,"t":{"51":{"position":[[94,11]]}}}],["contain",{"_index":103,"t":{"4":{"position":[[680,10]]},"11":{"position":[[71,10]]},"20":{"position":[[71,10]]},"22":{"position":[[198,9]]},"29":{"position":[[71,10]]},"53":{"position":[[16,9],[119,9]]},"59":{"position":[[1586,10]]},"61":{"position":[[920,7],[962,8],[1199,7],[1241,8],[1466,10],[2088,7],[2130,8],[2734,7],[2776,8],[3066,7],[3108,8],[3377,7],[3419,8],[3727,7],[3769,8],[3983,7],[4025,8],[4241,7],[4283,8],[4503,7],[4545,8]]},"76":{"position":[[1303,10]]},"89":{"position":[[71,10]]},"98":{"position":[[341,9],[450,10],[971,10]]},"111":{"position":[[153,10]]},"117":{"position":[[70,7]]},"130":{"position":[[554,8]]},"132":{"position":[[138,10],[219,10],[296,10],[374,10],[481,10]]},"142":{"position":[[68,8]]},"144":{"position":[[83,8],[282,8],[327,10]]},"239":{"position":[[440,7]]}}}],["containerid",{"_index":238,"t":{"22":{"position":[[101,12]]}}}],["content",{"_index":701,"t":{"63":{"position":[[3126,8]]},"73":{"position":[[866,7],[943,8]]},"132":{"position":[[389,8]]},"134":{"position":[[1529,9]]}}}],["context",{"_index":558,"t":{"61":{"position":[[3281,7]]},"272":{"position":[[202,7]]}}}],["context.provid",{"_index":728,"t":{"69":{"position":[[2,16]]}}}],["contextprovid",{"_index":1312,"t":{"207":{"position":[[471,16]]}}}],["continu",{"_index":1122,"t":{"185":{"position":[[276,8]]},"196":{"position":[[647,10]]},"264":{"position":[[221,8]]}}}],["contribut",{"_index":54,"t":{"2":{"position":[[961,11]]},"148":{"position":[[30,11]]},"164":{"position":[[79,12]]}}}],["control",{"_index":136,"t":{"4":{"position":[[1375,11]]},"13":{"position":[[340,7]]},"22":{"position":[[349,7]]},"33":{"position":[[399,7]]},"35":{"position":[[432,7],[877,7]]},"61":{"position":[[4874,10],[5898,10],[6577,10],[7258,10]]},"91":{"position":[[346,7]]},"111":{"position":[[63,7]]},"113":{"position":[[208,7]]},"124":{"position":[[19,7]]},"136":{"position":[[68,9],[547,11]]},"138":{"position":[[778,8],[854,7],[959,7],[1090,7],[1151,7]]},"187":{"position":[[269,11]]},"193":{"position":[[175,10]]},"196":{"position":[[359,8]]},"207":{"position":[[407,8]]},"211":{"position":[[630,8]]},"215":{"position":[[85,9]]},"217":{"position":[[211,11]]},"221":{"position":[[215,10]]},"248":{"position":[[68,10],[562,8]]},"280":{"position":[[227,7]]},"284":{"position":[[84,8]]},"288":{"position":[[724,7]]},"290":{"position":[[194,7]]}}}],["control'",{"_index":221,"t":{"11":{"position":[[61,9]]},"20":{"position":[[61,9]]},"29":{"position":[[61,9]]},"89":{"position":[[61,9]]},"111":{"position":[[143,9]]}}}],["control.t",{"_index":236,"t":{"15":{"position":[[12,10]]},"24":{"position":[[11,10]]},"37":{"position":[[10,10]]},"93":{"position":[[11,10]]},"115":{"position":[[6,10]]},"140":{"position":[[4,10]]}}}],["controller_opt",{"_index":1371,"t":{"217":{"position":[[306,15],[409,20]]}}}],["controlposit",{"_index":872,"t":{"128":{"position":[[0,16]]},"138":{"position":[[112,16],[301,16],[540,16]]}}}],["cooperativegestur",{"_index":1352,"t":{"213":{"position":[[1335,19]]}}}],["coord",{"_index":917,"t":{"134":{"position":[[1549,6],[1953,7]]}}}],["coordin",{"_index":789,"t":{"98":{"position":[[211,11]]},"117":{"position":[[420,12],[1163,12]]},"130":{"position":[[484,11]]},"134":{"position":[[1556,10]]},"177":{"position":[[380,12]]}}}],["copi",{"_index":405,"t":{"55":{"position":[[1061,6]]},"231":{"position":[[371,4]]}}}],["core",{"_index":145,"t":{"4":{"position":[[1489,4]]}}}],["correctli",{"_index":112,"t":{"4":{"position":[[866,10]]}}}],["correspond",{"_index":497,"t":{"59":{"position":[[1697,13]]}}}],["counter",{"_index":444,"t":{"57":{"position":[[1305,7]]}}}],["counterpart",{"_index":1355,"t":{"215":{"position":[[147,13]]},"244":{"position":[[437,13]]}}}],["cover",{"_index":988,"t":{"154":{"position":[[55,7]]}}}],["crash",{"_index":1385,"t":{"219":{"position":[[220,5]]},"280":{"position":[[515,5]]}}}],["creat",{"_index":47,"t":{"2":{"position":[[845,6]]},"4":{"position":[[23,7],[1296,7]]},"39":{"position":[[30,6]]},"117":{"position":[[30,6]]},"136":{"position":[[31,6]]},"138":{"position":[[573,7],[752,6]]},"183":{"position":[[1092,6]]},"185":{"position":[[886,8]]},"196":{"position":[[744,6]]},"280":{"position":[[411,6]]}}}],["creation",{"_index":1553,"t":{"280":{"position":[[608,9]]}}}],["csp",{"_index":700,"t":{"63":{"position":[[3122,3]]}}}],["css",{"_index":218,"t":{"11":{"position":[[22,3]]},"20":{"position":[[22,3]]},"29":{"position":[[22,3]]},"53":{"position":[[129,4]]},"76":{"position":[[1255,3]]},"89":{"position":[[22,3]]},"98":{"position":[[418,3],[859,3],[924,3]]},"111":{"position":[[104,3]]},"172":{"position":[[686,3]]},"179":{"position":[[158,3]]},"200":{"position":[[1529,3]]},"272":{"position":[[66,3]]}}}],["cssproperti",{"_index":217,"t":{"11":{"position":[[7,14]]},"20":{"position":[[7,14]]},"29":{"position":[[7,14]]},"53":{"position":[[37,14]]},"76":{"position":[[1240,14]]},"89":{"position":[[7,14]]},"98":{"position":[[909,14]]},"111":{"position":[[89,14]]}}}],["current",{"_index":365,"t":{"53":{"position":[[170,7]]},"55":{"position":[[1237,7]]},"61":{"position":[[475,9]]},"134":{"position":[[1990,7]]},"142":{"position":[[244,9],[539,9],[777,7]]},"144":{"position":[[10,10],[293,7]]},"202":{"position":[[63,9]]}}}],["cursor",{"_index":363,"t":{"53":{"position":[[134,7],[178,6]]},"61":{"position":[[990,6],[1269,6],[1441,6],[1896,6],[1938,6],[1996,6],[2158,6],[2804,6],[3136,6],[3447,6],[3797,6],[4053,6],[4311,6],[4573,6]]},"213":{"position":[[1193,7],[1209,6],[1252,6]]}}}],["custom",{"_index":843,"t":{"124":{"position":[[12,6],[67,6]]},"136":{"position":[[57,6]]},"142":{"position":[[25,6]]},"179":{"position":[[20,6]]},"185":{"position":[[619,6],[735,6]]},"211":{"position":[[295,6]]},"215":{"position":[[234,6]]},"248":{"position":[[79,15]]},"288":{"position":[[994,13]]}}}],["customattribut",{"_index":227,"t":{"13":{"position":[[192,17]]}}}],["customattribution=\"map",{"_index":213,"t":{"8":{"position":[[458,22],[861,22]]}}}],["customiz",{"_index":1489,"t":{"248":{"position":[[193,12]]}}}],["customlayerinterfac",{"_index":845,"t":{"124":{"position":[[43,21]]}}}],["customli",{"_index":1081,"t":{"179":{"position":[[185,8]]}}}],["data",{"_index":44,"t":{"2":{"position":[[805,4],[874,4]]},"4":{"position":[[172,4],[1143,4]]},"61":{"position":[[8085,4]]},"63":{"position":[[1225,4]]},"117":{"position":[[766,5],[1516,5]]},"177":{"position":[[15,4],[655,5],[758,4],[863,4]]},"181":{"position":[[37,4],[203,4],[386,5],[477,5]]},"183":{"position":[[534,4]]},"187":{"position":[[636,4]]}}}],["data={geojson",{"_index":836,"t":{"117":{"position":[[787,15],[1537,15]]},"177":{"position":[[676,15]]}}}],["data={vehiclesgeojson",{"_index":1271,"t":{"200":{"position":[[1954,23]]}}}],["dataset",{"_index":1087,"t":{"181":{"position":[[306,9]]}}}],["datatyp",{"_index":912,"t":{"134":{"position":[[1305,9],[1425,9]]}}}],["date",{"_index":1459,"t":{"242":{"position":[[8,5]]},"244":{"position":[[8,5]]},"246":{"position":[[8,5]]},"250":{"position":[[8,5]]},"254":{"position":[[8,5]]},"258":{"position":[[8,5]]},"262":{"position":[[8,5]]},"266":{"position":[[8,5]]},"270":{"position":[[8,5]]},"274":{"position":[[8,5]]},"278":{"position":[[9,5]]},"282":{"position":[[8,5]]},"286":{"position":[[8,5]]},"296":{"position":[[0,5]]}}}],["debug",{"_index":927,"t":{"134":{"position":[[2378,9]]},"150":{"position":[[300,11]]}}}],["dec",{"_index":1496,"t":{"250":{"position":[[14,3]]}}}],["decend",{"_index":963,"t":{"144":{"position":[[227,9]]}}}],["decid",{"_index":1143,"t":{"187":{"position":[[464,6]]}}}],["decis",{"_index":1030,"t":{"162":{"position":[[119,8]]},"244":{"position":[[150,10]]}}}],["deck.gl",{"_index":110,"t":{"4":{"position":[[794,8]]},"181":{"position":[[241,7],[531,7]]},"205":{"position":[[1355,8],[1372,7]]},"231":{"position":[[205,7]]}}}],["deck.gl'",{"_index":1311,"t":{"207":{"position":[[461,9]]}}}],["deckgl",{"_index":1298,"t":{"205":{"position":[[1333,6]]}}}],["default",{"_index":210,"t":{"8":{"position":[[389,7],[792,7]]},"13":{"position":[[299,8]]},"22":{"position":[[181,8],[311,8]]},"33":{"position":[[358,8]]},"43":{"position":[[255,7]]},"49":{"position":[[94,7]]},"51":{"position":[[245,7]]},"53":{"position":[[52,8],[150,8]]},"55":{"position":[[278,8],[481,8],[1029,8],[1139,8]]},"57":{"position":[[397,7],[484,7],[701,7],[771,7],[821,7],[885,7],[957,7],[1360,8],[1434,8],[1504,8],[1576,8],[1642,8],[1720,8]]},"59":{"position":[[18,8],[145,8],[288,8],[426,8],[609,8],[735,8],[934,8],[1137,8],[1353,8]]},"61":{"position":[[673,8]]},"63":{"position":[[279,8],[1291,7],[1392,8],[1505,8],[1523,8],[2306,8],[2643,8],[2878,8],[3242,7]]},"73":{"position":[[959,7]]},"76":{"position":[[20,8],[258,8],[435,8],[800,8],[998,8]]},"91":{"position":[[308,8]]},"98":{"position":[[518,8],[821,8]]},"111":{"position":[[18,8],[206,8]]},"113":{"position":[[170,8]]},"119":{"position":[[504,7]]},"205":{"position":[[648,7]]},"211":{"position":[[135,8]]},"213":{"position":[[174,8],[220,8],[280,7]]},"217":{"position":[[192,7]]},"219":{"position":[[52,7]]},"229":{"position":[[132,7],[205,7]]},"235":{"position":[[461,9],[489,9]]},"288":{"position":[[232,9]]},"298":{"position":[[84,8]]},"300":{"position":[[107,7]]}}}],["defaultprev",{"_index":907,"t":{"134":{"position":[[311,17],[519,17],[763,17]]}}}],["defin",{"_index":307,"t":{"41":{"position":[[190,8]]},"55":{"position":[[922,6]]},"119":{"position":[[202,6]]},"126":{"position":[[360,7],[464,7],[571,7],[677,7],[776,7],[880,7],[981,7],[1079,7],[1179,7],[1276,7],[1378,7],[1483,7],[1586,7],[1690,7],[1792,7],[1897,7],[2006,7]]},"185":{"position":[[1060,8]]},"196":{"position":[[399,6],[1833,8]]},"205":{"position":[[245,7],[490,7]]},"219":{"position":[[276,8]]}}}],["defineplugin",{"_index":1204,"t":{"196":{"position":[[1166,14],[1241,14]]}}}],["degre",{"_index":440,"t":{"57":{"position":[[1175,7],[1297,7]]},"76":{"position":[[847,8]]},"130":{"position":[[911,8],[976,8]]}}}],["dem",{"_index":870,"t":{"126":{"position":[[1914,3]]}}}],["demot",{"_index":1297,"t":{"205":{"position":[[1226,7]]}}}],["depend",{"_index":975,"t":{"150":{"position":[[146,13]]},"183":{"position":[[108,9]]},"205":{"position":[[82,11],[922,10],[1254,10]]},"207":{"position":[[340,9],[637,6]]},"209":{"position":[[119,13],[268,11]]},"217":{"position":[[152,11]]},"221":{"position":[[86,10]]},"223":{"position":[[158,10],[335,13]]},"237":{"position":[[234,10]]},"242":{"position":[[371,11]]},"252":{"position":[[42,10]]},"256":{"position":[[295,10]]},"264":{"position":[[493,10]]},"284":{"position":[[210,10]]}}}],["deploy",{"_index":1190,"t":{"196":{"position":[[633,8],[874,9]]}}}],["deprec",{"_index":992,"t":{"154":{"position":[[220,12]]},"221":{"position":[[250,10]]},"225":{"position":[[69,10]]},"235":{"position":[[19,9]]},"272":{"position":[[846,10]]}}}],["deriv",{"_index":1098,"t":{"183":{"position":[[90,7]]}}}],["describ",{"_index":377,"t":{"55":{"position":[[380,9]]},"154":{"position":[[466,8]]}}}],["descript",{"_index":13,"t":{"2":{"position":[[137,11]]},"154":{"position":[[335,11]]}}}],["descriptor",{"_index":1542,"t":{"272":{"position":[[711,11]]}}}],["design",{"_index":130,"t":{"4":{"position":[[1225,8]]},"8":{"position":[[481,6],[884,6]]},"229":{"position":[[152,8]]}}}],["desir",{"_index":339,"t":{"45":{"position":[[392,8]]},"63":{"position":[[1930,9]]}}}],["destroy",{"_index":1551,"t":{"280":{"position":[[422,7]]}}}],["detail",{"_index":846,"t":{"124":{"position":[[163,8]]},"134":{"position":[[2300,7]]},"177":{"position":[[744,7]]},"213":{"position":[[1078,8]]},"248":{"position":[[273,8]]},"264":{"position":[[376,8]]}}}],["dev",{"_index":982,"t":{"150":{"position":[[286,3]]},"196":{"position":[[382,3]]}}}],["develop",{"_index":56,"t":{"2":{"position":[[981,9]]},"55":{"position":[[908,10]]},"150":{"position":[[32,11]]},"160":{"position":[[13,11]]},"196":{"position":[[771,11]]},"215":{"position":[[298,10]]},"264":{"position":[[584,10]]}}}],["deviat",{"_index":139,"t":{"4":{"position":[[1425,7]]},"6":{"position":[[381,7]]}}}],["devic",{"_index":531,"t":{"61":{"position":[[816,6],[1094,6],[1375,6],[1629,6],[1852,6],[2265,6],[2484,6],[2603,6],[2909,6]]}}}],["dif",{"_index":305,"t":{"41":{"position":[[155,7]]},"55":{"position":[[1160,7]]},"272":{"position":[[306,7],[344,8]]},"290":{"position":[[412,7]]}}}],["diff",{"_index":413,"t":{"55":{"position":[[1302,4]]}}}],["differ",{"_index":173,"t":{"6":{"position":[[494,6]]},"51":{"position":[[184,9],[223,9]]}}}],["dimens",{"_index":1533,"t":{"272":{"position":[[9,10]]}}}],["direct",{"_index":954,"t":{"142":{"position":[[797,6]]},"215":{"position":[[177,10]]}}}],["directli",{"_index":162,"t":{"6":{"position":[[278,8],[441,8]]},"65":{"position":[[1076,8]]},"69":{"position":[[81,8]]},"134":{"position":[[2412,8]]},"244":{"position":[[587,8],[678,8]]},"300":{"position":[[397,8]]}}}],["disabl",{"_index":209,"t":{"8":{"position":[[377,7],[780,7]]}}}],["discuss",{"_index":1361,"t":{"215":{"position":[[445,10]]},"252":{"position":[[277,9]]}}}],["disencourag",{"_index":177,"t":{"6":{"position":[[584,13]]}}}],["dispatch",{"_index":1251,"t":{"200":{"position":[[440,8]]}}}],["dispatch({typ",{"_index":1253,"t":{"200":{"position":[[502,15]]}}}],["display",{"_index":1102,"t":{"183":{"position":[[396,10],[552,8]]}}}],["displaycontrolsdefault={fals",{"_index":940,"t":{"136":{"position":[[516,30]]}}}],["distanc",{"_index":800,"t":{"98":{"position":[[622,8]]},"111":{"position":[[236,9]]}}}],["distort",{"_index":401,"t":{"55":{"position":[[976,11]]}}}],["distribut",{"_index":1175,"t":{"196":{"position":[[110,10]]}}}],["diverg",{"_index":1464,"t":{"242":{"position":[[57,10]]}}}],["do",{"_index":167,"t":{"6":{"position":[[339,5]]}}}],["doc",{"_index":0,"t":{"2":{"position":[[6,4]]}}}],["docs/api",{"_index":991,"t":{"154":{"position":[[179,8]]}}}],["docs/upgrad",{"_index":993,"t":{"154":{"position":[[250,12]]}}}],["docs/what",{"_index":996,"t":{"154":{"position":[[316,10]]}}}],["document",{"_index":361,"t":{"51":{"position":[[309,14]]},"124":{"position":[[145,13]]},"154":{"position":[[96,13],[162,13]]},"196":{"position":[[691,13]]},"205":{"position":[[841,14]]},"213":{"position":[[0,13],[1060,13]]},"252":{"position":[[295,9]]},"288":{"position":[[754,14]]},"300":{"position":[[80,14]]}}}],["dom",{"_index":241,"t":{"22":{"position":[[132,3]]},"179":{"position":[[151,3]]},"200":{"position":[[1513,3]]}}}],["domain",{"_index":1201,"t":{"196":{"position":[[1060,6]]}}}],["don't",{"_index":1415,"t":{"231":{"position":[[324,5]]}}}],["done",{"_index":1277,"t":{"202":{"position":[[128,4]]}}}],["dotenv",{"_index":1185,"t":{"196":{"position":[[516,6]]}}}],["doubl",{"_index":464,"t":{"59":{"position":[[172,7]]},"229":{"position":[[473,6]]}}}],["doubleclickzoom",{"_index":463,"t":{"59":{"position":[[119,16]]},"288":{"position":[[644,16]]}}}],["doubleclickzoomhandl",{"_index":466,"t":{"59":{"position":[[223,22]]}}}],["doubt",{"_index":359,"t":{"51":{"position":[[269,6]]}}}],["down",{"_index":121,"t":{"4":{"position":[[1041,4],[1161,5]]}}}],["download",{"_index":508,"t":{"61":{"position":[[157,10]]}}}],["drag",{"_index":468,"t":{"59":{"position":[[315,5],[453,5],[961,5]]},"61":{"position":[[5387,5],[5495,5],[5586,5]]},"76":{"position":[[69,7]]},"78":{"position":[[129,8],[221,9],[308,8]]},"200":{"position":[[910,8]]},"284":{"position":[[35,4]]}}}],["draggabl",{"_index":740,"t":{"76":{"position":[[0,10]]},"78":{"position":[[149,9],[234,9],[326,9]]},"272":{"position":[[386,9],[445,10]]}}}],["draggablepointsoverlay",{"_index":1411,"t":{"231":{"position":[[69,24]]},"290":{"position":[[539,23]]}}}],["dragpan",{"_index":470,"t":{"59":{"position":[[399,8]]},"217":{"position":[[326,8]]},"288":{"position":[[635,8]]}}}],["dragpanhandler.en",{"_index":473,"t":{"59":{"position":[[547,21]]}}}],["dragrot",{"_index":467,"t":{"59":{"position":[[267,11]]},"217":{"position":[[349,11]]},"235":{"position":[[478,10]]},"290":{"position":[[174,11]]}}}],["dragrotatehandl",{"_index":469,"t":{"59":{"position":[[360,17]]}}}],["draw",{"_index":100,"t":{"4":{"position":[[647,4]]},"136":{"position":[[120,6]]},"244":{"position":[[701,5]]},"260":{"position":[[231,7],[260,5]]}}}],["drawcontrol",{"_index":938,"t":{"136":{"position":[[483,12]]}}}],["drawcontrol(prop",{"_index":933,"t":{"136":{"position":[[182,18]]}}}],["drawcontrolprop",{"_index":934,"t":{"136":{"position":[[201,17]]}}}],["drawn",{"_index":513,"t":{"61":{"position":[[300,5]]},"179":{"position":[[194,5]]}}}],["drive",{"_index":69,"t":{"4":{"position":[[164,7]]}}}],["drop",{"_index":1546,"t":{"272":{"position":[[814,7]]}}}],["dure",{"_index":578,"t":{"61":{"position":[[4796,6],[5486,6],[5814,6],[6485,6],[7172,6]]},"187":{"position":[[404,6]]},"198":{"position":[[134,6]]},"248":{"position":[[489,6]]}}}],["dynam",{"_index":316,"t":{"43":{"position":[[104,12]]},"45":{"position":[[185,7],[370,7]]},"63":{"position":[[718,7]]},"98":{"position":[[284,11]]},"119":{"position":[[352,12]]},"177":{"position":[[842,11]]}}}],["e.g",{"_index":1115,"t":{"183":{"position":[[1133,3]]},"193":{"position":[[60,4]]},"196":{"position":[[443,4],[1892,5]]},"213":{"position":[[671,5]]},"252":{"position":[[188,5]]}}}],["each",{"_index":90,"t":{"4":{"position":[[530,4]]},"31":{"position":[[60,4],[178,4],[307,4]]},"43":{"position":[[160,4]]},"61":{"position":[[1504,4]]},"98":{"position":[[742,4]]},"119":{"position":[[408,4]]},"144":{"position":[[153,4]]}}}],["earth",{"_index":383,"t":{"55":{"position":[[598,5],[742,5]]}}}],["eas",{"_index":1484,"t":{"248":{"position":[[102,6]]},"256":{"position":[[210,4]]}}}],["easeto",{"_index":1550,"t":{"280":{"position":[[62,7]]}}}],["east",{"_index":886,"t":{"130":{"position":[[358,5]]}}}],["ecosystem",{"_index":1083,"t":{"181":{"position":[[164,10]]}}}],["edit",{"_index":1096,"t":{"181":{"position":[[514,7]]}}}],["effort",{"_index":1348,"t":{"213":{"position":[[1123,6]]}}}],["element",{"_index":242,"t":{"22":{"position":[[136,7],[208,7]]},"43":{"position":[[165,7]]},"61":{"position":[[1545,9]]},"119":{"position":[[413,7]]}}}],["element'",{"_index":743,"t":{"76":{"position":[[340,9]]}}}],["emb",{"_index":1064,"t":{"172":{"position":[[656,5]]}}}],["embed",{"_index":626,"t":{"63":{"position":[[532,9]]}}}],["embrac",{"_index":74,"t":{"4":{"position":[[249,7]]}}}],["empir",{"_index":1162,"t":{"193":{"position":[[433,6]]}}}],["empti",{"_index":373,"t":{"55":{"position":[[287,6]]},"213":{"position":[[351,5]]}}}],["enabl",{"_index":41,"t":{"2":{"position":[[727,6]]},"55":{"position":[[1153,6]]},"59":{"position":[[71,8],[210,8],[347,8],[482,8],[655,8],[794,8],[992,8],[1206,8]]},"63":{"position":[[739,6]]},"181":{"position":[[498,7]]},"211":{"position":[[144,9]]},"217":{"position":[[181,7]]},"272":{"position":[[578,6]]},"288":{"position":[[981,7]]}}}],["end",{"_index":332,"t":{"45":{"position":[[134,3]]},"61":{"position":[[5612,5],[7822,5]]},"78":{"position":[[317,5]]}}}],["endpoint",{"_index":1282,"t":{"205":{"position":[[125,8]]},"242":{"position":[[121,8],[161,8],[279,9]]}}}],["ensur",{"_index":790,"t":{"98":{"position":[[303,6]]}}}],["enter",{"_index":517,"t":{"61":{"position":[[409,6],[1517,6],[1654,6]]}}}],["entir",{"_index":1455,"t":{"239":{"position":[[792,6]]},"244":{"position":[[785,8]]}}}],["env",{"_index":1187,"t":{"196":{"position":[[561,4],[576,4]]}}}],["environ",{"_index":704,"t":{"63":{"position":[[3152,11]]},"183":{"position":[[1016,11],[1179,11]]},"196":{"position":[[386,12],[422,11],[722,11]]}}}],["equal",{"_index":382,"t":{"55":{"position":[[592,5]]}}}],["equalearth",{"_index":384,"t":{"55":{"position":[[604,15]]}}}],["equirectangular",{"_index":387,"t":{"55":{"position":[[655,20]]}}}],["equirectangular/pl",{"_index":385,"t":{"55":{"position":[[620,21]]}}}],["equival",{"_index":757,"t":{"76":{"position":[[1209,10]]},"280":{"position":[[29,10]]}}}],["equivel",{"_index":160,"t":{"6":{"position":[[223,12]]},"63":{"position":[[2557,10]]}}}],["error",{"_index":256,"t":{"31":{"position":[[235,6]]},"61":{"position":[[729,5]]},"134":{"position":[[1640,7],[1680,6],[1687,5],[2315,6]]},"205":{"position":[[467,5]]},"248":{"position":[[455,5]]}}}],["errorev",{"_index":526,"t":{"61":{"position":[[652,11]]},"134":{"position":[[1585,11]]}}}],["es6",{"_index":1591,"t":{"300":{"position":[[229,3]]}}}],["esm",{"_index":1474,"t":{"244":{"position":[[335,3]]}}}],["etc",{"_index":418,"t":{"57":{"position":[[101,4]]},"59":{"position":[[1442,5]]},"61":{"position":[[5154,6]]},"196":{"position":[[853,5]]},"207":{"position":[[450,5]]},"239":{"position":[[111,4]]},"244":{"position":[[563,5]]},"290":{"position":[[186,4]]},"300":{"position":[[310,4]]}}}],["even",{"_index":34,"t":{"2":{"position":[[543,4]]}}}],["event",{"_index":32,"t":{"2":{"position":[[522,6]]},"59":{"position":[[1418,5],[1550,5],[1658,5],[1711,5],[1756,5],[1836,7]]},"61":{"position":[[10,7],[83,7],[245,7],[329,7],[569,7],[644,7],[756,7],[909,5],[1034,7],[1188,5],[1315,7],[1488,5],[1569,7],[1792,7],[1965,5],[2077,5],[2205,7],[2427,7],[2543,7],[2723,5],[2849,7],[3055,5],[3184,7],[3366,5],[3489,7],[3541,5],[3584,7],[3646,5],[3716,5],[3842,7],[3902,5],[3972,5],[4099,7],[4160,5],[4230,5],[4359,7],[4422,5],[4492,5],[4619,7],[4739,7],[5207,7],[5334,7],[5429,7],[5533,7],[5631,7],[5757,7],[6157,7],[6292,7],[6428,7],[6844,7],[6986,7],[7115,7],[7520,7],[7658,7],[7751,7],[8008,7],[8160,7],[8295,7]]},"63":{"position":[[2073,6]]},"134":{"position":[[62,5],[121,5],[894,5]]},"183":{"position":[[358,6]]},"198":{"position":[[748,5]]},"213":{"position":[[999,5]]},"284":{"position":[[0,5]]},"288":{"position":[[928,5],[948,5],[1011,5]]},"298":{"position":[[128,5]]}}}],["event.viewst",{"_index":579,"t":{"61":{"position":[[4896,15]]}}}],["event.viewstate.bear",{"_index":595,"t":{"61":{"position":[[6599,23]]}}}],["event.viewstate.pitch",{"_index":599,"t":{"61":{"position":[[7280,21]]}}}],["event.viewstate.zoom",{"_index":591,"t":{"61":{"position":[[5920,20]]}}}],["event:mapboxzoomev",{"_index":605,"t":{"61":{"position":[[7845,23]]}}}],["eventrecognizeropt",{"_index":1351,"t":{"213":{"position":[[1285,22]]},"248":{"position":[[288,22]]}}}],["evt",{"_index":249,"t":{"31":{"position":[[13,5],[132,5],[260,5],[438,5],[560,5]]},"61":{"position":[[682,3]]},"78":{"position":[[9,5],[85,5],[176,5],[264,5]]},"100":{"position":[[8,5],[77,5]]}}}],["evt.viewst",{"_index":1255,"t":{"200":{"position":[[543,16]]}}}],["exampl",{"_index":82,"t":{"4":{"position":[[381,8]]},"6":{"position":[[409,8]]},"55":{"position":[[992,8]]},"57":{"position":[[260,9]]},"61":{"position":[[5186,9]]},"63":{"position":[[1997,7]]},"65":{"position":[[931,8]]},"136":{"position":[[615,7]]},"142":{"position":[[1649,7]]},"166":{"position":[[52,9]]},"177":{"position":[[932,9]]},"179":{"position":[[253,7]]},"183":{"position":[[919,7],[1257,9]]},"185":{"position":[[104,8],[502,7],[1131,7]]},"189":{"position":[[48,7]]},"191":{"position":[[48,7],[465,7],[502,7]]},"193":{"position":[[211,7]]},"198":{"position":[[187,7]]},"211":{"position":[[597,7],[769,8]]},"213":{"position":[[725,8],[837,8],[1234,7]]},"231":{"position":[[23,8],[153,9]]},"242":{"position":[[408,8]]},"248":{"position":[[635,8]]},"256":{"position":[[318,8]]},"260":{"position":[[202,8],[218,7]]},"288":{"position":[[841,9],[867,8]]},"290":{"position":[[647,9]]}}}],["exceed",{"_index":1109,"t":{"183":{"position":[[826,9]]}}}],["execut",{"_index":84,"t":{"4":{"position":[[414,7]]}}}],["exhaust",{"_index":357,"t":{"51":{"position":[[154,10]]}}}],["exist",{"_index":327,"t":{"45":{"position":[[31,8]]},"152":{"position":[[187,6]]}}}],["expand",{"_index":1239,"t":{"198":{"position":[[858,9]]},"288":{"position":[[783,8]]}}}],["experi",{"_index":1493,"t":{"248":{"position":[[357,11]]}}}],["experiment",{"_index":1365,"t":{"217":{"position":[[39,12]]},"280":{"position":[[336,15]]},"288":{"position":[[1026,15]]}}}],["experimental.mapcontrol",{"_index":1391,"t":{"221":{"position":[[104,24]]}}}],["explicitli",{"_index":1294,"t":{"205":{"position":[[1035,10]]},"213":{"position":[[254,10]]},"223":{"position":[[295,10]]}}}],["export",{"_index":345,"t":{"49":{"position":[[102,6]]},"217":{"position":[[64,6]]},"221":{"position":[[97,6]]},"229":{"position":[[140,7]]},"239":{"position":[[130,8]]},"242":{"position":[[170,7]]},"256":{"position":[[120,7],[154,8]]}}}],["expos",{"_index":717,"t":{"65":{"position":[[828,7]]},"207":{"position":[[119,6]]},"213":{"position":[[924,7]]},"217":{"position":[[475,6]]},"242":{"position":[[467,6]]}}}],["extend",{"_index":944,"t":{"138":{"position":[[13,7],[149,7],[338,7]]}}}],["extern",{"_index":681,"t":{"63":{"position":[[2683,8]]},"200":{"position":[[25,10]]},"213":{"position":[[660,10]]}}}],["extrus",{"_index":850,"t":{"126":{"position":[[586,9]]}}}],["facilit",{"_index":729,"t":{"69":{"position":[[24,11]]}}}],["fade/transit",{"_index":523,"t":{"61":{"position":[[517,15]]}}}],["fall",{"_index":791,"t":{"98":{"position":[[320,5]]}}}],["fals",{"_index":408,"t":{"55":{"position":[[1194,6]]},"63":{"position":[[1514,5]]},"76":{"position":[[29,5]]},"213":{"position":[[183,6]]},"235":{"position":[[471,6]]}}}],["fast",{"_index":1304,"t":{"207":{"position":[[64,5]]},"244":{"position":[[268,4]]}}}],["faster",{"_index":1527,"t":{"264":{"position":[[606,6]]}}}],["favor",{"_index":1322,"t":{"211":{"position":[[246,5]]}}}],["featur",{"_index":495,"t":{"59":{"position":[[1517,7],[1568,8],[1622,9],[1778,8]]},"61":{"position":[[942,8],[971,8],[1221,8],[1250,8],[2110,8],[2139,8],[2756,8],[2785,8],[3088,8],[3117,8],[3399,8],[3428,8],[3749,8],[3778,8],[4005,8],[4034,8],[4263,8],[4292,8],[4525,8],[4554,8]]},"117":{"position":[[364,9],[383,10],[1107,9],[1126,10]]},"130":{"position":[[536,7]]},"134":{"position":[[337,10],[789,10]]},"152":{"position":[[154,7]]},"154":{"position":[[288,8]]},"177":{"position":[[324,9],[343,10]]},"179":{"position":[[200,8]]},"181":{"position":[[9,7]]},"185":{"position":[[393,8]]},"200":{"position":[[1728,9]]},"207":{"position":[[267,9]]},"215":{"position":[[385,7]]},"225":{"position":[[103,9]]},"264":{"position":[[277,8]]},"280":{"position":[[21,7]]},"288":{"position":[[918,9]]}}}],["featurecollect",{"_index":826,"t":{"117":{"position":[[264,19],[315,17],[343,20],[1007,19],[1058,17],[1086,20]]},"177":{"position":[[224,19],[275,17],[303,20]]},"200":{"position":[[1707,20]]}}}],["feb",{"_index":1466,"t":{"244":{"position":[[14,3]]}}}],["few",{"_index":1397,"t":{"225":{"position":[[115,3]]},"235":{"position":[[31,3]]},"244":{"position":[[737,4]]}}}],["field",{"_index":536,"t":{"61":{"position":[[951,5],[1230,5],[2119,5],[2765,5],[3097,5],[3408,5],[3758,5],[4014,5],[4272,5],[4534,5]]},"128":{"position":[[128,7]]},"130":{"position":[[594,7],[720,7]]},"134":{"position":[[39,7],[176,7],[412,7],[594,7],[871,7],[1096,7],[1252,7],[1372,7],[1626,7],[1738,7],[1887,7],[2124,7],[2484,7],[2586,7],[2731,7]]},"144":{"position":[[301,5]]},"200":{"position":[[2061,7]]},"239":{"position":[[465,6],[932,6]]}}}],["file",{"_index":1089,"t":{"181":{"position":[[341,4]]},"196":{"position":[[566,5]]}}}],["file(",{"_index":1417,"t":{"231":{"position":[[395,7]]}}}],["fill",{"_index":290,"t":{"39":{"position":[[253,7],[348,5],[790,7],[885,5]]},"126":{"position":[[581,4],[687,4]]}}}],["fillextrusionlay",{"_index":849,"t":{"126":{"position":[[532,19]]}}}],["filllay",{"_index":287,"t":{"39":{"position":[[163,11],[213,9],[691,11],[750,9]]},"126":{"position":[[647,10]]}}}],["filter",{"_index":292,"t":{"39":{"position":[[306,7],[843,7]]}}}],["final",{"_index":627,"t":{"63":{"position":[[549,5]]}}}],["find",{"_index":1044,"t":{"166":{"position":[[8,4]]},"172":{"position":[[366,4],[566,4]]},"219":{"position":[[285,4]]}}}],["fine",{"_index":1491,"t":{"248":{"position":[[329,4]]}}}],["finger",{"_index":1486,"t":{"248":{"position":[[132,6]]}}}],["fire",{"_index":542,"t":{"61":{"position":[[1499,4],[1976,4]]},"272":{"position":[[143,5]]}}}],["first",{"_index":58,"t":{"4":{"position":[[17,5]]},"13":{"position":[[87,5]]},"22":{"position":[[87,5]]},"33":{"position":[[87,5]]},"61":{"position":[[176,5]]},"80":{"position":[[87,5]]},"91":{"position":[[87,5]]},"102":{"position":[[87,5]]},"113":{"position":[[87,5]]},"237":{"position":[[100,5]]},"244":{"position":[[647,5]]}}}],["fitbound",{"_index":1419,"t":{"233":{"position":[[4,9]]},"244":{"position":[[553,9]]},"294":{"position":[[0,10],[11,9]]}}}],["fitboundsopt",{"_index":267,"t":{"33":{"position":[[198,16]]},"57":{"position":[[411,16]]}}}],["fitboundsoptions.maxzoom",{"_index":430,"t":{"57":{"position":[[566,25]]}}}],["fitboundsoptions.minzoom",{"_index":428,"t":{"57":{"position":[[533,25]]}}}],["fitboundsoptions.offset",{"_index":426,"t":{"57":{"position":[[498,24]]}}}],["fitboundsoptions.pad",{"_index":431,"t":{"57":{"position":[[599,25]]}}}],["flat/ortograph",{"_index":1590,"t":{"300":{"position":[[168,16]]}}}],["flow",{"_index":128,"t":{"4":{"position":[[1155,5]]},"191":{"position":[[421,6]]},"248":{"position":[[15,4]]}}}],["flyto",{"_index":582,"t":{"61":{"position":[[5033,6],[6058,6],[6740,6],[7419,6]]},"244":{"position":[[545,7]]},"280":{"position":[[52,5]]}}}],["flytointerpol",{"_index":1333,"t":{"211":{"position":[[687,17]]},"260":{"position":[[179,18]]}}}],["focus",{"_index":1090,"t":{"181":{"position":[[354,7]]}}}],["focusafteropen",{"_index":809,"t":{"102":{"position":[[208,14]]}}}],["fog",{"_index":366,"t":{"55":{"position":[[0,4],[5,4],[14,3],[61,3],[124,3]]},"126":{"position":[[66,4],[99,3]]}}}],["folder",{"_index":1112,"t":{"183":{"position":[[927,8]]}}}],["follow",{"_index":229,"t":{"13":{"position":[[219,10]]},"33":{"position":[[278,10]]},"43":{"position":[[31,9]]},"63":{"position":[[4,9]]},"91":{"position":[[228,10]]},"119":{"position":[[282,9]]},"122":{"position":[[4,9]]},"128":{"position":[[118,9]]},"130":{"position":[[567,9],[710,9]]},"132":{"position":[[4,9]]},"134":{"position":[[29,9],[166,9],[402,9],[584,9],[861,9],[1086,9],[1242,9],[1362,9],[1616,9],[1728,9],[1877,9],[2114,9],[2474,9],[2576,9],[2721,9]]},"156":{"position":[[13,7]]},"193":{"position":[[201,9]]},"196":{"position":[[680,6],[1089,9]]},"198":{"position":[[165,9]]},"200":{"position":[[178,9]]},"213":{"position":[[368,9],[1222,6]]},"233":{"position":[[95,8]]}}}],["forc",{"_index":409,"t":{"55":{"position":[[1201,5]]}}}],["forese",{"_index":1123,"t":{"185":{"position":[[316,11]]}}}],["fork",{"_index":16,"t":{"2":{"position":[[166,4],[606,5],[669,6],[740,5]]},"174":{"position":[[42,4],[284,7]]},"183":{"position":[[152,5]]},"185":{"position":[[479,4]]},"209":{"position":[[31,5]]}}}],["fork/path/to/styl",{"_index":1070,"t":{"174":{"position":[[198,18]]}}}],["forlook",{"_index":1,"t":{"2":{"position":[[15,10]]}}}],["format",{"_index":902,"t":{"132":{"position":[[527,7]]},"181":{"position":[[346,7],[450,7]]}}}],["found",{"_index":1012,"t":{"156":{"position":[[94,5]]}}}],["foundat",{"_index":1016,"t":{"158":{"position":[[38,11]]}}}],["foundation'",{"_index":1042,"t":{"164":{"position":[[45,12]]}}}],["frame",{"_index":516,"t":{"61":{"position":[[379,5]]},"200":{"position":[[887,5]]}}}],["framework",{"_index":1085,"t":{"181":{"position":[[265,9]]},"288":{"position":[[829,11]]}}}],["free",{"_index":22,"t":{"2":{"position":[[299,4],[460,4]]},"183":{"position":[[39,5],[785,4]]},"209":{"position":[[144,4]]}}}],["frequent",{"_index":660,"t":{"63":{"position":[[1958,10]]},"231":{"position":[[44,10]]}}}],["full",{"_index":244,"t":{"22":{"position":[[165,4],[229,4]]},"55":{"position":[[1209,6]]},"136":{"position":[[610,4]]},"142":{"position":[[1644,4]]},"179":{"position":[[248,4]]},"189":{"position":[[16,4]]},"191":{"position":[[16,4]]},"288":{"position":[[70,4],[989,4]]}}}],["fulli",{"_index":73,"t":{"4":{"position":[[243,5],[1306,5],[1369,5]]},"6":{"position":[[26,5]]},"207":{"position":[[83,5]]}}}],["fullscreen",{"_index":246,"t":{"24":{"position":[[0,10]]}}}],["fullscreencontrol",{"_index":237,"t":{"17":{"position":[[46,17],[151,19],[374,18],[450,19],[676,18]]},"268":{"position":[[16,18]]}}}],["function",{"_index":195,"t":{"8":{"position":[[194,8],[603,8]]},"17":{"position":[[192,8],[500,8]]},"26":{"position":[[190,8],[496,8]]},"35":{"position":[[311,8],[754,8]]},"39":{"position":[[377,8],[914,8]]},"49":{"position":[[216,8],[524,8]]},"63":{"position":[[662,8],[829,8],[1106,8]]},"65":{"position":[[235,8],[606,8]]},"69":{"position":[[225,8]]},"73":{"position":[[170,8],[536,8]]},"82":{"position":[[297,8],[870,8]]},"86":{"position":[[192,8],[500,8]]},"95":{"position":[[200,8],[696,8]]},"104":{"position":[[284,8],[679,8]]},"108":{"position":[[182,8],[480,8]]},"117":{"position":[[579,8],[1322,8]]},"136":{"position":[[173,8],[307,8]]},"142":{"position":[[139,8],[210,8],[434,8],[505,8],[888,8],[1016,8],[1295,8],[1423,8]]},"170":{"position":[[88,8],[466,8]]},"174":{"position":[[229,8]]},"177":{"position":[[539,8]]},"185":{"position":[[1071,8],[1139,9]]},"189":{"position":[[126,8]]},"191":{"position":[[126,8]]},"193":{"position":[[533,8]]},"200":{"position":[[291,8]]},"205":{"position":[[352,8],[606,8]]},"217":{"position":[[537,10]]},"233":{"position":[[65,8]]},"248":{"position":[[667,10]]}}}],["further",{"_index":1296,"t":{"205":{"position":[[1218,7]]}}}],["futur",{"_index":1124,"t":{"185":{"position":[[328,7],[435,6]]},"205":{"position":[[1270,6]]},"217":{"position":[[92,6]]},"239":{"position":[[728,6]]},"256":{"position":[[288,6]]}}}],["gener",{"_index":33,"t":{"2":{"position":[[533,9]]},"6":{"position":[[537,9]]},"152":{"position":[[79,9]]},"183":{"position":[[339,9]]},"198":{"position":[[727,9]]},"205":{"position":[[445,8]]}}}],["gentli",{"_index":1396,"t":{"225":{"position":[[62,6]]}}}],["geocod",{"_index":1478,"t":{"244":{"position":[[717,9]]}}}],["geocontrolref",{"_index":277,"t":{"35":{"position":[[334,13],[777,13]]}}}],["geocontrolref.curr",{"_index":281,"t":{"35":{"position":[[487,25],[932,25]]}}}],["geocontrolref.current?.trigg",{"_index":280,"t":{"35":{"position":[[450,33],[895,33]]}}}],["geofenc",{"_index":1157,"t":{"193":{"position":[[261,9],[461,8],[817,8],[868,10]]}}}],["geojson",{"_index":827,"t":{"117":{"position":[[289,10],[306,8],[1032,10],[1049,8]]},"126":{"position":[[1388,7]]},"130":{"position":[[528,7]]},"132":{"position":[[149,8]]},"177":{"position":[[249,10],[266,8],[902,7],[914,7]]},"181":{"position":[[506,7]]},"193":{"position":[[253,7]]}}}],["geojsonsourc",{"_index":895,"t":{"132":{"position":[[114,14],[162,13]]}}}],["geojsonsourceraw",{"_index":862,"t":{"126":{"position":[[1341,17]]}}}],["geoloc",{"_index":252,"t":{"31":{"position":[[65,11],[183,11],[312,11]]},"37":{"position":[[0,9]]}}}],["geolocatecontrol",{"_index":247,"t":{"26":{"position":[[46,16],[150,18],[372,17],[447,18],[672,17]]},"31":{"position":[[485,16],[607,16]]},"33":{"position":[[130,16]]},"35":{"position":[[22,16],[232,18],[526,17],[662,18],[971,17]]},"134":{"position":[[1799,16],[1916,16],[2153,16]]},"242":{"position":[[435,16]]},"248":{"position":[[503,16]]},"256":{"position":[[63,17]]},"268":{"position":[[35,16]]}}}],["geolocateerrorev",{"_index":255,"t":{"31":{"position":[[138,20]]},"134":{"position":[[2074,20]]}}}],["geolocateev",{"_index":260,"t":{"31":{"position":[[444,15],[566,15]]},"134":{"position":[[1693,15]]}}}],["geolocateresultev",{"_index":250,"t":{"31":{"position":[[19,21],[266,21]]},"134":{"position":[[1836,21]]}}}],["geolocationcoordin",{"_index":918,"t":{"134":{"position":[[1961,22]]}}}],["geolocationpositionerror",{"_index":923,"t":{"134":{"position":[[2253,24]]}}}],["geometri",{"_index":828,"t":{"117":{"position":[[394,9],[1137,9]]},"177":{"position":[[354,9]]},"181":{"position":[[419,11]]}}}],["geospati",{"_index":66,"t":{"4":{"position":[[134,10]]},"181":{"position":[[439,10]]},"288":{"position":[[818,10]]}}}],["gestur",{"_index":1487,"t":{"248":{"position":[[139,7]]},"288":{"position":[[99,8]]}}}],["get",{"_index":653,"t":{"63":{"position":[[1665,4],[1865,4]]}}}],["getcursor",{"_index":1347,"t":{"213":{"position":[[1087,9]]}}}],["getmap",{"_index":166,"t":{"6":{"position":[[322,7]]},"65":{"position":[[1231,9],[1241,9]]}}}],["gist",{"_index":1195,"t":{"196":{"position":[[838,6]]}}}],["git",{"_index":976,"t":{"150":{"position":[[160,3]]}}}],["github",{"_index":998,"t":{"154":{"position":[[350,6]]},"162":{"position":[[79,6]]},"196":{"position":[[336,6]]}}}],["gitignor",{"_index":1188,"t":{"196":{"position":[[584,10]]}}}],["give",{"_index":321,"t":{"43":{"position":[[155,4]]},"119":{"position":[[403,4]]}}}],["given",{"_index":410,"t":{"55":{"position":[[1268,5]]},"57":{"position":[[1772,5]]}}}],["gl",{"_index":6,"t":{"2":{"position":[[56,2],[101,2],[181,2],[236,2],[276,2],[388,2],[426,2],[603,2],[648,2],[937,3]]},"4":{"position":[[10,2],[306,2],[1219,2],[1293,2],[1340,3]]},"6":{"position":[[19,2],[93,2]]},"8":{"position":[[189,4]]},"17":{"position":[[187,4]]},"26":{"position":[[185,4]]},"35":{"position":[[267,4],[306,4],[749,4]]},"39":{"position":[[146,4],[191,4]]},"49":{"position":[[124,3],[211,4]]},"63":{"position":[[303,4],[335,2],[355,4],[623,4],[657,4],[824,4],[881,5],[996,2],[1101,4],[2346,2],[2367,2],[2393,2],[2950,2]]},"65":{"position":[[188,4],[230,4]]},"69":{"position":[[220,4]]},"73":{"position":[[165,4]]},"82":{"position":[[258,4],[292,4],[865,4]]},"86":{"position":[[187,4]]},"95":{"position":[[195,4]]},"104":{"position":[[245,4],[279,4],[674,4]]},"108":{"position":[[177,4]]},"117":{"position":[[200,4],[247,4],[631,5]]},"122":{"position":[[51,2]]},"136":{"position":[[117,2],[168,4],[361,5]]},"142":{"position":[[134,4],[883,4]]},"150":{"position":[[71,2]]},"156":{"position":[[10,2]]},"160":{"position":[[10,2]]},"162":{"position":[[49,2]]},"164":{"position":[[105,3]]},"168":{"position":[[16,2],[103,2],[113,2],[130,2],[162,2],[174,2]]},"170":{"position":[[83,4]]},"172":{"position":[[128,2],[302,2],[423,2],[443,3],[627,2],[649,3]]},"174":{"position":[[29,2],[152,4]]},"177":{"position":[[160,4],[207,4]]},"181":{"position":[[139,2]]},"183":{"position":[[10,2],[84,2],[134,2],[448,2]]},"185":{"position":[[195,2],[264,2],[494,3],[519,3],[633,2]]},"187":{"position":[[255,2]]},"189":{"position":[[121,4]]},"191":{"position":[[121,4]]},"193":{"position":[[330,4]]},"196":{"position":[[1720,2]]},"198":{"position":[[724,2]]},"200":{"position":[[286,4]]},"205":{"position":[[9,2],[51,2],[265,3],[309,4],[347,4],[677,5],[743,2],[919,2],[987,2],[1065,2],[1128,2]]},"207":{"position":[[363,2],[404,2]]},"209":{"position":[[11,2],[69,2]]},"215":{"position":[[144,2]]},"219":{"position":[[133,2]]},"223":{"position":[[18,2]]},"225":{"position":[[35,3]]},"227":{"position":[[52,2],[97,2],[159,2]]},"231":{"position":[[282,2],[529,2]]},"235":{"position":[[212,2]]},"237":{"position":[[77,3],[206,2]]},"239":{"position":[[258,4],[300,4],[679,2]]},"242":{"position":[[212,3],[239,2],[298,2],[340,2]]},"244":{"position":[[698,2],[714,2]]},"252":{"position":[[36,2]]},"256":{"position":[[268,2]]},"260":{"position":[[96,2],[257,2]]},"264":{"position":[[77,2],[440,2],[490,2],[662,3]]},"268":{"position":[[115,2]]},"280":{"position":[[465,2],[551,2]]},"284":{"position":[[153,2],[266,2],[305,2]]},"288":{"position":[[14,2],[34,2],[344,2]]},"290":{"position":[[323,2]]},"298":{"position":[[14,3],[30,2]]},"300":{"position":[[73,2],[449,4]]}}}],["gl'",{"_index":686,"t":{"63":{"position":[[2752,4],[3019,4]]},"252":{"position":[[100,4]]}}}],["gl.css",{"_index":1058,"t":{"172":{"position":[[338,7],[538,7],[788,8],[839,8]]}}}],["gl.j",{"_index":638,"t":{"63":{"position":[[1016,6]]}}}],["gl/dist/mapbox",{"_index":1067,"t":{"172":{"position":[[773,14]]}}}],["gl/dist/maplibr",{"_index":1068,"t":{"172":{"position":[[822,16]]}}}],["gl/maplibr",{"_index":214,"t":{"8":{"position":[[589,13]]},"17":{"position":[[486,13]]},"26":{"position":[[482,13]]},"35":{"position":[[697,13]]},"39":{"position":[[665,13],[719,13]]},"49":{"position":[[510,13]]},"63":{"position":[[387,11]]},"65":{"position":[[541,13],[592,13]]},"73":{"position":[[522,13]]},"82":{"position":[[818,13]]},"86":{"position":[[486,13]]},"95":{"position":[[682,13]]},"104":{"position":[[627,13]]},"108":{"position":[[466,13]]},"117":{"position":[[925,13],[981,13]]},"142":{"position":[[420,13],[1281,13]]},"170":{"position":[[452,13]]},"205":{"position":[[144,12],[562,13]]},"242":{"position":[[140,12]]}}}],["gl/src/api",{"_index":1449,"t":{"239":{"position":[[339,10]]}}}],["gl@1.x",{"_index":1103,"t":{"183":{"position":[[429,6]]},"185":{"position":[[246,7]]}}}],["gl@/dist/maplibr",{"_index":1063,"t":{"172":{"position":[[497,40]]}}}],["gl@>=2.0.0",{"_index":1099,"t":{"183":{"position":[[244,10]]}}}],["glyph",{"_index":643,"t":{"63":{"position":[[1350,7]]}}}],["go",{"_index":132,"t":{"4":{"position":[[1264,5]]}}}],["good",{"_index":1409,"t":{"229":{"position":[[681,5]]}}}],["govern",{"_index":1020,"t":{"160":{"position":[[28,8]]},"162":{"position":[[201,10]]}}}],["granular",{"_index":1573,"t":{"288":{"position":[[715,8]]}}}],["graphic",{"_index":106,"t":{"4":{"position":[[740,7]]}}}],["guid",{"_index":57,"t":{"2":{"position":[[991,5]]},"242":{"position":[[395,5]]},"244":{"position":[[866,5]]},"252":{"position":[[317,5]]},"272":{"position":[[1168,5]]},"294":{"position":[[156,6]]}}}],["guide.md",{"_index":994,"t":{"154":{"position":[[263,9]]}}}],["guidelin",{"_index":1009,"t":{"156":{"position":[[45,11]]},"162":{"position":[[212,11]]}}}],["handl",{"_index":1144,"t":{"187":{"position":[[641,8]]},"211":{"position":[[234,8]]},"284":{"position":[[6,8]]},"288":{"position":[[934,9],[954,8],[1017,8]]}}}],["handler",{"_index":1323,"t":{"211":{"position":[[266,9],[355,8]]},"298":{"position":[[134,7],[178,7]]}}}],["happen",{"_index":498,"t":{"59":{"position":[[1717,9]]}}}],["hard",{"_index":1393,"t":{"223":{"position":[[153,4]]},"237":{"position":[[229,4]]}}}],["head",{"_index":1055,"t":{"172":{"position":[[208,4]]},"215":{"position":[[164,7]]}}}],["header",{"_index":1130,"t":{"185":{"position":[[1012,6],[1284,8]]}}}],["heatmap",{"_index":852,"t":{"126":{"position":[[786,7]]}}}],["heatmaplay",{"_index":851,"t":{"126":{"position":[[743,13]]}}}],["hebrew",{"_index":675,"t":{"63":{"position":[[2481,6]]}}}],["height",{"_index":349,"t":{"49":{"position":[[376,7],[642,7]]},"53":{"position":[[99,7]]},"170":{"position":[[248,7],[584,7]]},"213":{"position":[[437,6]]},"229":{"position":[[273,8],[368,7],[435,6],[555,8],[699,8]]},"233":{"position":[[219,7]]},"272":{"position":[[104,6]]},"288":{"position":[[416,6]]},"290":{"position":[[377,7]]}}}],["height={400",{"_index":1408,"t":{"229":{"position":[[648,12],[791,12]]}}}],["help",{"_index":311,"t":{"41":{"position":[[234,4]]},"196":{"position":[[246,4]]},"280":{"position":[[439,4]]}}}],["here",{"_index":786,"t":{"95":{"position":[[556,4],[1046,4]]},"136":{"position":[[623,5]]},"142":{"position":[[1657,5]]},"156":{"position":[[100,5]]},"179":{"position":[[261,5]]},"189":{"position":[[56,5]]},"191":{"position":[[56,5]]},"205":{"position":[[182,4]]},"290":{"position":[[449,5]]}}}],["hidden",{"_index":722,"t":{"65":{"position":[[954,6],[1212,6]]}}}],["high",{"_index":1084,"t":{"181":{"position":[[186,4]]},"200":{"position":[[117,4]]}}}],["higher",{"_index":1443,"t":{"237":{"position":[[142,6],[179,7]]}}}],["hillshad",{"_index":854,"t":{"126":{"position":[[890,9]]}}}],["hillshadelay",{"_index":853,"t":{"126":{"position":[[845,15]]}}}],["hit",{"_index":839,"t":{"119":{"position":[[245,4]]}}}],["hook",{"_index":119,"t":{"4":{"position":[[1013,6]]},"35":{"position":[[78,5]]},"65":{"position":[[64,5]]},"82":{"position":[[68,5]]},"104":{"position":[[67,5]]},"136":{"position":[[15,4]]},"138":{"position":[[568,4]]},"142":{"position":[[11,4],[715,4]]},"144":{"position":[[55,4],[205,4]]}}}],["host",{"_index":35,"t":{"2":{"position":[[573,6],[856,4]]},"63":{"position":[[3053,6]]},"185":{"position":[[120,4]]},"252":{"position":[[199,7]]}}}],["hover",{"_index":1349,"t":{"213":{"position":[[1262,6]]}}}],["href='https://api.tiles.mapbox.com/mapbox",{"_index":1056,"t":{"172":{"position":[[260,41]]}}}],["href='https://unpkg.com/maplibr",{"_index":1062,"t":{"172":{"position":[[464,32]]}}}],["html",{"_index":899,"t":{"132":{"position":[[404,4]]},"179":{"position":[[27,4]]},"284":{"position":[[323,4]]}}}],["htmloverlay",{"_index":1328,"t":{"211":{"position":[[525,13]]},"239":{"position":[[71,13]]},"288":{"position":[[518,11]]},"300":{"position":[[270,13]]}}}],["http://localhost",{"_index":1193,"t":{"196":{"position":[[799,18]]}}}],["https://api.mapbox.com/mapbox",{"_index":668,"t":{"63":{"position":[[2315,30]]}}}],["https://mycompany.com",{"_index":1198,"t":{"196":{"position":[[887,23]]}}}],["hundr",{"_index":1261,"t":{"200":{"position":[[953,8]]}}}],["icon",{"_index":648,"t":{"63":{"position":[[1457,6]]},"200":{"position":[[801,4],[1236,4],[2009,5],[2032,6],[2039,5]]}}}],["icontrol",{"_index":842,"t":{"124":{"position":[[0,9]]},"138":{"position":[[21,10],[79,9],[157,10],[215,9],[346,10],[404,9],[584,8],[731,8],[1136,8]]}}}],["id",{"_index":240,"t":{"22":{"position":[[122,2]]},"39":{"position":[[227,3],[764,3]]},"43":{"position":[[192,3],[263,2]]},"45":{"position":[[22,2],[639,2]]},"53":{"position":[[0,3],[26,3]]},"117":{"position":[[489,3],[1232,3]]},"119":{"position":[[440,3],[512,2]]},"144":{"position":[[29,4],[164,2]]},"177":{"position":[[449,3]]},"200":{"position":[[2077,5]]}}}],["id(",{"_index":486,"t":{"59":{"position":[[1371,5]]}}}],["id=\"mi",{"_index":834,"t":{"117":{"position":[[759,6],[1509,6]]},"177":{"position":[[648,6]]}}}],["id=\"mymapa",{"_index":955,"t":{"142":{"position":[[934,11],[1341,11]]}}}],["id=\"mymapb",{"_index":956,"t":{"142":{"position":[[958,11],[1365,11]]}}}],["id=\"vehicl",{"_index":1270,"t":{"200":{"position":[[1925,13]]}}}],["ideal",{"_index":1237,"t":{"198":{"position":[[814,5]]}}}],["ident",{"_index":323,"t":{"43":{"position":[[182,9]]},"119":{"position":[[430,9]]},"242":{"position":[[178,9]]},"264":{"position":[[267,9]]}}}],["identifi",{"_index":325,"t":{"43":{"position":[[211,10]]},"119":{"position":[[459,10]]},"183":{"position":[[725,8]]}}}],["idl",{"_index":518,"t":{"61":{"position":[[419,6]]}}}],["ignor",{"_index":419,"t":{"57":{"position":[[119,7]]}}}],["imag",{"_index":646,"t":{"63":{"position":[[1426,6]]},"126":{"position":[[1596,5]]},"132":{"position":[[307,6]]},"181":{"position":[[431,7]]},"200":{"position":[[2015,7]]}}}],["imagesourc",{"_index":897,"t":{"132":{"position":[[274,12],[318,11]]}}}],["imagesourceraw",{"_index":865,"t":{"126":{"position":[[1551,15]]}}}],["img",{"_index":738,"t":{"73":{"position":[[409,4],[769,4]]}}}],["immut",{"_index":372,"t":{"55":{"position":[[267,10]]},"223":{"position":[[237,9]]},"272":{"position":[[353,9]]}}}],["immutable.j",{"_index":1390,"t":{"221":{"position":[[58,12]]},"223":{"position":[[125,12]]}}}],["imper",{"_index":79,"t":{"4":{"position":[[318,11]]},"35":{"position":[[111,10]]},"65":{"position":[[0,10]]},"82":{"position":[[101,10]]},"104":{"position":[[100,10]]},"217":{"position":[[482,10]]},"244":{"position":[[529,10]]}}}],["imperi",{"_index":821,"t":{"111":{"position":[[170,10]]}}}],["implement",{"_index":844,"t":{"124":{"position":[[27,15],[80,15]]},"132":{"position":[[18,15]]},"179":{"position":[[8,9]]},"187":{"position":[[602,10]]},"211":{"position":[[205,14],[302,14],[609,12]]}}}],["import",{"_index":194,"t":{"8":{"position":[[108,6],[140,6],[508,6],[540,6]]},"17":{"position":[[107,6],[139,6],[406,6],[438,6]]},"26":{"position":[[106,6],[138,6],[403,6],[435,6]]},"35":{"position":[[147,6],[179,6],[220,6],[272,6],[577,6],[609,6],[650,6],[711,6]]},"39":{"position":[[78,6],[110,6],[151,6],[597,6],[629,6],[679,6]]},"49":{"position":[[152,6],[184,6],[451,6],[483,6]]},"63":{"position":[[311,8],[363,8],[520,6],[564,6],[596,6],[628,6],[726,6],[765,6],[797,6],[1042,6],[1074,6]]},"65":{"position":[[86,6],[118,6],[161,6],[193,6],[439,6],[471,6],[514,6],[555,6]]},"69":{"position":[[183,6]]},"73":{"position":[[96,6],[128,6],[453,6],[485,6]]},"82":{"position":[[137,6],[169,6],[221,6],[263,6],[697,6],[729,6],[781,6],[832,6]]},"86":{"position":[[107,6],[139,6],[406,6],[438,6]]},"95":{"position":[[95,6],[127,6],[159,6],[582,6],[614,6],[646,6]]},"104":{"position":[[136,6],[168,6],[209,6],[250,6],[518,6],[550,6],[591,6],[641,6]]},"108":{"position":[[102,6],[134,6],[391,6],[423,6]]},"117":{"position":[[124,6],[156,6],[205,6],[252,6],[849,6],[881,6],[939,6],[995,6]]},"122":{"position":[[27,8]]},"136":{"position":[[78,6],[127,6]]},"142":{"position":[[97,6],[383,6],[833,6],[1231,6]]},"170":{"position":[[24,6],[56,6],[393,6],[425,6]]},"172":{"position":[[758,6],[805,6]]},"174":{"position":[[93,6],[125,6],[180,6]]},"177":{"position":[[84,6],[116,6],[165,6],[212,6]]},"189":{"position":[[62,6],[94,6]]},"191":{"position":[[62,6],[94,6]]},"193":{"position":[[271,6],[303,6],[361,6]]},"200":{"position":[[195,6],[249,6]]},"205":{"position":[[106,7],[168,8],[282,6],[314,6],[535,6],[599,6]]},"211":{"position":[[51,6]]},"223":{"position":[[227,9]]},"233":{"position":[[104,6]]},"239":{"position":[[23,9],[165,8],[215,6],[271,6],[305,6]]},"244":{"position":[[838,9]]},"252":{"position":[[72,9]]},"256":{"position":[[243,6]]},"300":{"position":[[233,7],[336,8],[388,8],[412,7]]}}}],["import('mapbox",{"_index":622,"t":{"63":{"position":[[288,14]]}}}],["import('maplibr",{"_index":623,"t":{"63":{"position":[[338,16]]},"205":{"position":[[659,17]]}}}],["improv",{"_index":1264,"t":{"200":{"position":[[1032,7]]},"288":{"position":[[355,8]]}}}],["includ",{"_index":617,"t":{"61":{"position":[[8387,9]]},"172":{"position":[[48,8]]},"174":{"position":[[160,7]]},"181":{"position":[[392,9]]},"185":{"position":[[367,7],[816,8]]},"223":{"position":[[55,8]]},"229":{"position":[[254,8],[349,8]]},"272":{"position":[[748,9]]},"280":{"position":[[260,9]]}}}],["index.html",{"_index":634,"t":{"63":{"position":[[942,10]]},"172":{"position":[[243,10],[447,10]]}}}],["indic",{"_index":745,"t":{"76":{"position":[[368,8]]},"98":{"position":[[137,10],[781,8]]}}}],["individu",{"_index":1458,"t":{"239":{"position":[[921,10]]}}}],["inertia",{"_index":1369,"t":{"217":{"position":[[164,7],[335,9],[361,9],[386,9]]},"248":{"position":[[164,7]]}}}],["inform",{"_index":614,"t":{"61":{"position":[[8134,12],[8268,12],[8473,12]]},"69":{"position":[[387,12]]},"223":{"position":[[98,11]]},"239":{"position":[[557,11],[630,11]]},"290":{"position":[[253,12],[480,12]]},"294":{"position":[[127,12]]}}}],["initi",{"_index":415,"t":{"57":{"position":[[30,7],[301,7],[664,7],[735,7],[801,7],[852,7],[918,7],[1130,7],[1246,7]]},"63":{"position":[[2093,15],[2167,15]]},"187":{"position":[[72,7]]},"198":{"position":[[781,12],[1105,14]]},"302":{"position":[[0,7]]}}}],["initialviewst",{"_index":200,"t":{"8":{"position":[[265,19],[632,19]]},"17":{"position":[[263,19],[529,19]]},"26":{"position":[[261,19],[525,19]]},"39":{"position":[[448,19],[943,19]]},"49":{"position":[[289,19],[555,19]]},"57":{"position":[[0,17],[167,16]]},"63":{"position":[[2230,16]]},"73":{"position":[[241,19],[565,19]]},"86":{"position":[[263,19],[529,19]]},"95":{"position":[[330,19],[784,19]]},"108":{"position":[[253,19],[509,19]]},"117":{"position":[[637,19],[1351,19]]},"136":{"position":[[367,19]]},"170":{"position":[[161,19],[497,19]]},"177":{"position":[[570,19]]},"189":{"position":[[155,19]]},"213":{"position":[[595,16]]}}}],["inject",{"_index":1073,"t":{"177":{"position":[[8,6]]}}}],["inlin",{"_index":310,"t":{"41":{"position":[[223,6]]},"119":{"position":[[224,6]]},"248":{"position":[[583,6]]}}}],["input",{"_index":910,"t":{"134":{"position":[[1029,5]]},"187":{"position":[[626,5]]},"211":{"position":[[228,5]]}}}],["insert",{"_index":328,"t":{"45":{"position":[[49,6]]}}}],["insid",{"_index":548,"t":{"61":{"position":[[1906,6]]},"144":{"position":[[218,6]]},"193":{"position":[[244,6],[806,6]]}}}],["instal",{"_index":1049,"t":{"168":{"position":[[78,7],[137,7]]},"174":{"position":[[4,7]]},"193":{"position":[[342,7]]},"205":{"position":[[36,7],[726,9]]},"209":{"position":[[294,7]]},"242":{"position":[[325,7]]}}}],["instanc",{"_index":163,"t":{"6":{"position":[[300,8]]},"35":{"position":[[39,8]]},"63":{"position":[[148,9],[241,8],[1631,8],[1695,8],[1803,8],[1889,8]]},"65":{"position":[[1294,8]]},"76":{"position":[[638,8],[763,8]]},"82":{"position":[[29,8]]},"104":{"position":[[28,8]]},"124":{"position":[[104,8]]},"138":{"position":[[593,9],[762,8],[1159,8]]},"233":{"position":[[361,8]]},"242":{"position":[[485,8]]}}}],["instanti",{"_index":696,"t":{"63":{"position":[[2915,12]]}}}],["instantli",{"_index":1576,"t":{"288":{"position":[[895,9]]}}}],["instead",{"_index":411,"t":{"55":{"position":[[1278,7]]},"211":{"position":[[42,8],[751,8]]},"213":{"position":[[422,8],[712,8],[819,8]]},"221":{"position":[[50,7],[159,7]]},"242":{"position":[[242,8]]},"256":{"position":[[271,7]]},"264":{"position":[[178,7]]}}}],["instruct",{"_index":80,"t":{"4":{"position":[[343,8]]}}}],["integr",{"_index":689,"t":{"63":{"position":[[2793,9]]},"196":{"position":[[658,11]]}}}],["intend",{"_index":926,"t":{"134":{"position":[[2365,8]]},"152":{"position":[[4,8]]},"154":{"position":[[479,8]]}}}],["interact",{"_index":96,"t":{"4":{"position":[[603,9]]},"59":{"position":[[56,11],[195,11],[332,11],[467,11],[779,11],[977,11],[1191,11]]},"61":{"position":[[5002,11],[5401,11],[5509,12],[5600,11],[6027,11],[6709,11],[7388,11],[7717,11],[7810,11],[7920,12]]},"187":{"position":[[416,11],[576,8]]},"200":{"position":[[139,11]]},"213":{"position":[[1033,11]]},"217":{"position":[[279,11]]},"221":{"position":[[261,11]]},"244":{"position":[[284,11]]},"248":{"position":[[249,11],[345,11]]},"272":{"position":[[649,11],[735,12],[795,11],[857,11]]},"280":{"position":[[169,12],[646,12]]},"284":{"position":[[119,12]]},"288":{"position":[[739,14]]},"290":{"position":[[202,13]]}}}],["interactivelayerid",{"_index":485,"t":{"59":{"position":[[1322,20]]},"61":{"position":[[871,19],[1150,19],[1708,19],[2039,19],[2344,19],[2685,19],[3017,19],[3328,19],[3678,19],[3934,19],[4192,19],[4454,19]]},"221":{"position":[[311,19]]},"272":{"position":[[907,19]]}}}],["interactivemap",{"_index":1318,"t":{"211":{"position":[[0,14]]},"229":{"position":[[94,15],[110,14]]},"268":{"position":[[145,14]]},"272":{"position":[[25,14],[990,14]]},"280":{"position":[[578,14]]},"288":{"position":[[212,14]]},"290":{"position":[[0,14]]}}}],["interactivemap'",{"_index":1381,"t":{"219":{"position":[[69,16]]},"221":{"position":[[167,16]]}}}],["interest",{"_index":1032,"t":{"162":{"position":[[155,10]]}}}],["interfac",{"_index":182,"t":{"6":{"position":[[650,10]]},"63":{"position":[[2669,9],[2990,9]]},"134":{"position":[[2431,10]]},"294":{"position":[[107,10]]}}}],["intern",{"_index":651,"t":{"63":{"position":[[1577,8]]},"292":{"position":[[108,8]]}}}],["introduc",{"_index":1382,"t":{"219":{"position":[[139,10]]},"227":{"position":[[138,10]]},"237":{"position":[[216,10]]}}}],["invok",{"_index":1142,"t":{"187":{"position":[[363,7]]}}}],["isdrag",{"_index":1580,"t":{"292":{"position":[[148,11]]}}}],["ishov",{"_index":1579,"t":{"292":{"position":[[136,11]]}}}],["ispan",{"_index":1543,"t":{"272":{"position":[[758,10]]}}}],["isrot",{"_index":1545,"t":{"272":{"position":[[783,11]]}}}],["issourceload",{"_index":913,"t":{"134":{"position":[[1444,15]]}}}],["issu",{"_index":1001,"t":{"154":{"position":[[374,6]]},"244":{"position":[[99,6]]},"280":{"position":[[482,5]]}}}],["iszoom",{"_index":1544,"t":{"272":{"position":[[769,9]]}}}],["it'",{"_index":141,"t":{"4":{"position":[[1453,4]]},"138":{"position":[[627,4]]},"196":{"position":[[598,4]]},"200":{"position":[[931,4]]},"205":{"position":[[481,4],[1015,4]]},"209":{"position":[[370,4]]},"256":{"position":[[223,4]]}}}],["items.map(rendermark",{"_index":1233,"t":{"198":{"position":[[446,25],[1042,25]]}}}],["items.map(renderrow",{"_index":1235,"t":{"198":{"position":[[524,22]]}}}],["itself",{"_index":1097,"t":{"183":{"position":[[13,6]]}}}],["jan",{"_index":1481,"t":{"246":{"position":[[14,3]]},"254":{"position":[[14,3]]},"296":{"position":[[6,3]]}}}],["januari",{"_index":1549,"t":{"278":{"position":[[15,8]]}}}],["javascript",{"_index":706,"t":{"63":{"position":[[3200,10]]}}}],["js",{"_index":10,"t":{"2":{"position":[[104,2],[239,2],[279,3],[391,2],[429,3]]},"6":{"position":[[96,2]]},"183":{"position":[[137,2]]},"227":{"position":[[162,2]]},"252":{"position":[[39,2]]},"260":{"position":[[99,2]]},"264":{"position":[[80,2]]},"268":{"position":[[118,2]]},"288":{"position":[[17,3],[37,2],[347,2]]},"290":{"position":[[326,2]]}}}],["js'",{"_index":1524,"t":{"264":{"position":[[443,4]]}}}],["js/plugins/mapbox",{"_index":669,"t":{"63":{"position":[[2349,17]]}}}],["js/v2.4.0/mapbox",{"_index":637,"t":{"63":{"position":[[999,16]]}}}],["js/v/mapbox",{"_index":1057,"t":{"172":{"position":[[305,32]]}}}],["json",{"_index":374,"t":{"55":{"position":[[343,4],[442,5]]},"126":{"position":[[343,4],[447,4],[554,4],[660,4],[759,4],[863,4],[964,4],[1062,4],[1162,4],[1259,4],[1361,4],[1466,4],[1569,4],[1673,4],[1775,4],[1880,4],[1989,4]]}}}],["json.stringify(process.env.node_env",{"_index":1208,"t":{"196":{"position":[[1289,35],[1578,35]]}}}],["jsx",{"_index":315,"t":{"43":{"position":[[93,3]]},"45":{"position":[[350,3]]},"119":{"position":[[340,3]]}}}],["juli",{"_index":1547,"t":{"274":{"position":[[14,5]]},"286":{"position":[[14,4]]}}}],["june",{"_index":1460,"t":{"242":{"position":[[14,4]]}}}],["keep",{"_index":1457,"t":{"239":{"position":[[907,4]]}}}],["key",{"_index":320,"t":{"43":{"position":[[143,3]]},"61":{"position":[[3294,3]]},"119":{"position":[[391,3]]},"130":{"position":[[659,5]]},"144":{"position":[[144,4]]}}}],["key={vehicle.id",{"_index":1257,"t":{"200":{"position":[[697,16],[1132,16]]}}}],["keyboard",{"_index":474,"t":{"59":{"position":[[590,9],[632,8]]},"248":{"position":[[206,8]]},"280":{"position":[[99,8],[199,8]]},"284":{"position":[[58,8]]}}}],["keyboardhandl",{"_index":476,"t":{"59":{"position":[[668,15]]}}}],["know",{"_index":1275,"t":{"202":{"position":[[44,4]]}}}],["label",{"_index":1002,"t":{"154":{"position":[[381,5]]},"215":{"position":[[28,6]]},"256":{"position":[[52,5],[85,6]]}}}],["label=\"list",{"_index":1230,"t":{"198":{"position":[[330,12]]}}}],["label=\"map",{"_index":1228,"t":{"198":{"position":[[298,11]]}}}],["lag",{"_index":1262,"t":{"200":{"position":[[990,3]]}}}],["lambert",{"_index":388,"t":{"55":{"position":[[676,7],[839,7]]}}}],["lambertconformalcon",{"_index":389,"t":{"55":{"position":[[684,26]]}}}],["landus",{"_index":291,"t":{"39":{"position":[[295,10],[832,10]]}}}],["landuse_park",{"_index":289,"t":{"39":{"position":[[231,15],[768,15]]}}}],["languag",{"_index":676,"t":{"63":{"position":[[2488,10]]}}}],["larg",{"_index":1086,"t":{"181":{"position":[[300,5]]}}}],["last",{"_index":515,"t":{"61":{"position":[[374,4]]}}}],["lat",{"_index":878,"t":{"130":{"position":[[150,3],[165,3]]},"202":{"position":[[209,5],[297,6]]}}}],["later",{"_index":337,"t":{"45":{"position":[[309,5]]}}}],["latest",{"_index":27,"t":{"2":{"position":[[401,6]]},"154":{"position":[[404,7]]},"185":{"position":[[386,6]]},"217":{"position":[[614,6]]},"223":{"position":[[4,6]]},"264":{"position":[[48,6]]},"288":{"position":[[0,6]]},"298":{"position":[[0,6]]}}}],["latitud",{"_index":203,"t":{"8":{"position":[[302,9],[669,9]]},"17":{"position":[[300,9],[566,9]]},"26":{"position":[[298,9],[562,9]]},"39":{"position":[[487,9],[982,9]]},"49":{"position":[[328,9],[594,9]]},"57":{"position":[[86,9],[370,8],[712,9],[743,8],[1020,9],[1042,8]]},"61":{"position":[[5139,9]]},"73":{"position":[[278,9],[602,9]]},"76":{"position":[[107,9],[139,8]]},"86":{"position":[[300,9],[566,9]]},"95":{"position":[[367,9],[821,9]]},"98":{"position":[[245,9]]},"108":{"position":[[290,9],[546,9]]},"117":{"position":[[676,9],[1390,9]]},"130":{"position":[[114,9],[781,9],[804,8]]},"136":{"position":[[406,9]]},"170":{"position":[[200,9],[536,9]]},"177":{"position":[[610,9]]},"189":{"position":[[192,9]]},"191":{"position":[[211,9]]},"193":{"position":[[618,9]]},"233":{"position":[[428,9]]},"239":{"position":[[956,8]]},"276":{"position":[[90,9]]},"288":{"position":[[442,9]]},"290":{"position":[[385,9]]}}}],["latitude={37.8",{"_index":766,"t":{"82":{"position":[[570,15],[1147,15]]},"104":{"position":[[458,15],[855,15]]}}}],["latitude={40",{"_index":736,"t":{"73":{"position":[[377,13],[737,13]]},"95":{"position":[[481,13],[971,13]]}}}],["latitude={vehicle.coordinates[1",{"_index":1259,"t":{"200":{"position":[[749,34],[1184,34]]}}}],["layer",{"_index":286,"t":{"39":{"position":[[43,5],[122,7],[287,7],[562,6],[641,7],[824,7],[1093,6]]},"41":{"position":[[72,5],[177,6]]},"43":{"position":[[7,7],[97,6],[229,6],[320,6]]},"45":{"position":[[40,5],[61,5],[104,5],[145,6],[193,6],[239,6],[500,5],[550,7]]},"59":{"position":[[1534,7]]},"61":{"position":[[1016,6],[1295,6],[1746,5],[2184,6],[2382,5],[2830,6],[3162,6],[3473,6],[3823,6],[4079,6],[4337,6],[4599,6]]},"117":{"position":[[78,5],[177,6],[803,6],[902,6],[1553,6]]},"124":{"position":[[74,5]]},"126":{"position":[[381,5],[481,5],[596,5],[692,5],[794,5],[900,5],[996,5],[1096,5],[1196,5],[1290,5]]},"130":{"position":[[602,6],[609,5]]},"177":{"position":[[38,6],[66,5],[137,6],[692,6],[775,5],[880,7]]},"200":{"position":[[1573,6],[1580,6],[1978,6]]},"217":{"position":[[448,5]]},"221":{"position":[[289,5],[353,6]]},"231":{"position":[[213,6]]},"260":{"position":[[16,5]]},"272":{"position":[[807,6],[885,5],[949,6]]}}}],["layer(",{"_index":487,"t":{"59":{"position":[[1386,9]]},"61":{"position":[[1686,8],[2322,8]]}}}],["layer.t",{"_index":344,"t":{"47":{"position":[[0,8]]}}}],["layerref.getlay",{"_index":1378,"t":{"217":{"position":[[754,20]]}}}],["layerstyl",{"_index":829,"t":{"117":{"position":[[461,11],[810,15],[1204,11],[1560,15]]},"177":{"position":[[421,11],[699,15]]}}}],["layout",{"_index":1222,"t":{"198":{"position":[[175,7]]},"200":{"position":[[1999,9]]}}}],["lazi",{"_index":679,"t":{"63":{"position":[[2610,5]]}}}],["lead",{"_index":186,"t":{"6":{"position":[[706,4]]},"65":{"position":[[1157,4]]},"280":{"position":[[497,4]]}}}],["leak",{"_index":1118,"t":{"183":{"position":[[1212,7]]},"280":{"position":[[477,4]]}}}],["leav",{"_index":550,"t":{"61":{"position":[[2290,6],[2509,6]]}}}],["left",{"_index":232,"t":{"13":{"position":[[259,5],[292,6]]},"22":{"position":[[271,5],[304,6]]},"33":{"position":[[318,5],[351,6]]},"63":{"position":[[2526,5]]},"76":{"position":[[377,4]]},"91":{"position":[[268,5],[301,6]]},"98":{"position":[[19,6],[62,5],[92,5],[790,4]]},"113":{"position":[[130,5],[163,6]]},"128":{"position":[[42,6],[76,6],[136,5]]},"136":{"position":[[510,5]]},"138":{"position":[[1035,5],[1065,5]]}}}],["legaci",{"_index":1470,"t":{"244":{"position":[[130,6]]}}}],["length",{"_index":819,"t":{"111":{"position":[[43,6]]}}}],["less",{"_index":1410,"t":{"231":{"position":[[39,4]]}}}],["level",{"_index":434,"t":{"57":{"position":[[814,6],[1093,5],[1462,5],[1533,5]]},"61":{"position":[[5731,5],[5858,5],[6259,5]]},"130":{"position":[[856,6]]},"183":{"position":[[806,5]]}}}],["librari",{"_index":12,"t":{"2":{"position":[[118,10],[129,7]]},"6":{"position":[[99,8]]},"51":{"position":[[203,9]]},"63":{"position":[[431,7],[933,8],[2815,8]]},"130":{"position":[[577,7]]},"172":{"position":[[13,7]]},"181":{"position":[[118,10]]},"205":{"position":[[1006,8]]},"207":{"position":[[32,8],[159,8]]},"209":{"position":[[306,7]]},"213":{"position":[[68,8]]},"215":{"position":[[335,8]]},"231":{"position":[[285,7]]},"233":{"position":[[52,8]]},"244":{"position":[[58,8],[310,7]]},"248":{"position":[[55,7]]},"256":{"position":[[198,7]]},"260":{"position":[[239,7]]},"290":{"position":[[610,7]]}}}],["library'",{"_index":190,"t":{"8":{"position":[[36,9]]},"17":{"position":[[36,9]]},"26":{"position":[[36,9]]},"49":{"position":[[36,9]]},"51":{"position":[[299,9]]},"73":{"position":[[36,9]]},"86":{"position":[[36,9]]},"95":{"position":[[36,9]]},"108":{"position":[[36,9]]}}}],["licens",{"_index":1498,"t":{"252":{"position":[[105,7]]}}}],["light",{"_index":369,"t":{"55":{"position":[[142,6],[149,6],[156,5],[207,5]]},"126":{"position":[[124,6],[159,5]]}}}],["lightweight",{"_index":1305,"t":{"207":{"position":[[70,12]]},"244":{"position":[[318,12]]}}}],["limit",{"_index":1400,"t":{"227":{"position":[[118,11]]},"244":{"position":[[119,7]]}}}],["line",{"_index":856,"t":{"126":{"position":[[991,4]]},"196":{"position":[[488,5]]}}}],["linearinterpol",{"_index":1332,"t":{"211":{"position":[[664,18]]}}}],["linelay",{"_index":855,"t":{"126":{"position":[[951,10]]}}}],["link",{"_index":999,"t":{"154":{"position":[[357,4]]},"172":{"position":[[254,5],[458,5]]},"288":{"position":[[796,6]]}}}],["linux",{"_index":1041,"t":{"164":{"position":[[39,5]]}}}],["list",{"_index":352,"t":{"51":{"position":[[21,6],[165,4]]},"63":{"position":[[85,6]]},"162":{"position":[[295,5],[314,4]]},"172":{"position":[[411,4],[613,4]]},"205":{"position":[[1046,4]]},"209":{"position":[[82,5]]},"223":{"position":[[306,4]]},"252":{"position":[[338,4]]}}}],["listen",{"_index":490,"t":{"59":{"position":[[1448,9],[1664,9]]}}}],["live",{"_index":1577,"t":{"290":{"position":[[444,4]]}}}],["lng",{"_index":877,"t":{"130":{"position":[[142,3]]},"202":{"position":[[215,4]]}}}],["lnglat",{"_index":873,"t":{"130":{"position":[[0,7],[48,6]]},"134":{"position":[[269,7],[277,6],[687,7],[695,6],[718,8],[727,8],[2642,7],[2650,6]]}}}],["lnglatbound",{"_index":880,"t":{"130":{"position":[[181,13],[247,12]]},"134":{"position":[[1191,12]]}}}],["lnglatboundslik",{"_index":424,"t":{"57":{"position":[[278,16],[1702,17]]},"130":{"position":[[227,17]]}}}],["lnglatlik",{"_index":875,"t":{"130":{"position":[[34,11],[280,10]]}}}],["load",{"_index":43,"t":{"2":{"position":[[796,4]]},"35":{"position":[[443,6],[888,6]]},"61":{"position":[[506,6],[8090,5],[8224,5],[8369,5],[8429,5]]},"63":{"position":[[899,4],[1467,4],[3004,7],[3195,4]]},"183":{"position":[[490,4]]},"264":{"position":[[173,4]]}}}],["loader",{"_index":1065,"t":{"172":{"position":[[690,6]]},"181":{"position":[[329,7]]}}}],["loaders.gl",{"_index":1088,"t":{"181":{"position":[[316,10]]}}}],["local",{"_index":971,"t":{"150":{"position":[[74,7]]},"196":{"position":[[376,5]]},"215":{"position":[[64,6]]}}}],["locat",{"_index":492,"t":{"59":{"position":[[1488,8]]},"73":{"position":[[908,9]]},"76":{"position":[[162,9],[229,9]]},"98":{"position":[[570,8],[648,8]]},"134":{"position":[[1998,9],[2050,8],[2667,8]]}}}],["lock",{"_index":263,"t":{"31":{"position":[[524,4]]},"264":{"position":[[509,7]]}}}],["logic",{"_index":1145,"t":{"187":{"position":[[650,6]]},"193":{"position":[[124,5]]},"290":{"position":[[433,5]]},"294":{"position":[[99,7]]}}}],["lon",{"_index":879,"t":{"130":{"position":[[157,3]]}}}],["long",{"_index":129,"t":{"4":{"position":[[1170,4]]},"244":{"position":[[85,4]]}}}],["longer",{"_index":987,"t":{"152":{"position":[[180,6]]},"185":{"position":[[167,6]]},"205":{"position":[[21,6],[1162,6]]},"207":{"position":[[540,6]]},"209":{"position":[[75,6],[259,6],[378,6]]},"215":{"position":[[404,6]]},"217":{"position":[[143,6],[468,6]]},"221":{"position":[[77,6]]},"223":{"position":[[144,6]]},"242":{"position":[[310,6]]},"272":{"position":[[369,6]]},"288":{"position":[[459,6]]}}}],["longitud",{"_index":201,"t":{"8":{"position":[[285,10],[652,10]]},"17":{"position":[[283,10],[549,10]]},"26":{"position":[[281,10],[545,10]]},"39":{"position":[[468,10],[963,10]]},"49":{"position":[[309,10],[575,10]]},"57":{"position":[[75,10],[359,10],[640,10],[672,9],[968,10],[991,9]]},"61":{"position":[[5127,11]]},"73":{"position":[[261,10],[360,11],[585,10],[720,11]]},"76":{"position":[[172,10],[205,9]]},"82":{"position":[[551,11],[1128,11]]},"86":{"position":[[283,10],[549,10]]},"95":{"position":[[350,10],[464,11],[804,10],[954,11]]},"98":{"position":[[231,9]]},"104":{"position":[[439,11],[836,11]]},"108":{"position":[[273,10],[529,10]]},"117":{"position":[[657,10],[1371,10]]},"130":{"position":[[100,9],[728,10],[752,9]]},"136":{"position":[[387,10]]},"170":{"position":[[181,10],[517,10]]},"177":{"position":[[590,10]]},"189":{"position":[[175,10]]},"191":{"position":[[194,10]]},"193":{"position":[[601,10]]},"233":{"position":[[396,11]]},"239":{"position":[[945,10]]},"276":{"position":[[78,11]]},"288":{"position":[[428,9]]},"290":{"position":[[395,10]]}}}],["longitude={vehicle.coordinates[0",{"_index":1258,"t":{"200":{"position":[[714,34],[1149,34]]}}}],["look",{"_index":968,"t":{"148":{"position":[[95,7]]}}}],["ls",{"_index":1061,"t":{"172":{"position":[[433,2],[637,2]]}}}],["m",{"_index":1386,"t":{"219":{"position":[[267,1]]}}}],["made",{"_index":243,"t":{"22":{"position":[[160,4],[224,4]]}}}],["mail",{"_index":1035,"t":{"162":{"position":[[287,7],[306,7]]}}}],["main",{"_index":1418,"t":{"231":{"position":[[514,4]]}}}],["maintain",{"_index":755,"t":{"76":{"position":[[1068,11]]},"148":{"position":[[111,12]]},"162":{"position":[[24,11],[180,11]]}}}],["major",{"_index":1394,"t":{"223":{"position":[[201,5]]},"225":{"position":[[8,5]]},"231":{"position":[[301,8]]},"235":{"position":[[185,5]]},"264":{"position":[[544,5]]}}}],["make",{"_index":317,"t":{"43":{"position":[[117,4]]},"119":{"position":[[365,4]]},"162":{"position":[[128,6]]},"187":{"position":[[165,5]]},"196":{"position":[[65,4]]},"207":{"position":[[289,4]]},"237":{"position":[[81,4]]},"276":{"position":[[24,5]]}}}],["manag",{"_index":70,"t":{"4":{"position":[[195,6],[912,7],[1186,7],[1512,11]]},"57":{"position":[[245,10]]},"61":{"position":[[5171,10]]},"150":{"position":[[135,6]]},"187":{"position":[[297,7]]},"200":{"position":[[36,7]]},"213":{"position":[[636,6],[743,11]]}}}],["mani",{"_index":49,"t":{"2":{"position":[[896,4]]},"4":{"position":[[484,4]]},"198":{"position":[[123,4]]},"244":{"position":[[80,4]]}}}],["manipul",{"_index":340,"t":{"45":{"position":[[412,10]]}}}],["manual",{"_index":1218,"t":{"196":{"position":[[1937,8]]}}}],["map",{"_index":5,"t":{"2":{"position":[[52,3],[644,3],[801,3],[870,3],[933,3]]},"4":{"position":[[6,3],[356,3],[566,4],[676,3],[771,4],[1053,3],[1182,3],[1289,3],[1348,3]]},"6":{"position":[[15,3],[194,8],[296,3]]},"8":{"position":[[147,4],[185,3],[218,4],[498,7],[547,4],[585,3],[627,4],[901,7]]},"13":{"position":[[364,4]]},"17":{"position":[[146,4],[183,3],[216,4],[396,7],[445,4],[482,3],[524,4],[698,7]]},"22":{"position":[[194,3],[373,4]]},"26":{"position":[[145,4],[181,3],[214,4],[393,7],[442,4],[478,3],[520,4],[693,7]]},"31":{"position":[[397,3]]},"33":{"position":[[423,4]]},"35":{"position":[[227,4],[263,3],[520,5],[567,7],[657,4],[693,3],[965,5],[1012,7]]},"39":{"position":[[39,3],[117,4],[142,3],[187,3],[401,4],[587,7],[636,4],[661,3],[715,3],[938,4],[1118,7]]},"45":{"position":[[207,3]]},"49":{"position":[[46,3],[120,3],[191,3],[207,3],[242,4],[490,3],[506,3],[550,4]]},"51":{"position":[[39,3],[84,3],[199,3],[295,3]]},"53":{"position":[[12,3],[115,3]]},"55":{"position":[[137,4],[520,3],[1470,4]]},"57":{"position":[[56,4],[149,4],[187,3],[323,4],[689,3],[759,3],[880,4],[952,4],[1008,3],[1058,3],[1106,4],[1158,4],[1280,4],[1475,3],[1546,3],[1612,3],[1679,3],[1746,3]]},"59":{"position":[[1743,4]]},"61":{"position":[[53,3],[217,3],[293,3],[405,3],[613,3],[863,4],[1142,4],[1420,4],[1479,4],[1528,3],[1767,3],[1917,4],[1956,4],[2031,4],[2403,3],[2677,4],[2989,3],[3320,4],[3565,4],[3670,4],[3926,4],[4184,4],[4446,4],[4681,3],[4857,3],[5268,3],[5693,3],[5881,3],[6218,3],[6354,3],[6560,3],[6905,3],[7048,3],[7241,3],[7581,3],[8081,3]]},"63":{"position":[[51,3],[144,3],[237,3],[331,3],[383,3],[427,3],[447,3],[603,3],[619,3],[686,4],[804,3],[820,3],[853,4],[1081,3],[1097,3],[1130,4],[1249,3],[1545,3],[1627,3],[1661,3],[1691,3],[1756,3],[1799,3],[1851,3],[2130,3],[2196,5],[2953,5]]},"65":{"position":[[168,3],[184,3],[226,3],[392,4],[521,3],[537,3],[588,3],[763,4],[836,3],[1270,3]]},"69":{"position":[[36,3],[100,4],[177,5],[216,3],[311,4]]},"73":{"position":[[135,4],[161,3],[194,4],[443,7],[492,4],[518,3],[560,4],[803,7]]},"76":{"position":[[102,4],[406,5],[451,3],[493,4],[969,5],[1014,3],[1063,4],[1097,3],[1186,3]]},"82":{"position":[[228,4],[254,3],[537,5],[631,6],[788,4],[814,3],[1114,5],[1208,6]]},"86":{"position":[[146,4],[183,3],[216,4],[396,7],[445,4],[482,3],[524,4],[698,7]]},"91":{"position":[[370,4]]},"95":{"position":[[166,4],[191,3],[283,4],[572,7],[653,4],[678,3],[779,4],[1062,7]]},"98":{"position":[[337,3]]},"104":{"position":[[216,4],[241,3],[426,5],[508,7],[598,4],[623,3],[823,5],[905,7]]},"108":{"position":[[141,4],[173,3],[206,4],[381,7],[430,4],[462,3],[504,4],[673,7]]},"113":{"position":[[232,4]]},"117":{"position":[[39,3],[163,4],[196,3],[243,3],[603,4],[839,7],[888,4],[921,3],[977,3],[1346,4],[1589,7]]},"122":{"position":[[47,3]]},"124":{"position":[[122,3],[141,3]]},"130":{"position":[[769,3],[820,3],[903,4],[968,4]]},"134":{"position":[[81,3],[205,3],[441,3],[623,3],[913,3],[1125,3],[1281,3],[1401,3],[1656,3],[1767,3]]},"136":{"position":[[64,3],[134,4],[164,3],[333,4],[592,6]]},"138":{"position":[[42,6],[178,6],[235,6],[367,6],[421,6],[474,6],[618,3],[694,6],[794,6],[884,4],[899,6],[999,4],[1123,3]]},"142":{"position":[[59,3],[104,5],[130,3],[166,4],[198,6],[254,4],[390,5],[416,3],[461,4],[493,6],[549,4],[739,4],[854,4],[879,3],[929,4],[953,4],[1252,4],[1277,3],[1336,4],[1360,4]]},"144":{"position":[[104,4],[242,3],[338,4]]},"150":{"position":[[67,3]]},"156":{"position":[[6,3]]},"160":{"position":[[6,3]]},"162":{"position":[[45,3]]},"164":{"position":[[101,3]]},"168":{"position":[[12,3],[99,3],[158,3]]},"170":{"position":[[63,3],[79,3],[114,4],[432,3],[448,3],[492,4]]},"172":{"position":[[9,3],[124,3]]},"174":{"position":[[25,3],[80,4],[132,3],[148,3],[253,4]]},"177":{"position":[[123,4],[156,3],[203,3],[565,4],[728,6]]},"179":{"position":[[61,3],[237,4]]},"181":{"position":[[135,3]]},"183":{"position":[[6,3],[321,3],[416,5],[499,3],[561,4],[759,3],[976,3]]},"185":{"position":[[26,3],[134,3],[260,3],[409,3],[590,3],[701,3],[904,3],[1091,3]]},"187":{"position":[[28,4],[117,3],[258,3],[340,3],[359,3],[594,4]]},"189":{"position":[[101,3],[117,3],[150,4]]},"191":{"position":[[101,3],[117,3],[246,4],[434,3],[479,3]]},"193":{"position":[[0,3],[233,3],[310,3],[326,3],[922,4]]},"196":{"position":[[1716,3]]},"198":{"position":[[81,3],[394,4],[472,6],[630,3],[668,5],[683,3],[767,3],[980,4],[1068,6],[1127,3]]},"200":{"position":[[160,4],[256,4],[282,3],[577,4],[827,6],[923,4],[1284,4],[1379,6],[1832,4],[2099,6]]},"202":{"position":[[88,4],[313,4]]},"205":{"position":[[140,3],[269,3],[289,3],[305,3],[376,4],[522,3],[542,3],[558,3],[630,4],[1002,3],[1301,3]]},"207":{"position":[[155,3],[359,3],[400,3]]},"209":{"position":[[65,3],[99,3]]},"211":{"position":[[58,4],[100,3]]},"213":{"position":[[549,3],[910,3],[1137,3]]},"215":{"position":[[81,3]]},"217":{"position":[[207,3]]},"225":{"position":[[31,3]]},"227":{"position":[[48,3],[93,3]]},"229":{"position":[[4,3],[39,3]]},"231":{"position":[[278,3],[459,3],[525,3],[573,3]]},"235":{"position":[[208,3]]},"237":{"position":[[73,3]]},"239":{"position":[[48,3],[254,3],[296,3],[335,3],[375,3],[391,3],[675,3]]},"242":{"position":[[136,3],[208,3]]},"244":{"position":[[461,6]]},"252":{"position":[[207,3]]},"256":{"position":[[264,3]]},"260":{"position":[[253,3]]},"264":{"position":[[169,3],[189,3],[658,3]]},"272":{"position":[[90,3],[158,3],[644,4]]},"276":{"position":[[57,3]]},"280":{"position":[[326,3],[430,5],[604,3]]},"284":{"position":[[115,3],[149,3],[301,3]]},"288":{"position":[[548,4],[735,3]]},"290":{"position":[[223,4]]},"300":{"position":[[137,4],[247,3],[445,3]]}}}],["map'",{"_index":137,"t":{"4":{"position":[[1400,5]]},"6":{"position":[[366,5],[465,5]]},"55":{"position":[[305,5]]},"61":{"position":[[2520,5],[8212,5],[8355,5]]},"63":{"position":[[1285,5],[2418,5]]},"144":{"position":[[158,5]]},"215":{"position":[[58,5]]}}}],["map(",{"_index":662,"t":{"63":{"position":[[1985,7]]}}}],["map.easeto",{"_index":1334,"t":{"211":{"position":[[722,12]]},"213":{"position":[[790,12]]}}}],["map.flyto",{"_index":83,"t":{"4":{"position":[[390,11]]},"211":{"position":[[739,11]]},"213":{"position":[[807,11]]}}}],["map.flyto({cent",{"_index":951,"t":{"142":{"position":[[295,18],[590,18]]}}}],["map.getsourc",{"_index":894,"t":{"132":{"position":[[79,13]]}}}],["map.project",{"_index":1079,"t":{"179":{"position":[[118,13]]}}}],["map.setmaxzoom",{"_index":169,"t":{"6":{"position":[[426,14]]}}}],["map.tsx",{"_index":727,"t":{"67":{"position":[[0,7]]},"71":{"position":[[4,7]]},"146":{"position":[[4,7]]}}}],["mapbox",{"_index":9,"t":{"2":{"position":[[94,6],[174,6],[215,6],[229,6],[269,6],[341,6],[367,6],[381,6],[419,6],[484,6],[566,6],[596,6],[662,6]]},"4":{"position":[[67,6],[299,6],[1212,6],[1333,6]]},"6":{"position":[[86,6]]},"8":{"position":[[71,7],[92,6]]},"13":{"position":[[155,7]]},"17":{"position":[[70,7],[91,6]]},"26":{"position":[[69,7],[90,6]]},"33":{"position":[[153,7]]},"35":{"position":[[131,6],[298,7]]},"39":{"position":[[62,6],[269,9],[806,9]]},"41":{"position":[[65,6]]},"45":{"position":[[519,6]]},"49":{"position":[[56,7],[128,6]]},"51":{"position":[[106,7]]},"55":{"position":[[311,6],[397,6]]},"59":{"position":[[99,7],[246,7],[378,7],[569,7],[684,7],[884,7],[1301,7]]},"63":{"position":[[61,7],[649,7],[1218,6],[2745,6],[2943,6],[3012,6]]},"65":{"position":[[70,6],[848,7],[1274,7]]},"73":{"position":[[59,7],[80,6]]},"76":{"position":[[666,7]]},"80":{"position":[[143,7]]},"82":{"position":[[121,6],[284,7]]},"86":{"position":[[70,7],[91,6]]},"91":{"position":[[154,7]]},"95":{"position":[[58,7],[79,6]]},"102":{"position":[[142,7]]},"104":{"position":[[120,6],[271,7]]},"108":{"position":[[65,7],[86,6]]},"117":{"position":[[108,6]]},"119":{"position":[[65,6]]},"126":{"position":[[38,6],[404,6],[504,6],[619,6],[715,6],[817,6],[923,6],[1019,6],[1119,6],[1219,6],[1313,6],[1420,6],[1523,6],[1626,6],[1731,6],[1833,6],[1942,6]]},"132":{"position":[[93,7],[176,7],[253,7],[330,7],[508,6],[556,7]]},"134":{"position":[[85,7],[209,7],[445,7],[627,7],[917,7],[1129,7],[1285,7],[1405,7],[1660,7],[1771,7],[1816,7],[1933,7],[2170,7],[2520,7],[2622,7],[2766,7]]},"142":{"position":[[81,6],[817,6]]},"168":{"position":[[58,6],[106,6]]},"170":{"position":[[0,6],[325,6],[371,6]]},"172":{"position":[[227,6],[380,6],[416,6],[436,6],[734,6],[765,7]]},"174":{"position":[[35,6],[191,6],[277,6]]},"177":{"position":[[24,6],[810,6]]},"183":{"position":[[77,6],[127,6],[182,6],[212,6],[237,6],[278,6],[422,6],[576,6],[618,6],[641,6],[1240,6]]},"185":{"position":[[52,6],[188,6],[239,6],[455,7],[487,6],[626,6],[917,6]]},"187":{"position":[[248,6]]},"196":{"position":[[8,6],[82,6]]},"198":{"position":[[717,6]]},"205":{"position":[[44,6],[501,6],[736,6],[980,6],[1121,6],[1189,6]]},"207":{"position":[[647,7]]},"209":{"position":[[4,6],[164,6]]},"215":{"position":[[137,6]]},"219":{"position":[[8,6],[126,6]]},"223":{"position":[[11,6]]},"227":{"position":[[152,6]]},"231":{"position":[[188,6]]},"237":{"position":[[199,6]]},"242":{"position":[[76,6],[333,6]]},"244":{"position":[[430,6],[691,6],[707,6]]},"252":{"position":[[29,6],[93,6],[173,6]]},"260":{"position":[[89,6]]},"264":{"position":[[70,6],[311,6],[433,6],[483,6]]},"268":{"position":[[108,6]]},"280":{"position":[[162,6],[243,6],[458,6],[544,6]]},"284":{"position":[[259,6],[342,6]]},"288":{"position":[[7,6],[27,6],[337,6]]},"290":{"position":[[316,6]]},"298":{"position":[[7,6],[23,6]]},"300":{"position":[[66,6]]}}}],["mapbox'",{"_index":45,"t":{"2":{"position":[[815,8]]},"63":{"position":[[2055,8]]},"183":{"position":[[525,8]]},"264":{"position":[[125,8],[389,8]]},"272":{"position":[[322,8]]},"280":{"position":[[43,8]]}}}],["mapbox/mapbox",{"_index":932,"t":{"136":{"position":[[101,15]]}}}],["mapbox://styles/mapbox/light",{"_index":1340,"t":{"213":{"position":[[311,29]]}}}],["mapboxaccesstoken",{"_index":640,"t":{"63":{"position":[[1166,18]]},"183":{"position":[[946,17],[998,17]]},"213":{"position":[[105,17]]}}}],["mapboxaccesstoken=\"gotoggl",{"_index":770,"t":{"82":{"position":[[646,28],[1223,28]]}}}],["onclickfeatures((tru",{"_index":783,"t":{"95":{"position":[[251,24],[747,24]]}}}],["usual",{"_index":532,"t":{"61":{"position":[[823,8],[1101,8],[1382,8],[1636,8],[1859,8],[2272,8],[2491,8],[2610,8],[2916,8]]}}}],["util",{"_index":1036,"t":{"162":{"position":[[331,8]]},"209":{"position":[[331,7]]},"233":{"position":[[14,7]]}}}],["v0.31.0",{"_index":1587,"t":{"298":{"position":[[36,7]]}}}],["v0.38.0",{"_index":1401,"t":{"227":{"position":[[165,7]]}}}],["v0.40.1",{"_index":1567,"t":{"284":{"position":[[269,7]]}}}],["v0.6",{"_index":1448,"t":{"239":{"position":[[266,4]]}}}],["v1",{"_index":17,"t":{"2":{"position":[[184,3],[242,2]]},"205":{"position":[[1131,3]]},"209":{"position":[[171,3]]},"237":{"position":[[26,3],[61,2]]}}}],["v1.0",{"_index":1447,"t":{"239":{"position":[[210,4]]},"264":{"position":[[83,5]]}}}],["v2",{"_index":26,"t":{"2":{"position":[[394,2]]},"205":{"position":[[1138,4]]},"209":{"position":[[175,2]]},"219":{"position":[[136,2]]},"229":{"position":[[202,2]]},"237":{"position":[[0,2]]}}}],["v2.0",{"_index":1119,"t":{"185":{"position":[[198,4]]},"198":{"position":[[711,5]]},"252":{"position":[[56,5]]}}}],["v3",{"_index":1395,"t":{"225":{"position":[[0,2]]},"229":{"position":[[21,2]]}}}],["v4",{"_index":1442,"t":{"237":{"position":[[136,2],[256,3]]}}}],["v5",{"_index":1309,"t":{"207":{"position":[[366,2]]},"244":{"position":[[109,2],[906,2]]}}}],["v6",{"_index":1310,"t":{"207":{"position":[[373,3]]},"244":{"position":[[116,2],[913,3]]}}}],["v6.4.0",{"_index":1398,"t":{"227":{"position":[[62,9]]}}}],["v7",{"_index":1301,"t":{"207":{"position":[[0,2],[558,3]]},"244":{"position":[[26,2]]}}}],["v7.0",{"_index":147,"t":{"6":{"position":[[3,5]]},"211":{"position":[[180,4]]}}}],["v7.0.tsx",{"_index":1283,"t":{"205":{"position":[[273,8]]}}}],["v7.1.tsx",{"_index":1287,"t":{"205":{"position":[[526,8]]}}}],["v9",{"_index":208,"t":{"8":{"position":[[370,3]]},"17":{"position":[[368,3]]},"26":{"position":[[366,3]]},"39":{"position":[[556,3]]},"49":{"position":[[431,3]]},"73":{"position":[[346,3]]},"86":{"position":[[368,3]]},"95":{"position":[[435,3]]},"108":{"position":[[358,3]]},"117":{"position":[[745,3]]},"136":{"position":[[477,3]]},"170":{"position":[[303,3]]},"189":{"position":[[260,3]]},"191":{"position":[[351,3]]},"193":{"position":[[999,3]]},"198":{"position":[[440,3],[1036,3]]},"200":{"position":[[654,3],[1361,3],[1909,3]]},"213":{"position":[[341,3]]}}}],["valid",{"_index":1380,"t":{"219":{"position":[[2,5]]}}}],["valu",{"_index":174,"t":{"6":{"position":[[510,5]]},"51":{"position":[[253,7]]},"59":{"position":[[518,5],[830,5],[1028,5],[1242,5]]},"63":{"position":[[466,5]]},"76":{"position":[[586,5],[910,5]]},"144":{"position":[[175,6]]},"213":{"position":[[288,5]]},"219":{"position":[[60,5]]},"229":{"position":[[732,6]]}}}],["value=\"map",{"_index":1229,"t":{"198":{"position":[[310,11],[381,12],[967,12]]}}}],["value=\"t",{"_index":1231,"t":{"198":{"position":[[343,13],[501,14]]}}}],["value={selectedtab",{"_index":1225,"t":{"198":{"position":[[235,20]]}}}],["variabl",{"_index":1113,"t":{"183":{"position":[[1028,8],[1191,8]]},"196":{"position":[[434,8],[734,9],[1878,8]]}}}],["vector",{"_index":867,"t":{"126":{"position":[[1700,6]]},"132":{"position":[[492,6],[515,6]]},"185":{"position":[[666,6],[924,6]]}}}],["vectorsourceraw",{"_index":866,"t":{"126":{"position":[[1654,16]]}}}],["vectortilesourc",{"_index":901,"t":{"132":{"position":[[454,17],[539,16]]}}}],["vehicl",{"_index":1249,"t":{"200":{"position":[[380,8],[793,7],[1228,7],[1262,12],[1794,9],[1810,12],[2023,8]]}}}],["vehicles.map(vehicl",{"_index":1256,"t":{"200":{"position":[[662,21],[1098,20],[1738,20]]}}}],["vehiclesgeojson",{"_index":1268,"t":{"200":{"position":[[1658,15]]}}}],["veri",{"_index":1140,"t":{"187":{"position":[[226,4]]},"200":{"position":[[112,4]]}}}],["version",{"_index":3,"t":{"2":{"position":[[37,8],[258,7],[288,7],[408,7],[443,7]]},"63":{"position":[[918,7]]},"156":{"position":[[34,10]]},"172":{"position":[[387,7],[589,7]]},"183":{"position":[[140,7]]},"185":{"position":[[350,7]]},"205":{"position":[[949,7],[1096,7]]},"207":{"position":[[511,8]]},"217":{"position":[[261,9]]},"227":{"position":[[9,7]]},"235":{"position":[[191,7]]},"237":{"position":[[125,7],[160,7]]},"242":{"position":[[102,7]]},"252":{"position":[[242,8]]},"264":{"position":[[103,8]]},"302":{"position":[[15,7]]}}}],["version'",{"_index":1291,"t":{"205":{"position":[[831,9]]}}}],["via",{"_index":165,"t":{"6":{"position":[[318,3]]},"35":{"position":[[62,3]]},"65":{"position":[[34,3],[1227,3]]},"82":{"position":[[52,3]]},"98":{"position":[[227,3]]},"104":{"position":[[51,3]]},"162":{"position":[[281,3]]},"187":{"position":[[344,3]]},"217":{"position":[[501,3]]},"239":{"position":[[174,3]]},"242":{"position":[[494,3]]},"300":{"position":[[345,3]]}}}],["video",{"_index":864,"t":{"126":{"position":[[1493,5]]},"132":{"position":[[230,6]]}}}],["videosourc",{"_index":896,"t":{"132":{"position":[[197,12],[241,11]]}}}],["videosourceraw",{"_index":863,"t":{"126":{"position":[[1448,15]]}}}],["view",{"_index":416,"t":{"57":{"position":[[38,4]]},"61":{"position":[[4714,4],[4835,4],[4925,4],[5110,4],[5304,4]]},"134":{"position":[[969,4]]},"187":{"position":[[80,4],[186,4],[309,4],[393,4]]},"193":{"position":[[778,4]]},"264":{"position":[[193,6]]}}}],["viewport",{"_index":450,"t":{"57":{"position":[[1407,9]]},"76":{"position":[[414,10],[498,8],[545,9],[977,10],[1110,8],[1164,9],[1223,9]]},"209":{"position":[[191,8],[343,8]]},"229":{"position":[[286,8],[411,8],[606,10],[661,13],[742,10],[765,13]]},"231":{"position":[[577,9]]},"233":{"position":[[136,9],[171,8]]},"256":{"position":[[172,8]]},"260":{"position":[[107,8]]},"280":{"position":[[0,8]]},"288":{"position":[[394,8]]},"290":{"position":[[342,8]]}}}],["viewport.fitbound",{"_index":1423,"t":{"233":{"position":[[248,19]]}}}],["viewstat",{"_index":892,"t":{"130":{"position":[[680,10]]},"134":{"position":[[937,10],[948,9]]},"191":{"position":[[149,11],[251,14]]},"193":{"position":[[556,11],[927,14]]},"200":{"position":[[318,9],[582,14],[1289,14],[1837,14]]},"276":{"position":[[4,9],[224,9]]}}}],["viewstate.latitud",{"_index":1169,"t":{"193":{"position":[[738,20]]}}}],["viewstate.longitud",{"_index":1168,"t":{"193":{"position":[[716,21]]}}}],["viewstatechangeev",{"_index":573,"t":{"61":{"position":[[4627,21],[4747,21],[5215,21],[5342,21],[5437,21],[5541,21],[5639,21],[5765,21],[6165,21],[6300,21],[6436,21],[6852,21],[6994,21],[7123,21],[7528,21]]},"134":{"position":[[820,21]]}}}],["virtual",{"_index":1367,"t":{"217":{"position":[[114,11]]}}}],["vis.gl",{"_index":1013,"t":{"158":{"position":[[0,6]]},"160":{"position":[[44,6]]},"162":{"position":[[228,6]]},"181":{"position":[[157,6]]}}}],["visibl",{"_index":494,"t":{"59":{"position":[[1509,7]]},"61":{"position":[[1663,7],[2299,7]]},"200":{"position":[[1012,8]]},"202":{"position":[[73,7]]},"213":{"position":[[444,7]]}}}],["visit",{"_index":1480,"t":{"244":{"position":[[848,5]]}}}],["visitor",{"_index":1177,"t":{"196":{"position":[[168,7]]}}}],["visual",{"_index":60,"t":{"4":{"position":[[41,13],[177,14]]},"61":{"position":[[182,8]]},"181":{"position":[[42,13],[104,13],[208,13],[283,13],[365,13]]}}}],["visual/interact",{"_index":1005,"t":{"154":{"position":[[501,18]]}}}],["visualizepitch",{"_index":778,"t":{"91":{"position":[[204,14]]}}}],["vnext",{"_index":1004,"t":{"154":{"position":[[423,7]]}}}],["void",{"_index":251,"t":{"31":{"position":[[44,5],[162,5],[291,5],[463,5],[585,5]]},"61":{"position":[[31,5],[104,5],[267,5],[351,5],[591,5],[667,5],[787,5],[1065,5],[1346,5],[1600,5],[1823,5],[2236,5],[2458,5],[2574,5],[2880,5],[3215,5],[3515,5],[3615,5],[3873,5],[4130,5],[4390,5],[4652,5],[4772,5],[5240,5],[5367,5],[5462,5],[5566,5],[5664,5],[5790,5],[6190,5],[6325,5],[6461,5],[6877,5],[7019,5],[7148,5],[7553,5],[7686,5],[7779,5],[7872,5],[8059,5],[8190,5],[8326,5]]},"78":{"position":[[28,5],[111,5],[202,5],[290,5]]},"100":{"position":[[29,5],[98,5]]},"134":{"position":[[306,4],[514,4],[758,4]]},"138":{"position":[[272,5],[458,5],[511,5],[831,4],[936,4]]}}}],["wait",{"_index":1528,"t":{"264":{"position":[[621,7]]}}}],["want",{"_index":53,"t":{"2":{"position":[[953,4]]},"69":{"position":[[158,4]]},"202":{"position":[[36,4]]}}}],["warn",{"_index":1433,"t":{"235":{"position":[[116,7]]},"284":{"position":[[286,8]]},"292":{"position":[[99,8]]}}}],["way",{"_index":1110,"t":{"183":{"position":[[854,4]]},"187":{"position":[[14,4]]},"200":{"position":[[1025,3]]}}}],["web",{"_index":64,"t":{"4":{"position":[[116,3]]},"61":{"position":[[1457,3]]},"63":{"position":[[2903,3]]},"181":{"position":[[236,4]]}}}],["webgl",{"_index":105,"t":{"4":{"position":[[734,5]]},"181":{"position":[[251,5]]},"200":{"position":[[1603,5]]}}}],["webmercatorviewport",{"_index":1421,"t":{"233":{"position":[[111,19],[373,19]]},"256":{"position":[[128,19]]}}}],["webmercatorviewport({width",{"_index":1422,"t":{"233":{"position":[[186,27]]}}}],["webpack",{"_index":683,"t":{"63":{"position":[[2716,7]]},"172":{"position":[[702,7]]},"196":{"position":[[1123,7]]}}}],["webpack.config.j",{"_index":1203,"t":{"196":{"position":[[1142,17]]}}}],["websit",{"_index":1105,"t":{"183":{"position":[[690,8]]}}}],["webwork",{"_index":687,"t":{"63":{"position":[[2757,9],[3024,9]]}}}],["welcom",{"_index":967,"t":{"148":{"position":[[66,8]]}}}],["well",{"_index":122,"t":{"4":{"position":[[1060,4]]},"181":{"position":[[461,4]]}}}],["west",{"_index":884,"t":{"130":{"position":[[344,6]]}}}],["what'",{"_index":1405,"t":{"229":{"position":[[592,6]]}}}],["wheel",{"_index":562,"t":{"61":{"position":[[3535,5]]},"248":{"position":[[112,5]]}}}],["wheelev",{"_index":908,"t":{"134":{"position":[[481,10]]}}}],["whenev",{"_index":512,"t":{"61":{"position":[[280,8]]},"154":{"position":[[77,8]]},"179":{"position":[[78,8]]},"239":{"position":[[826,8]]}}}],["wherein",{"_index":705,"t":{"63":{"position":[[3164,7]]}}}],["wherev",{"_index":152,"t":{"6":{"position":[[108,8]]},"244":{"position":[[496,8]]}}}],["whether",{"_index":1101,"t":{"183":{"position":[[380,7]]}}}],["width",{"_index":362,"t":{"53":{"position":[[84,6]]},"98":{"position":[[895,6]]},"213":{"position":[[431,5]]},"229":{"position":[[263,5],[358,5],[425,5],[543,7],[687,7]]},"272":{"position":[[94,5]]},"288":{"position":[[409,6]]},"290":{"position":[[370,6]]}}}],["width={500",{"_index":1407,"t":{"229":{"position":[[636,11],[779,11]]}}}],["winkel",{"_index":392,"t":{"55":{"position":[[770,6]]}}}],["winkeltripel",{"_index":394,"t":{"55":{"position":[[784,17]]}}}],["within",{"_index":493,"t":{"59":{"position":[[1500,6]]},"61":{"position":[[852,6],[1131,6],[1409,6],[2020,6],[3309,6],[3554,6],[3659,6],[3915,6],[4173,6],[4435,6]]},"98":{"position":[[326,6]]}}}],["without",{"_index":19,"t":{"2":{"position":[[205,7],[357,7]]},"65":{"position":[[890,7]]},"183":{"position":[[566,7]]},"185":{"position":[[40,7]]},"200":{"position":[[1493,7]]},"244":{"position":[[596,7]]},"264":{"position":[[613,7]]}}}],["work",{"_index":1053,"t":{"172":{"position":[[159,4]]},"187":{"position":[[220,5]]},"207":{"position":[[547,5]]},"235":{"position":[[97,4]]},"280":{"position":[[444,4]]},"292":{"position":[[79,4]]}}}],["worker",{"_index":695,"t":{"63":{"position":[[2907,7]]}}}],["workerclass",{"_index":680,"t":{"63":{"position":[[2622,12]]}}}],["workercount",{"_index":694,"t":{"63":{"position":[[2857,12]]}}}],["workerurl",{"_index":693,"t":{"63":{"position":[[2846,10],[2959,10]]}}}],["world",{"_index":406,"t":{"55":{"position":[[1075,5]]},"82":{"position":[[428,9],[1005,9]]},"191":{"position":[[368,5]]}}}],["wrap",{"_index":188,"t":{"8":{"position":[[21,5]]},"17":{"position":[[21,5]]},"26":{"position":[[21,5]]},"49":{"position":[[21,5]]},"69":{"position":[[126,4]]},"73":{"position":[[21,5]]},"86":{"position":[[21,5]]},"95":{"position":[[21,5]]},"108":{"position":[[21,5]]},"207":{"position":[[147,7]]},"213":{"position":[[60,7]]}}}],["wrapper",{"_index":135,"t":{"4":{"position":[[1321,7]]},"136":{"position":[[44,8]]},"183":{"position":[[65,7]]},"290":{"position":[[51,7],[301,7]]}}}],["wrapper'",{"_index":156,"t":{"6":{"position":[[158,9]]}}}],["written",{"_index":677,"t":{"63":{"position":[[2509,7]]},"244":{"position":[[794,7]]}}}],["x",{"_index":888,"t":{"130":{"position":[[469,1]]}}}],["xia",{"_index":1027,"t":{"162":{"position":[[20,3]]}}}],["xiaoji",{"_index":1024,"t":{"162":{"position":[[0,6]]}}}],["xintong",{"_index":1026,"t":{"162":{"position":[[12,7]]}}}],["y",{"_index":889,"t":{"130":{"position":[[475,1]]}}}],["yarn",{"_index":974,"t":{"150":{"position":[[127,4],[180,4],[195,4],[213,4],[239,4],[314,4]]},"154":{"position":[[6,4]]},"172":{"position":[[406,4],[608,4]]}}}],["you'll",{"_index":1432,"t":{"235":{"position":[[102,7]]}}}],["yourauthtoken",{"_index":1137,"t":{"185":{"position":[[1324,13]]}}}],["zoom",{"_index":205,"t":{"8":{"position":[[316,5],[683,5]]},"17":{"position":[[314,5],[580,5]]},"26":{"position":[[312,5],[576,5]]},"39":{"position":[[503,5],[998,5]]},"49":{"position":[[344,5],[610,5]]},"55":{"position":[[1104,6]]},"57":{"position":[[96,4],[383,4],[782,5],[809,4],[1070,5],[1088,4],[1457,4],[1528,4]]},"59":{"position":[[50,5],[189,5],[773,5],[1185,5]]},"61":{"position":[[5149,4],[5726,4],[5853,4],[5954,4],[6135,4],[6254,4],[6636,4],[7315,4],[7711,5],[7804,5],[7914,5]]},"73":{"position":[[292,5],[616,5]]},"86":{"position":[[314,5],[580,5]]},"95":{"position":[[381,5],[835,5]]},"108":{"position":[[304,5],[560,5]]},"117":{"position":[[692,5],[1406,5]]},"130":{"position":[[832,5],[851,4]]},"136":{"position":[[422,5]]},"170":{"position":[[216,5],[552,5]]},"177":{"position":[[627,5]]},"189":{"position":[[206,5]]},"191":{"position":[[225,5]]},"193":{"position":[[632,5]]},"233":{"position":[[458,5]]},"239":{"position":[[969,6]]},"276":{"position":[[100,5]]},"280":{"position":[[293,7]]},"288":{"position":[[125,4],[423,4]]}}}]],"pipeline":["stemmer"]}}] \ No newline at end of file +[{"documents":[{"i":1,"t":"Introduction","u":"/react-map-gl/docs","b":["Docs","Overview"]},{"i":7,"t":"AttributionControl","u":"/react-map-gl/docs/api-reference/attribution-control","b":["Docs","API Reference"]},{"i":16,"t":"GeolocateControl","u":"/react-map-gl/docs/api-reference/geolocate-control","b":["Docs","API Reference"]},{"i":29,"t":"FullscreenControl","u":"/react-map-gl/docs/api-reference/fullscreen-control","b":["Docs","API Reference"]},{"i":38,"t":"Layer","u":"/react-map-gl/docs/api-reference/layer","b":["Docs","API Reference"]},{"i":48,"t":"default (Map)","u":"/react-map-gl/docs/api-reference/map","b":["Docs","API Reference"]},{"i":68,"t":"MapProvider","u":"/react-map-gl/docs/api-reference/map-provider","b":["Docs","API Reference"]},{"i":72,"t":"Marker","u":"/react-map-gl/docs/api-reference/marker","b":["Docs","API Reference"]},{"i":85,"t":"NavigationControl","u":"/react-map-gl/docs/api-reference/navigation-control","b":["Docs","API Reference"]},{"i":94,"t":"Popup","u":"/react-map-gl/docs/api-reference/popup","b":["Docs","API Reference"]},{"i":107,"t":"ScaleControl","u":"/react-map-gl/docs/api-reference/scale-control","b":["Docs","API Reference"]},{"i":116,"t":"Source","u":"/react-map-gl/docs/api-reference/source","b":["Docs","API Reference"]},{"i":121,"t":"Types","u":"/react-map-gl/docs/api-reference/types","b":["Docs","API Reference"]},{"i":135,"t":"useControl","u":"/react-map-gl/docs/api-reference/use-control","b":["Docs","API Reference"]},{"i":141,"t":"useMap","u":"/react-map-gl/docs/api-reference/use-map","b":["Docs","API Reference"]},{"i":147,"t":"Contributing","u":"/react-map-gl/docs/contributing","b":["Docs","Overview"]},{"i":165,"t":"Get Started","u":"/react-map-gl/docs/get-started","b":["Docs","Developer Guide"]},{"i":175,"t":"Adding Custom Data","u":"/react-map-gl/docs/get-started/adding-custom-data","b":["Docs","Developer Guide"]},{"i":182,"t":"About Mapbox Tokens","u":"/react-map-gl/docs/get-started/mapbox-tokens","b":["Docs","Developer Guide"]},{"i":186,"t":"State Management","u":"/react-map-gl/docs/get-started/state-management","b":["Docs","Developer Guide"]},{"i":194,"t":"Tips and Tricks","u":"/react-map-gl/docs/get-started/tips-and-tricks","b":["Docs","Developer Guide"]},{"i":203,"t":"Upgrade Guide","u":"/react-map-gl/docs/upgrade-guide","b":["Docs","Overview"]},{"i":240,"t":"What's new","u":"/react-map-gl/docs/whats-new","b":["Docs","Overview"]}],"index":{"version":"2.3.9","fields":["t"],"fieldVectors":[["t/1",[0,3.1]],["t/7",[1,3.1]],["t/16",[2,3.1]],["t/29",[3,3.1]],["t/38",[4,3.1]],["t/48",[5,2.314,6,2.314]],["t/68",[7,3.1]],["t/72",[8,3.1]],["t/85",[9,3.1]],["t/94",[10,3.1]],["t/107",[11,3.1]],["t/116",[12,3.1]],["t/121",[13,3.1]],["t/135",[14,3.1]],["t/141",[15,3.1]],["t/147",[16,3.1]],["t/165",[17,3.1]],["t/175",[18,1.847,19,1.847,20,1.847]],["t/182",[21,2.314,22,2.314]],["t/186",[23,2.314,24,2.314]],["t/194",[25,2.314,26,2.314]],["t/203",[27,2.314,28,2.314]],["t/240",[29,2.314,30,2.314]]],"invertedIndex":[["ad",{"_index":18,"t":{"175":{"position":[[0,6]]}}}],["attributioncontrol",{"_index":1,"t":{"7":{"position":[[0,18]]}}}],["contribut",{"_index":16,"t":{"147":{"position":[[0,12]]}}}],["custom",{"_index":19,"t":{"175":{"position":[[7,6]]}}}],["data",{"_index":20,"t":{"175":{"position":[[14,4]]}}}],["default",{"_index":5,"t":{"48":{"position":[[0,7]]}}}],["fullscreencontrol",{"_index":3,"t":{"29":{"position":[[0,17]]}}}],["geolocatecontrol",{"_index":2,"t":{"16":{"position":[[0,16]]}}}],["guid",{"_index":28,"t":{"203":{"position":[[8,5]]}}}],["introduct",{"_index":0,"t":{"1":{"position":[[0,12]]}}}],["layer",{"_index":4,"t":{"38":{"position":[[0,5]]}}}],["manag",{"_index":24,"t":{"186":{"position":[[6,10]]}}}],["map",{"_index":6,"t":{"48":{"position":[[8,5]]}}}],["mapbox",{"_index":21,"t":{"182":{"position":[[6,6]]}}}],["mapprovid",{"_index":7,"t":{"68":{"position":[[0,11]]}}}],["marker",{"_index":8,"t":{"72":{"position":[[0,6]]}}}],["navigationcontrol",{"_index":9,"t":{"85":{"position":[[0,17]]}}}],["new",{"_index":30,"t":{"240":{"position":[[7,3]]}}}],["popup",{"_index":10,"t":{"94":{"position":[[0,5]]}}}],["scalecontrol",{"_index":11,"t":{"107":{"position":[[0,12]]}}}],["sourc",{"_index":12,"t":{"116":{"position":[[0,6]]}}}],["start",{"_index":17,"t":{"165":{"position":[[4,7]]}}}],["state",{"_index":23,"t":{"186":{"position":[[0,5]]}}}],["tip",{"_index":25,"t":{"194":{"position":[[0,4]]}}}],["token",{"_index":22,"t":{"182":{"position":[[13,6]]}}}],["trick",{"_index":26,"t":{"194":{"position":[[9,6]]}}}],["type",{"_index":13,"t":{"121":{"position":[[0,5]]}}}],["upgrad",{"_index":27,"t":{"203":{"position":[[0,7]]}}}],["usecontrol",{"_index":14,"t":{"135":{"position":[[0,10]]}}}],["usemap",{"_index":15,"t":{"141":{"position":[[0,6]]}}}],["what'",{"_index":29,"t":{"240":{"position":[[0,6]]}}}]],"pipeline":["stemmer"]}},{"documents":[{"i":3,"t":"Design Philosophy","u":"/react-map-gl/docs","h":"#design-philosophy","p":1},{"i":5,"t":"Limitations","u":"/react-map-gl/docs","h":"#limitations","p":1},{"i":9,"t":"Properties","u":"/react-map-gl/docs/api-reference/attribution-control","h":"#properties","p":7},{"i":10,"t":"Reactive Properties","u":"/react-map-gl/docs/api-reference/attribution-control","h":"#reactive-properties","p":7},{"i":12,"t":"Other Properties","u":"/react-map-gl/docs/api-reference/attribution-control","h":"#other-properties","p":7},{"i":14,"t":"Source","u":"/react-map-gl/docs/api-reference/attribution-control","h":"#source","p":7},{"i":18,"t":"Properties","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#properties","p":16},{"i":19,"t":"Reactive Properties","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#reactive-properties","p":16},{"i":21,"t":"Callbacks","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#callbacks","p":16},{"i":23,"t":"Other Properties","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#other-properties","p":16},{"i":25,"t":"Methods","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#methods","p":16},{"i":27,"t":"Source","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#source","p":16},{"i":31,"t":"Properties","u":"/react-map-gl/docs/api-reference/fullscreen-control","h":"#properties","p":29},{"i":32,"t":"Reactive Properties","u":"/react-map-gl/docs/api-reference/fullscreen-control","h":"#reactive-properties","p":29},{"i":34,"t":"Other Properties","u":"/react-map-gl/docs/api-reference/fullscreen-control","h":"#other-properties","p":29},{"i":36,"t":"Source","u":"/react-map-gl/docs/api-reference/fullscreen-control","h":"#source","p":29},{"i":40,"t":"Properties","u":"/react-map-gl/docs/api-reference/layer","h":"#properties","p":38},{"i":42,"t":"Identity Properties","u":"/react-map-gl/docs/api-reference/layer","h":"#identity-properties","p":38},{"i":44,"t":"Options","u":"/react-map-gl/docs/api-reference/layer","h":"#options","p":38},{"i":46,"t":"Source","u":"/react-map-gl/docs/api-reference/layer","h":"#source","p":38},{"i":50,"t":"Properties","u":"/react-map-gl/docs/api-reference/map","h":"#properties","p":48},{"i":52,"t":"Layout options","u":"/react-map-gl/docs/api-reference/map","h":"#layout-options","p":48},{"i":54,"t":"Styling options","u":"/react-map-gl/docs/api-reference/map","h":"#styling-options","p":48},{"i":56,"t":"Camera options","u":"/react-map-gl/docs/api-reference/map","h":"#camera-options","p":48},{"i":58,"t":"Input handler options","u":"/react-map-gl/docs/api-reference/map","h":"#input-handler-options","p":48},{"i":60,"t":"Callbacks","u":"/react-map-gl/docs/api-reference/map","h":"#callbacks","p":48},{"i":62,"t":"Other options","u":"/react-map-gl/docs/api-reference/map","h":"#other-options","p":48},{"i":64,"t":"Methods","u":"/react-map-gl/docs/api-reference/map","h":"#methods","p":48},{"i":66,"t":"Source","u":"/react-map-gl/docs/api-reference/map","h":"#source","p":48},{"i":70,"t":"Source","u":"/react-map-gl/docs/api-reference/map-provider","h":"#source","p":68},{"i":74,"t":"Properties","u":"/react-map-gl/docs/api-reference/marker","h":"#properties","p":72},{"i":75,"t":"Reactive Properties","u":"/react-map-gl/docs/api-reference/marker","h":"#reactive-properties","p":72},{"i":77,"t":"Callbacks","u":"/react-map-gl/docs/api-reference/marker","h":"#callbacks","p":72},{"i":79,"t":"Other Properties","u":"/react-map-gl/docs/api-reference/marker","h":"#other-properties","p":72},{"i":81,"t":"Methods","u":"/react-map-gl/docs/api-reference/marker","h":"#methods","p":72},{"i":83,"t":"Source","u":"/react-map-gl/docs/api-reference/marker","h":"#source","p":72},{"i":87,"t":"Properties","u":"/react-map-gl/docs/api-reference/navigation-control","h":"#properties","p":85},{"i":88,"t":"Reactive Properties","u":"/react-map-gl/docs/api-reference/navigation-control","h":"#reactive-properties","p":85},{"i":90,"t":"Other Properties","u":"/react-map-gl/docs/api-reference/navigation-control","h":"#other-properties","p":85},{"i":92,"t":"Source","u":"/react-map-gl/docs/api-reference/navigation-control","h":"#source","p":85},{"i":96,"t":"Properties","u":"/react-map-gl/docs/api-reference/popup","h":"#properties","p":94},{"i":97,"t":"Reactive Properties","u":"/react-map-gl/docs/api-reference/popup","h":"#reactive-properties","p":94},{"i":99,"t":"Callbacks","u":"/react-map-gl/docs/api-reference/popup","h":"#callbacks","p":94},{"i":101,"t":"Other Properties","u":"/react-map-gl/docs/api-reference/popup","h":"#other-properties","p":94},{"i":103,"t":"Methods","u":"/react-map-gl/docs/api-reference/popup","h":"#methods","p":94},{"i":105,"t":"Source","u":"/react-map-gl/docs/api-reference/popup","h":"#source","p":94},{"i":109,"t":"Properties","u":"/react-map-gl/docs/api-reference/scale-control","h":"#properties","p":107},{"i":110,"t":"Reactive Properties","u":"/react-map-gl/docs/api-reference/scale-control","h":"#reactive-properties","p":107},{"i":112,"t":"Other Properties","u":"/react-map-gl/docs/api-reference/scale-control","h":"#other-properties","p":107},{"i":114,"t":"Source","u":"/react-map-gl/docs/api-reference/scale-control","h":"#source","p":107},{"i":118,"t":"Properties","u":"/react-map-gl/docs/api-reference/source","h":"#properties","p":116},{"i":123,"t":"Components","u":"/react-map-gl/docs/api-reference/types","h":"#components","p":121},{"i":125,"t":"Styling","u":"/react-map-gl/docs/api-reference/types","h":"#styling","p":121},{"i":127,"t":"Configurations","u":"/react-map-gl/docs/api-reference/types","h":"#configurations","p":121},{"i":129,"t":"Data Types","u":"/react-map-gl/docs/api-reference/types","h":"#data-types","p":121},{"i":131,"t":"Sources","u":"/react-map-gl/docs/api-reference/types","h":"#sources","p":121},{"i":133,"t":"Events","u":"/react-map-gl/docs/api-reference/types","h":"#events","p":121},{"i":137,"t":"Signature","u":"/react-map-gl/docs/api-reference/use-control","h":"#signature","p":135},{"i":139,"t":"Source","u":"/react-map-gl/docs/api-reference/use-control","h":"#source","p":135},{"i":143,"t":"Signature","u":"/react-map-gl/docs/api-reference/use-map","h":"#signature","p":141},{"i":145,"t":"Source","u":"/react-map-gl/docs/api-reference/use-map","h":"#source","p":141},{"i":149,"t":"Setting Up Dev Environment","u":"/react-map-gl/docs/contributing","h":"#setting-up-dev-environment","p":147},{"i":151,"t":"Pull Requests","u":"/react-map-gl/docs/contributing","h":"#pull-requests","p":147},{"i":153,"t":"PR Checklist","u":"/react-map-gl/docs/contributing","h":"#pr-checklist","p":147},{"i":155,"t":"Release","u":"/react-map-gl/docs/contributing","h":"#release","p":147},{"i":157,"t":"Community Governance","u":"/react-map-gl/docs/contributing","h":"#community-governance","p":147},{"i":159,"t":"Technical Steering Committee","u":"/react-map-gl/docs/contributing","h":"#technical-steering-committee","p":147},{"i":161,"t":"Maintainers","u":"/react-map-gl/docs/contributing","h":"#maintainers","p":147},{"i":163,"t":"Code of Conduct","u":"/react-map-gl/docs/contributing","h":"#code-of-conduct","p":147},{"i":167,"t":"Installation","u":"/react-map-gl/docs/get-started","h":"#installation","p":165},{"i":169,"t":"Example","u":"/react-map-gl/docs/get-started","h":"#example","p":165},{"i":171,"t":"Styling","u":"/react-map-gl/docs/get-started","h":"#styling","p":165},{"i":173,"t":"Using with a Compatible Fork","u":"/react-map-gl/docs/get-started","h":"#using-with-a-compatible-fork","p":165},{"i":176,"t":"Native Mapbox Layers","u":"/react-map-gl/docs/get-started/adding-custom-data","h":"#native-mapbox-layers","p":175},{"i":178,"t":"Custom Overlays","u":"/react-map-gl/docs/get-started/adding-custom-data","h":"#custom-overlays","p":175},{"i":180,"t":"Other vis.gl Libraries","u":"/react-map-gl/docs/get-started/adding-custom-data","h":"#other-visgl-libraries","p":175},{"i":184,"t":"Display Maps Without A Mapbox Token","u":"/react-map-gl/docs/get-started/mapbox-tokens","h":"#display-maps-without-a-mapbox-token","p":182},{"i":188,"t":"Uncontrolled Map","u":"/react-map-gl/docs/get-started/state-management","h":"#uncontrolled-map","p":186},{"i":190,"t":"Controlled Map","u":"/react-map-gl/docs/get-started/state-management","h":"#controlled-map","p":186},{"i":192,"t":"Custom Camera Constraints","u":"/react-map-gl/docs/get-started/state-management","h":"#custom-camera-constraints","p":186},{"i":195,"t":"Securing Mapbox Token","u":"/react-map-gl/docs/get-started/tips-and-tricks","h":"#securing-mapbox-token","p":194},{"i":197,"t":"Minimize Cost from Frequent Re-mounting","u":"/react-map-gl/docs/get-started/tips-and-tricks","h":"#minimize-cost-from-frequent-re-mounting","p":194},{"i":199,"t":"Performance with Many Markers","u":"/react-map-gl/docs/get-started/tips-and-tricks","h":"#performance-with-many-markers","p":194},{"i":201,"t":"Finding out if a point is within the current viewport","u":"/react-map-gl/docs/get-started/tips-and-tricks","h":"#finding-out-if-a-point-is-within-the-current-viewport","p":194},{"i":204,"t":"Upgrading to v7.1","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v71","p":203},{"i":206,"t":"Upgrading to v7.0","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v70","p":203},{"i":208,"t":"Dependencies","u":"/react-map-gl/docs/upgrade-guide","h":"#dependencies","p":203},{"i":210,"t":"Module exports","u":"/react-map-gl/docs/upgrade-guide","h":"#module-exports","p":203},{"i":212,"t":"Map","u":"/react-map-gl/docs/upgrade-guide","h":"#map","p":203},{"i":214,"t":"Other components","u":"/react-map-gl/docs/upgrade-guide","h":"#other-components","p":203},{"i":216,"t":"Upgrading to v5.3/v6.1","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v53v61","p":203},{"i":218,"t":"Upgrading to v6","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v6","p":203},{"i":220,"t":"Upgrading to v4","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v4","p":203},{"i":222,"t":"Upgrading to v3.2","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v32","p":203},{"i":224,"t":"Upgrading to v3","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v3","p":203},{"i":226,"t":"Version Requirements","u":"/react-map-gl/docs/upgrade-guide","h":"#version-requirements","p":203},{"i":228,"t":"MapGL Component","u":"/react-map-gl/docs/upgrade-guide","h":"#mapgl-component","p":203},{"i":230,"t":"Overlays","u":"/react-map-gl/docs/upgrade-guide","h":"#overlays","p":203},{"i":232,"t":"fitBounds utility function","u":"/react-map-gl/docs/upgrade-guide","h":"#fitbounds-utility-function","p":203},{"i":234,"t":"Deprecations","u":"/react-map-gl/docs/upgrade-guide","h":"#deprecations","p":203},{"i":236,"t":"Upgrading to v2","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v2","p":203},{"i":238,"t":"Upgrading to v1","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v1","p":203},{"i":241,"t":"react-map-gl v7.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v71","p":240},{"i":243,"t":"react-map-gl v7.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v70","p":240},{"i":245,"t":"react-map-gl v5.3/v6.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v53v61","p":240},{"i":247,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights","p":240},{"i":249,"t":"react-map-gl v6.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v60","p":240},{"i":251,"t":"What's Changed","u":"/react-map-gl/docs/whats-new","h":"#whats-changed","p":240},{"i":253,"t":"react-map-gl v5.2","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v52","p":240},{"i":255,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-1","p":240},{"i":257,"t":"react-map-gl v5.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v51","p":240},{"i":259,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-2","p":240},{"i":261,"t":"react-map-gl v5.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v50","p":240},{"i":263,"t":"What's Changed","u":"/react-map-gl/docs/whats-new","h":"#whats-changed-1","p":240},{"i":265,"t":"react-map-gl v4.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v41","p":240},{"i":267,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-3","p":240},{"i":269,"t":"react-map-gl v4.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v40","p":240},{"i":271,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-4","p":240},{"i":273,"t":"react-map-gl v3.3","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v33","p":240},{"i":275,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-5","p":240},{"i":277,"t":"react-map-gl v3.2","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v32","p":240},{"i":279,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-6","p":240},{"i":281,"t":"react-map-gl v3.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v31","p":240},{"i":283,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-7","p":240},{"i":285,"t":"react-map-gl v3.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v30","p":240},{"i":287,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-8","p":240},{"i":289,"t":"Components","u":"/react-map-gl/docs/whats-new","h":"#components","p":240},{"i":291,"t":"Property Changes","u":"/react-map-gl/docs/whats-new","h":"#property-changes","p":240},{"i":293,"t":"Utilities","u":"/react-map-gl/docs/whats-new","h":"#utilities","p":240},{"i":295,"t":"react-map-gl v2.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v20","p":240},{"i":297,"t":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-9","p":240},{"i":299,"t":"react-map-gl v1.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v10","p":240},{"i":301,"t":"react-map-gl v0.6","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v06","p":240}],"index":{"version":"2.3.9","fields":["t"],"fieldVectors":[["t/3",[0,4.37,1,4.37]],["t/5",[2,5.55]],["t/9",[3,2.002]],["t/10",[3,1.577,4,2.805]],["t/12",[3,2.002]],["t/14",[5,2.836]],["t/18",[3,2.002]],["t/19",[3,1.577,4,2.805]],["t/21",[6,4.193]],["t/23",[3,2.002]],["t/25",[7,4.193]],["t/27",[5,2.836]],["t/31",[3,2.002]],["t/32",[3,1.577,4,2.805]],["t/34",[3,2.002]],["t/36",[5,2.836]],["t/40",[3,2.002]],["t/42",[3,1.577,8,4.37]],["t/44",[9,3.739]],["t/46",[5,2.836]],["t/50",[3,2.002]],["t/52",[9,2.944,10,4.37]],["t/54",[9,2.944,11,3.546]],["t/56",[9,2.944,12,3.873]],["t/58",[9,2.428,13,3.604,14,3.604]],["t/60",[6,4.193]],["t/62",[9,3.739]],["t/64",[7,4.193]],["t/66",[5,2.836]],["t/70",[5,2.836]],["t/74",[3,2.002]],["t/75",[3,1.577,4,2.805]],["t/77",[6,4.193]],["t/79",[3,2.002]],["t/81",[7,4.193]],["t/83",[5,2.836]],["t/87",[3,2.002]],["t/88",[3,1.577,4,2.805]],["t/90",[3,2.002]],["t/92",[5,2.836]],["t/96",[3,2.002]],["t/97",[3,1.577,4,2.805]],["t/99",[6,4.193]],["t/101",[3,2.002]],["t/103",[7,4.193]],["t/105",[5,2.836]],["t/109",[3,2.002]],["t/110",[3,1.577,4,2.805]],["t/112",[3,2.002]],["t/114",[5,2.836]],["t/118",[3,2.002]],["t/123",[15,4.193]],["t/125",[11,4.503]],["t/127",[16,5.55]],["t/129",[17,4.37,18,4.37]],["t/131",[5,2.836]],["t/133",[19,5.55]],["t/137",[20,4.919]],["t/139",[5,2.836]],["t/143",[20,4.919]],["t/145",[5,2.836]],["t/149",[21,3.067,22,3.067,23,3.067,24,3.067]],["t/151",[25,4.37,26,4.37]],["t/153",[27,4.37,28,4.37]],["t/155",[29,5.55]],["t/157",[30,4.37,31,4.37]],["t/159",[32,3.604,33,3.604,34,3.604]],["t/161",[35,5.55]],["t/163",[36,4.37,37,4.37]],["t/167",[38,5.55]],["t/169",[39,5.55]],["t/171",[11,4.503]],["t/173",[40,3.604,41,3.604,42,3.604]],["t/176",[43,3.604,44,2.924,45,3.604]],["t/178",[46,3.873,47,3.873]],["t/180",[48,4.37,49,4.37]],["t/184",[44,2.165,50,2.669,51,1.115,52,2.669,53,2.365]],["t/188",[51,1.826,54,4.37]],["t/190",[51,1.826,55,4.37]],["t/192",[12,3.194,46,3.194,56,3.604]],["t/195",[44,2.924,53,3.194,57,3.604]],["t/197",[58,2.669,59,2.669,60,2.669,61,2.669,62,2.669]],["t/199",[63,3.604,64,3.604,65,3.604]],["t/201",[66,2.362,67,2.362,68,2.362,69,2.362,70,2.362,71,2.362]],["t/204",[72,2.575,73,3.873]],["t/206",[72,2.575,74,3.873]],["t/208",[75,5.55]],["t/210",[76,4.37,77,4.37]],["t/212",[51,2.319]],["t/214",[15,4.193]],["t/216",[72,2.575,78,3.873]],["t/218",[72,2.575,79,4.37]],["t/220",[72,2.575,80,4.37]],["t/222",[72,2.575,81,3.873]],["t/224",[72,2.575,82,4.37]],["t/226",[83,4.37,84,4.37]],["t/228",[15,3.302,85,4.37]],["t/230",[47,4.919]],["t/232",[86,3.604,87,3.194,88,3.604]],["t/234",[89,5.55]],["t/236",[72,2.575,90,4.37]],["t/238",[72,2.575,91,4.37]],["t/241",[51,1.282,73,2.718,92,1.43,93,1.43]],["t/243",[51,1.282,74,2.718,92,1.43,93,1.43]],["t/245",[51,1.282,78,2.718,92,1.43,93,1.43]],["t/247",[94,3.146]],["t/249",[51,1.282,92,1.43,93,1.43,95,3.067]],["t/251",[96,3.873,97,3.546]],["t/253",[51,1.282,92,1.43,93,1.43,98,3.067]],["t/255",[94,3.146]],["t/257",[51,1.282,92,1.43,93,1.43,99,3.067]],["t/259",[94,3.146]],["t/261",[51,1.282,92,1.43,93,1.43,100,3.067]],["t/263",[96,3.873,97,3.546]],["t/265",[51,1.282,92,1.43,93,1.43,101,3.067]],["t/267",[94,3.146]],["t/269",[51,1.282,92,1.43,93,1.43,102,3.067]],["t/271",[94,3.146]],["t/273",[51,1.282,92,1.43,93,1.43,103,3.067]],["t/275",[94,3.146]],["t/277",[51,1.282,81,2.718,92,1.43,93,1.43]],["t/279",[94,3.146]],["t/281",[51,1.282,92,1.43,93,1.43,104,3.067]],["t/283",[94,3.146]],["t/285",[51,1.282,92,1.43,93,1.43,105,3.067]],["t/287",[94,3.146]],["t/289",[15,4.193]],["t/291",[3,1.577,97,3.546]],["t/293",[87,4.919]],["t/295",[51,1.282,92,1.43,93,1.43,106,3.067]],["t/297",[94,3.146]],["t/299",[51,1.282,92,1.43,93,1.43,107,3.067]],["t/301",[51,1.282,92,1.43,93,1.43,108,3.067]]],"invertedIndex":[["callback",{"_index":6,"t":{"21":{"position":[[0,9]]},"60":{"position":[[0,9]]},"77":{"position":[[0,9]]},"99":{"position":[[0,9]]}}}],["camera",{"_index":12,"t":{"56":{"position":[[0,6]]},"192":{"position":[[7,6]]}}}],["chang",{"_index":97,"t":{"251":{"position":[[7,7]]},"263":{"position":[[7,7]]},"291":{"position":[[9,7]]}}}],["checklist",{"_index":28,"t":{"153":{"position":[[3,9]]}}}],["code",{"_index":36,"t":{"163":{"position":[[0,4]]}}}],["committe",{"_index":34,"t":{"159":{"position":[[19,9]]}}}],["commun",{"_index":30,"t":{"157":{"position":[[0,9]]}}}],["compat",{"_index":41,"t":{"173":{"position":[[13,10]]}}}],["compon",{"_index":15,"t":{"123":{"position":[[0,10]]},"214":{"position":[[6,10]]},"228":{"position":[[6,9]]},"289":{"position":[[0,10]]}}}],["conduct",{"_index":37,"t":{"163":{"position":[[8,7]]}}}],["configur",{"_index":16,"t":{"127":{"position":[[0,14]]}}}],["constraint",{"_index":56,"t":{"192":{"position":[[14,11]]}}}],["control",{"_index":55,"t":{"190":{"position":[[0,10]]}}}],["cost",{"_index":59,"t":{"197":{"position":[[9,4]]}}}],["current",{"_index":70,"t":{"201":{"position":[[37,7]]}}}],["custom",{"_index":46,"t":{"178":{"position":[[0,6]]},"192":{"position":[[0,6]]}}}],["data",{"_index":17,"t":{"129":{"position":[[0,4]]}}}],["depend",{"_index":75,"t":{"208":{"position":[[0,12]]}}}],["deprec",{"_index":89,"t":{"234":{"position":[[0,12]]}}}],["design",{"_index":0,"t":{"3":{"position":[[0,6]]}}}],["dev",{"_index":23,"t":{"149":{"position":[[11,3]]}}}],["display",{"_index":50,"t":{"184":{"position":[[0,7]]}}}],["environ",{"_index":24,"t":{"149":{"position":[[15,11]]}}}],["event",{"_index":19,"t":{"133":{"position":[[0,6]]}}}],["exampl",{"_index":39,"t":{"169":{"position":[[0,7]]}}}],["export",{"_index":77,"t":{"210":{"position":[[7,7]]}}}],["find",{"_index":66,"t":{"201":{"position":[[0,7]]}}}],["fitbound",{"_index":86,"t":{"232":{"position":[[0,9]]}}}],["fork",{"_index":42,"t":{"173":{"position":[[24,4]]}}}],["frequent",{"_index":60,"t":{"197":{"position":[[19,8]]}}}],["function",{"_index":88,"t":{"232":{"position":[[18,8]]}}}],["gl",{"_index":93,"t":{"241":{"position":[[10,2]]},"243":{"position":[[10,2]]},"245":{"position":[[10,2]]},"249":{"position":[[10,2]]},"253":{"position":[[10,2]]},"257":{"position":[[10,2]]},"261":{"position":[[10,2]]},"265":{"position":[[10,2]]},"269":{"position":[[10,2]]},"273":{"position":[[10,2]]},"277":{"position":[[10,2]]},"281":{"position":[[10,2]]},"285":{"position":[[10,2]]},"295":{"position":[[10,2]]},"299":{"position":[[10,2]]},"301":{"position":[[10,2]]}}}],["govern",{"_index":31,"t":{"157":{"position":[[10,10]]}}}],["handler",{"_index":14,"t":{"58":{"position":[[6,7]]}}}],["highlight",{"_index":94,"t":{"247":{"position":[[0,10]]},"255":{"position":[[0,10]]},"259":{"position":[[0,10]]},"267":{"position":[[0,10]]},"271":{"position":[[0,10]]},"275":{"position":[[0,10]]},"279":{"position":[[0,10]]},"283":{"position":[[0,10]]},"287":{"position":[[0,10]]},"297":{"position":[[0,10]]}}}],["ident",{"_index":8,"t":{"42":{"position":[[0,8]]}}}],["input",{"_index":13,"t":{"58":{"position":[[0,5]]}}}],["instal",{"_index":38,"t":{"167":{"position":[[0,12]]}}}],["layer",{"_index":45,"t":{"176":{"position":[[14,6]]}}}],["layout",{"_index":10,"t":{"52":{"position":[[0,6]]}}}],["librari",{"_index":49,"t":{"180":{"position":[[13,9]]}}}],["limit",{"_index":2,"t":{"5":{"position":[[0,11]]}}}],["maintain",{"_index":35,"t":{"161":{"position":[[0,11]]}}}],["mani",{"_index":64,"t":{"199":{"position":[[17,4]]}}}],["map",{"_index":51,"t":{"184":{"position":[[8,4]]},"188":{"position":[[13,3]]},"190":{"position":[[11,3]]},"212":{"position":[[0,3]]},"241":{"position":[[6,3]]},"243":{"position":[[6,3]]},"245":{"position":[[6,3]]},"249":{"position":[[6,3]]},"253":{"position":[[6,3]]},"257":{"position":[[6,3]]},"261":{"position":[[6,3]]},"265":{"position":[[6,3]]},"269":{"position":[[6,3]]},"273":{"position":[[6,3]]},"277":{"position":[[6,3]]},"281":{"position":[[6,3]]},"285":{"position":[[6,3]]},"295":{"position":[[6,3]]},"299":{"position":[[6,3]]},"301":{"position":[[6,3]]}}}],["mapbox",{"_index":44,"t":{"176":{"position":[[7,6]]},"184":{"position":[[23,6]]},"195":{"position":[[9,6]]}}}],["mapgl",{"_index":85,"t":{"228":{"position":[[0,5]]}}}],["marker",{"_index":65,"t":{"199":{"position":[[22,7]]}}}],["method",{"_index":7,"t":{"25":{"position":[[0,7]]},"64":{"position":[[0,7]]},"81":{"position":[[0,7]]},"103":{"position":[[0,7]]}}}],["minim",{"_index":58,"t":{"197":{"position":[[0,8]]}}}],["modul",{"_index":76,"t":{"210":{"position":[[0,6]]}}}],["mount",{"_index":62,"t":{"197":{"position":[[31,8]]}}}],["nativ",{"_index":43,"t":{"176":{"position":[[0,6]]}}}],["option",{"_index":9,"t":{"44":{"position":[[0,7]]},"52":{"position":[[7,7]]},"54":{"position":[[8,7]]},"56":{"position":[[7,7]]},"58":{"position":[[14,7]]},"62":{"position":[[6,7]]}}}],["out",{"_index":67,"t":{"201":{"position":[[8,3]]}}}],["overlay",{"_index":47,"t":{"178":{"position":[[7,8]]},"230":{"position":[[0,8]]}}}],["perform",{"_index":63,"t":{"199":{"position":[[0,11]]}}}],["philosophi",{"_index":1,"t":{"3":{"position":[[7,10]]}}}],["point",{"_index":68,"t":{"201":{"position":[[17,5]]}}}],["pr",{"_index":27,"t":{"153":{"position":[[0,2]]}}}],["properti",{"_index":3,"t":{"9":{"position":[[0,10]]},"10":{"position":[[9,10]]},"12":{"position":[[6,10]]},"18":{"position":[[0,10]]},"19":{"position":[[9,10]]},"23":{"position":[[6,10]]},"31":{"position":[[0,10]]},"32":{"position":[[9,10]]},"34":{"position":[[6,10]]},"40":{"position":[[0,10]]},"42":{"position":[[9,10]]},"50":{"position":[[0,10]]},"74":{"position":[[0,10]]},"75":{"position":[[9,10]]},"79":{"position":[[6,10]]},"87":{"position":[[0,10]]},"88":{"position":[[9,10]]},"90":{"position":[[6,10]]},"96":{"position":[[0,10]]},"97":{"position":[[9,10]]},"101":{"position":[[6,10]]},"109":{"position":[[0,10]]},"110":{"position":[[9,10]]},"112":{"position":[[6,10]]},"118":{"position":[[0,10]]},"291":{"position":[[0,8]]}}}],["pull",{"_index":25,"t":{"151":{"position":[[0,4]]}}}],["re",{"_index":61,"t":{"197":{"position":[[28,2]]}}}],["react",{"_index":92,"t":{"241":{"position":[[0,5]]},"243":{"position":[[0,5]]},"245":{"position":[[0,5]]},"249":{"position":[[0,5]]},"253":{"position":[[0,5]]},"257":{"position":[[0,5]]},"261":{"position":[[0,5]]},"265":{"position":[[0,5]]},"269":{"position":[[0,5]]},"273":{"position":[[0,5]]},"277":{"position":[[0,5]]},"281":{"position":[[0,5]]},"285":{"position":[[0,5]]},"295":{"position":[[0,5]]},"299":{"position":[[0,5]]},"301":{"position":[[0,5]]}}}],["reactiv",{"_index":4,"t":{"10":{"position":[[0,8]]},"19":{"position":[[0,8]]},"32":{"position":[[0,8]]},"75":{"position":[[0,8]]},"88":{"position":[[0,8]]},"97":{"position":[[0,8]]},"110":{"position":[[0,8]]}}}],["releas",{"_index":29,"t":{"155":{"position":[[0,7]]}}}],["request",{"_index":26,"t":{"151":{"position":[[5,8]]}}}],["requir",{"_index":84,"t":{"226":{"position":[[8,12]]}}}],["secur",{"_index":57,"t":{"195":{"position":[[0,8]]}}}],["set",{"_index":21,"t":{"149":{"position":[[0,7]]}}}],["signatur",{"_index":20,"t":{"137":{"position":[[0,9]]},"143":{"position":[[0,9]]}}}],["sourc",{"_index":5,"t":{"14":{"position":[[0,6]]},"27":{"position":[[0,6]]},"36":{"position":[[0,6]]},"46":{"position":[[0,6]]},"66":{"position":[[0,6]]},"70":{"position":[[0,6]]},"83":{"position":[[0,6]]},"92":{"position":[[0,6]]},"105":{"position":[[0,6]]},"114":{"position":[[0,6]]},"131":{"position":[[0,7]]},"139":{"position":[[0,6]]},"145":{"position":[[0,6]]}}}],["steer",{"_index":33,"t":{"159":{"position":[[10,8]]}}}],["style",{"_index":11,"t":{"54":{"position":[[0,7]]},"125":{"position":[[0,7]]},"171":{"position":[[0,7]]}}}],["technic",{"_index":32,"t":{"159":{"position":[[0,9]]}}}],["token",{"_index":53,"t":{"184":{"position":[[30,5]]},"195":{"position":[[16,5]]}}}],["type",{"_index":18,"t":{"129":{"position":[[5,5]]}}}],["uncontrol",{"_index":54,"t":{"188":{"position":[[0,12]]}}}],["up",{"_index":22,"t":{"149":{"position":[[8,2]]}}}],["upgrad",{"_index":72,"t":{"204":{"position":[[0,9]]},"206":{"position":[[0,9]]},"216":{"position":[[0,9]]},"218":{"position":[[0,9]]},"220":{"position":[[0,9]]},"222":{"position":[[0,9]]},"224":{"position":[[0,9]]},"236":{"position":[[0,9]]},"238":{"position":[[0,9]]}}}],["us",{"_index":40,"t":{"173":{"position":[[0,5]]}}}],["util",{"_index":87,"t":{"232":{"position":[[10,7]]},"293":{"position":[[0,9]]}}}],["v0.6",{"_index":108,"t":{"301":{"position":[[13,4]]}}}],["v1",{"_index":91,"t":{"238":{"position":[[13,2]]}}}],["v1.0",{"_index":107,"t":{"299":{"position":[[13,4]]}}}],["v2",{"_index":90,"t":{"236":{"position":[[13,2]]}}}],["v2.0",{"_index":106,"t":{"295":{"position":[[13,4]]}}}],["v3",{"_index":82,"t":{"224":{"position":[[13,2]]}}}],["v3.0",{"_index":105,"t":{"285":{"position":[[13,4]]}}}],["v3.1",{"_index":104,"t":{"281":{"position":[[13,4]]}}}],["v3.2",{"_index":81,"t":{"222":{"position":[[13,4]]},"277":{"position":[[13,4]]}}}],["v3.3",{"_index":103,"t":{"273":{"position":[[13,4]]}}}],["v4",{"_index":80,"t":{"220":{"position":[[13,2]]}}}],["v4.0",{"_index":102,"t":{"269":{"position":[[13,4]]}}}],["v4.1",{"_index":101,"t":{"265":{"position":[[13,4]]}}}],["v5.0",{"_index":100,"t":{"261":{"position":[[13,4]]}}}],["v5.1",{"_index":99,"t":{"257":{"position":[[13,4]]}}}],["v5.2",{"_index":98,"t":{"253":{"position":[[13,4]]}}}],["v5.3/v6.1",{"_index":78,"t":{"216":{"position":[[13,9]]},"245":{"position":[[13,9]]}}}],["v6",{"_index":79,"t":{"218":{"position":[[13,2]]}}}],["v6.0",{"_index":95,"t":{"249":{"position":[[13,4]]}}}],["v7.0",{"_index":74,"t":{"206":{"position":[[13,4]]},"243":{"position":[[13,4]]}}}],["v7.1",{"_index":73,"t":{"204":{"position":[[13,4]]},"241":{"position":[[13,4]]}}}],["version",{"_index":83,"t":{"226":{"position":[[0,7]]}}}],["viewport",{"_index":71,"t":{"201":{"position":[[45,8]]}}}],["vis.gl",{"_index":48,"t":{"180":{"position":[[6,6]]}}}],["what'",{"_index":96,"t":{"251":{"position":[[0,6]]},"263":{"position":[[0,6]]}}}],["within",{"_index":69,"t":{"201":{"position":[[26,6]]}}}],["without",{"_index":52,"t":{"184":{"position":[[13,7]]}}}]],"pipeline":["stemmer"]}},{"documents":[{"i":2,"t":"These docs are forLooking for an old version? react-map-gl is a suite of React components for Mapbox GL JS-compatible libraries. Library Description MapLibre An open fork of mapbox-gl v1, that can be used without a mapbox token. Mapbox GL JS v1 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 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. For basemaps: You can load map data from Mapbox's own service. You can create and host your own map data using one of the many open source tools. New to react-map-gl? Get Started Want to contribute? See our Developer Guide","s":"Introduction","u":"/react-map-gl/docs","h":"","p":1},{"i":4,"t":"react-map-gl was first created by Uber's Visualization team, where Mapbox was used as a component to build powerful web tools such as geospatial analytics and self-driving data visualization. To manage the complexity of these applications, we fully embrace React and reactive programming. The stock mapbox-gl APIs are imperative. That is, you instruct the map to do something (for example, map.flyTo), and it will execute the command at its own pace. This does not scale when we have many components that need to synchronize with each other. We sometimes render two maps side by side, and when the user interacts with one, update both cameras. We draw React UI outside of the map container, that moves with the camera. We also render WebGL graphic overlays on top of the map, most notably with deck.gl. In these use cases, in order for all components to synchronize correctly, they must have their shared states managed by React. We might store the source of truth in a parent component state, or Redux store, or hooks, and let it propagate down to the map as well as its peers. Ultimately, in the spirit of the reactive programming paradigm, data always flows down. As long as the map manages its own state, as mapbox-gl is designed to do, we risk the components going out of sync. react-map-gl creates a fully reactive wrapper for mapbox-gl. The Map component can be fully controlled, that is, the map's camera would never deviate from the props that it's assigned. Read more about this core behavior in state management.","s":"Design Philosophy","u":"/react-map-gl/docs","h":"#design-philosophy","p":1},{"i":6,"t":"In v7.0, react-map-gl was fully rewritten to better align its API with the underlying Mapbox GL JS library. Wherever the reactive usage patterns permits, the wrapper's props and methods are 1:1 mappings to their native API equivelants. It is possible to call the native methods directly from the Map instance obtained via getMap. However, doing so may result in the map's state to deviate from its props. For example, calling map.setMaxZoom directly will cause the map's constraint settings to differ from the value of the maxZoom prop. Generally speaking, calling a native method is disencouraged if the same thing can be achieved through the React interface. If a third-party plugin does so, then it may lead to some unexpected behaviors.","s":"Limitations","u":"/react-map-gl/docs","h":"#limitations","p":1},{"i":8,"t":"React component that wraps the base library's AttributionControl class (Mapbox | Maplibre). Mapbox Maplibre import * as React from 'react'; import Map, {AttributionControl} from 'react-map-gl'; function App() { return \" initialViewState={{ longitude: -100, latitude: 40, zoom: 3.5 }} mapStyle=\"mapbox://styles/mapbox/streets-v9\" // disable the default attribution attributionControl={false} > ; } import * as React from 'react'; import Map, {AttributionControl} from 'react-map-gl/maplibre'; function App() { return ; }","s":"AttributionControl","u":"/react-map-gl/docs/api-reference/attribution-control","h":"","p":7},{"i":11,"t":"style: CSSProperties​ CSS style override that applies to the control's container.","s":"Reactive Properties","u":"/react-map-gl/docs/api-reference/attribution-control","h":"#reactive-properties","p":7},{"i":13,"t":"The properties in this section are not reactive. They are only used when the component first mounts. Any options supported by the AttributionControl class (Mapbox | Maplibre), such as compact customAttribution Plus the following: position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'​ Default: 'bottom-right' Placement of the control relative to the map.","s":"Other Properties","u":"/react-map-gl/docs/api-reference/attribution-control","h":"#other-properties","p":7},{"i":15,"t":"attribution-control.ts","s":"Source","u":"/react-map-gl/docs/api-reference/attribution-control","h":"#source","p":7},{"i":17,"t":"React component that wraps the base library's GeolocateControl class (Mapbox | Maplibre). Mapbox Maplibre import * as React from 'react'; import Map, {GeolocateControl} from 'react-map-gl'; function App() { return \" initialViewState={{ longitude: -100, latitude: 40, zoom: 3.5 }} mapStyle=\"mapbox://styles/mapbox/streets-v9\" > ; } import * as React from 'react'; import Map, {GeolocateControl} from 'react-map-gl/maplibre'; function App() { return ; }","s":"GeolocateControl","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"","p":16},{"i":20,"t":"style: CSSProperties​ CSS style override that applies to the control's container.","s":"Reactive Properties","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#reactive-properties","p":16},{"i":22,"t":"onGeolocate: (evt: GeolocateResultEvent) => void​ Called on each Geolocation API position update that returned as success. onError: (evt: GeolocateErrorEvent) => void​ Called on each Geolocation API position update that returned as an error. onOutOfMaxBounds: (evt: GeolocateResultEvent) => void​ Called on each Geolocation API position update that returned as success but user position is out of map maxBounds. onTrackUserLocationStart: (evt: GeolocateEvent) => void​ Called when the GeolocateControl changes to the active lock state. onTrackUserLocationEnd: (evt: GeolocateEvent) => void​ Called when the GeolocateControl changes to the background state.","s":"Callbacks","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#callbacks","p":16},{"i":24,"t":"The properties in this section are not reactive. They are only used when the component first mounts. Any options supported by the GeolocateControl class (Mapbox | Maplibre), such as positionOptions fitBoundsOptions trackUserLocation showAccuracyCircle showUserLocation Plus the following: position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'​ Default: 'bottom-right' Placement of the control relative to the map.","s":"Other Properties","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#other-properties","p":16},{"i":26,"t":"The underlying native GeolocateControl instance is accessible via a React ref hook. You may use it to call any imperative methods: Mapbox Maplibre import * as React from 'react'; import {useRef, useEffect} from 'react'; import Map, {GeolocateControl} from 'react-map-gl'; import type mapboxgl from 'mapbox-gl'; function App() { const geoControlRef = useRef(); useEffect(() => { // Activate as soon as the control is loaded geoControlRef.current?.trigger(); }, [geoControlRef.current]); return ; } import * as React from 'react'; import {useRef, useEffect} from 'react'; import Map, {GeolocateControl} from 'react-map-gl/maplibre'; import type maplibregl from 'maplibre-gl'; function App() { const geoControlRef = useRef(); useEffect(() => { // Activate as soon as the control is loaded geoControlRef.current?.trigger(); }, [geoControlRef.current]); return ; }","s":"Methods","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#methods","p":16},{"i":28,"t":"geolocate-control.ts","s":"Source","u":"/react-map-gl/docs/api-reference/geolocate-control","h":"#source","p":16},{"i":30,"t":"React component that wraps the base library's FullscreenControl class (Mapbox | Maplibre). Mapbox Maplibre import * as React from 'react'; import Map, {FullscreenControl} from 'react-map-gl'; function App() { return \" initialViewState={{ longitude: -100, latitude: 40, zoom: 3.5 }} mapStyle=\"mapbox://styles/mapbox/streets-v9\" > ; } import * as React from 'react'; import Map, {FullscreenControl} from 'react-map-gl/maplibre'; function App() { return ; }","s":"FullscreenControl","u":"/react-map-gl/docs/api-reference/fullscreen-control","h":"","p":29},{"i":33,"t":"style: CSSProperties​ CSS style override that applies to the control's container.","s":"Reactive Properties","u":"/react-map-gl/docs/api-reference/fullscreen-control","h":"#reactive-properties","p":29},{"i":35,"t":"The properties in this section are not reactive. They are only used when the component first mounts. containerId: string​ Id of the DOM element which should be made full screen. By default, the map container element will be made full screen. position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'​ Default: 'top-right' Placement of the control relative to the map.","s":"Other Properties","u":"/react-map-gl/docs/api-reference/fullscreen-control","h":"#other-properties","p":29},{"i":37,"t":"fullscreen-control.ts","s":"Source","u":"/react-map-gl/docs/api-reference/fullscreen-control","h":"#source","p":29},{"i":39,"t":"This component allows apps to create a map layer using React. Mapbox Maplibre import * as React from 'react'; import Map, {Layer} from 'react-map-gl'; import type {FillLayer} from 'react-map-gl'; const parkLayer: FillLayer = { id: 'landuse_park', type: 'fill', source: 'mapbox', 'source-layer': 'landuse', filter: ['==', 'class', 'park'], paint: { 'fill-color': '#4E3FC8' } }; function App() { return \" initialViewState={{ longitude: -122.4, latitude: 37.8, zoom: 14 }} mapStyle=\"mapbox://styles/mapbox/streets-v9\" > ; } import * as React from 'react'; import Map, {Layer} from 'react-map-gl/maplibre'; import type {FillLayer} from 'react-map-gl/maplibre'; const parkLayer: FillLayer = { id: 'landuse_park', type: 'fill', source: 'mapbox', 'source-layer': 'landuse', filter: ['==', 'class', 'park'], paint: { 'fill-color': '#4E3FC8' } }; function App() { return ; }","s":"Layer","u":"/react-map-gl/docs/api-reference/layer","h":"","p":38},{"i":41,"t":"The props provided to this component should be conforming to the Mapbox layer specification. When props change shallowly, the component will perform style diffing to update the layer. Avoid defining constant objects/arrays inline may help performance.","s":"Properties","u":"/react-map-gl/docs/api-reference/layer","h":"#properties","p":38},{"i":43,"t":"Once a is mounted, the following props should not change. If you add/remove multiple JSX layers dynamically, make sure you use React's key prop to give each element a stable identity. id: string​ Unique identifier of the layer. If not provided, a default id will be assigned. type: string​ Required. Type of the layer.","s":"Identity Properties","u":"/react-map-gl/docs/api-reference/layer","h":"#identity-properties","p":38},{"i":45,"t":"beforeId: string​ The ID of an existing layer to insert this layer before. If this prop is omitted, the layer will be appended to the end of the layers array. This is useful when using dynamic layers with a map style from a URL. Note that layers are added by the order that they mount. They are NOT reordered later if their relative positions in the JSX tree change. If dynamic reordering is desired, you should manipulate beforeId for consistent behavior. source: string​ source is required by some layer types in the Mapbox style specification. If is used as the child of a Source component, this prop will be overwritten by the id of the parent source.","s":"Options","u":"/react-map-gl/docs/api-reference/layer","h":"#options","p":38},{"i":47,"t":"layer.ts","s":"Source","u":"/react-map-gl/docs/api-reference/layer","h":"#source","p":38},{"i":49,"t":"React component that wraps the base library's Map class (Mapbox | Maplibre). This is also the default export from react-map-gl. Mapbox Maplibre app.tsx import * as React from 'react'; import Map from 'react-map-gl'; function App() { return ( \" initialViewState={{ longitude: -122.4, latitude: 37.8, zoom: 14 }} style={{width: 600, height: 400}} mapStyle=\"mapbox://styles/mapbox/streets-v9\" /> ); } app.tsx import * as React from 'react'; import Map from 'react-map-gl/maplibre'; function App() { return ( ); }","s":"default (Map)","u":"/react-map-gl/docs/api-reference/map","h":"","p":48},{"i":51,"t":"Aside from the props listed below, the Map component supports all parameters of the Map class constructor (Mapbox | Maplibre). Beware that this is not an exhaustive list of all props. Different base map libraries may offer different options and default values. When in doubt, refer to your base map library's documentation.","s":"Properties","u":"/react-map-gl/docs/api-reference/map","h":"#properties","p":48},{"i":53,"t":"id: string​ Map container id. style: CSSProperties​ Default: {position: 'relative', width: '100%', height: '100%'} Map container CSS. cursor: string​ Default: 'auto' The current cursor type.","s":"Layout options","u":"/react-map-gl/docs/api-reference/map","h":"#layout-options","p":48},{"i":55,"t":"fog: Fog​ The fog property of the style. Must conform to the Fog Style Specification. If undefined is provided, removes the fog from the map. light: Light​ Light properties of the style. Must conform to the Light Style Specification. mapStyle: MapboxStyle | string | Immutable​ Default: (empty style) The map's Mapbox style. This must be an a JSON object conforming to the schema described in the Mapbox Style Specification, or a URL to such JSON. projection: string | Projection​ Default: 'mercator' The projection the map should be rendered in. Available projections are Albers ('albers'), Equal Earth ('equalEarth'), Equirectangular/Plate Carrée/WGS84 ('equirectangular'), Lambert ('lambertConformalConic'), Mercator ('mercator'), Natural Earth ('naturalEarth'), and Winkel Tripel ('winkelTripel'). Conic projections such as Albers and Lambert have configurable center and parallels properties that allow developers to define the region in which the projection has minimal distortion; see example. renderWorldCopies: boolean​ Default: true If true, multiple copies of the world will be rendered, when zoomed out. styleDiffing: boolean​ Default: true Enable diffing when mapStyle changes. If false, force a 'full' update, removing the current style and building the given one instead of attempting a diff-based update. terrain: Terrain​ Terrain property of the style. Must conform to the Terrain Style Specification. If undefined is provided, removes terrain from the map.","s":"Styling options","u":"/react-map-gl/docs/api-reference/map","h":"#styling-options","p":48},{"i":57,"t":"initialViewState: object​ The initial view state of the map. If specified, longitude, latitude, zoom etc. in props are ignored when constructing the map. Only specify initialViewState if Map is being used as an uncontrolled component. See state management for examples. bounds: LngLatBoundsLike - The initial bounds of the map. If specified, it overrides the longitude, latitude and zoom options. Default null. fitBoundsOptions - An object to use only when setting the bounds option. Default null. fitBoundsOptions.offset: PointLike fitBoundsOptions.minZoom: number fitBoundsOptions.maxZoom: number fitBoundsOptions.padding: PaddingOptions longitude: number - The initial longitude of the map center. Default 0. latitude: number - The initial latitude of the map center. Default 0. zoom: number - The initial zoom level. Default 0. pitch: number - The initial pitch (tilt) of the map. Default 0. bearing: number - The initial bearing (rotation) of the map. Default 0. longitude: number​ The longitude of the map center. latitude: number​ The latitude of the map center. zoom: number​ The zoom level of the map. pitch: number​ The initial pitch (tilt) of the map, measured in degrees away from the plane of the screen (0-85). bearing: number​ The initial bearing (rotation) of the map, measured in degrees counter-clockwise from north. padding: PaddingOptions​ Default: null The padding in pixels around the viewport. minZoom: number​ Default: 0 The minimum zoom level of the map (0-24). maxZoom: number​ Default: 22 The maximum zoom level of the map (0-24). minPitch: number​ Default: 0 The minimum pitch of the map (0-85). maxPitch: number​ Default: 60 The maximum pitch of the map (0-85). maxBounds: LngLatBoundsLike​ Default: null If set, the map is constrained to the given bounds.","s":"Camera options","u":"/react-map-gl/docs/api-reference/map","h":"#camera-options","p":48},{"i":59,"t":"boxZoom: boolean​ Default: true If true, the \"box zoom\" interaction is enabled. See BoxZoomHandler (Mapbox | Maplibre) doubleClickZoom: boolean​ Default: true If true, the \"double click to zoom\" interaction is enabled. See DoubleClickZoomHandler (Mapbox | Maplibre). dragRotate: boolean​ Default: true If true, the \"drag to rotate\" interaction is enabled. See DragRotateHandler (Mapbox | Maplibre). dragPan: boolean | Object​ Default: true If true, the \"drag to pan\" interaction is enabled. Optionally accpt an object value that is the options to DragPanHandler.enable (Mapbox | Maplibre). keyboard: boolean​ Default: true If true, keyboard shortcuts are enabled. See KeyboardHandler (Mapbox | Maplibre). scrollZoom: boolean | Object​ Default: true If true, the \"scroll to zoom\" interaction is enabled. Optionally accpt an object value that is the options to ScrollZoomHandler.enable (Mapbox | Maplibre) touchPitch: boolean | Object​ Default: true If true, the \"drag to pitch\" interaction is enabled. Optionally accpt an object value that is the options to TouchPitchHandler.enable(Mapbox | Maplibre). touchZoomRotate: boolean | Object​ Default: true If true, the \"pinch to rotate and zoom\" interaction is enabled. Optionally accpt an object value that is the options to TouchZoomRotateHandler.enable (Mapbox | Maplibre). interactiveLayerIds: string[]​ Default: null The id(s) of style layer(s). If specified, pointer event (mousemove, click etc.) listeners will be triggered only if its location is within a visible feature in these layers, and the event will have a features property containing an array of the matching features. If not specified, pointer event listeners will be triggered by a corresponding event happening anywhere on the map, and the event will not have a features property. See the Callbacks section for affected events.","s":"Input handler options","u":"/react-map-gl/docs/api-reference/map","h":"#input-handler-options","p":48},{"i":61,"t":"onResize: (event: MapEvent) => void​ Called when the map has been resized. onLoad: (event: MapEvent) => void​ Called after all necessary resources have been downloaded and the first visually complete rendering of the map has occurred. onRender: (event: MapEvent)) => void​ Called whenever the map is drawn to the screen. onIdle: (event: MapEvent)) => void​ Called after the last frame rendered before the map enters an \"idle\" state: No camera transitions are in progress All currently requested tiles have loaded All fade/transition animations have completed onRemove: (event: MapEvent)) => void​ Called when the map has been removed. onError: (event: ErrorEvent) => void​ Default: evt => console.error(evt.error) Called when an error occurs. onMouseDown: (event: MapLayerMouseEvent) => void​ Called when a pointing device (usually a mouse) is pressed within the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onMouseUp: (event: MapLayerMouseEvent) => void​ Called when a pointing device (usually a mouse) is released within the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onMouseOver: (event: MapLayerMouseEvent) => void​ Called when a pointing device (usually a mouse) is moved within the map. As you move the cursor across a web page containing a map, the event will fire each time it enters the map or any child elements. onMouseEnter: (event: MapLayerMouseEvent) => void​ Called when a pointing device (usually a mouse) enters a visible portion of the layer(s) specified by interactiveLayerIds from outside that layer or outside the map canvas. onMouseMove: (event: MapLayerMouseEvent) => void​ Called when a pointing device (usually a mouse) is moved while the cursor is inside the map. As you move the cursor across the map, the event will fire every time the cursor changes position within the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onMouseLeave: (event: MapLayerMouseEvent) => void​ Called when a pointing device (usually a mouse) leaves a visible portion of the layer(s) specified by interactiveLayerIds or moves from the layer to outside the map canvas. onMouseOut: (event: MapLayerMouseEvent) => void​ Called when a point device (usually a mouse) leaves the map's canvas. onClick: (event: MapLayerMouseEvent) => void​ Called when a pointing device (usually a mouse) is pressed and released at the same point on the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onDblClick: (event: MapLayerMouseEvent) => void​ Called when a pointing device (usually a mouse) is pressed and released twice at the same point on the map in rapid succession. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onContextMenu: (event: MapLayerMouseEvent) => void​ Called when the right button of the mouse is clicked or the context menu key is pressed within the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onWheel: (event: MapWheelEvent) => void​ Called when a wheel event occurs within the map. onTouchStart: (event: MapLayerTouchEvent) => void​ Called when a touchstart event occurs within the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onTouchEnd: (event: MapLayerTouchEvent) => void​ Called when a touchend event occurs within the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onTouchMove: (event: MapLayerTouchEvent) => void​ Called when a touchmove event occurs within the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onTouchCancel: (event: MapLayerTouchEvent) => void​ Called when a touchcancel event occurs within the map. If interactiveLayerIds is specified, the event will contain an additional features field that contains features under the cursor from the specified layer. onMoveStart: (event: ViewStateChangeEvent) => void​ Called just before the map begins a transition from one view to another. onMove: (event: ViewStateChangeEvent) => void​ Called repeatedly during an animated transition from one view to another. When Map is used as a controlled component, event.viewState reflects the view state that the camera \"proposes\" to move to, as a result of either user interaction or methods such as flyTo. The camera does not actually change until the application updates the view state props (longitude, latitude, zoom etc.). See state management for examples. onMoveEnd: (event: ViewStateChangeEvent) => void​ Called just after the map completes a transition from one view to another. onDragStart: (event: ViewStateChangeEvent) => void​ Called when a \"drag to pan\" interaction starts. onDrag: (event: ViewStateChangeEvent) => void​ Called repeatedly during a \"drag to pan\" interaction. onDragEnd: (event: ViewStateChangeEvent) => void​ Called when a \"drag to pan\" interaction ends. onZoomStart: (event: ViewStateChangeEvent) => void​ Called just before the map begins a transition from one zoom level to another. onZoom: (event: ViewStateChangeEvent) => void​ Called repeatedly during an animated transition from one zoom level to another. When Map is used as a controlled component, event.viewState.zoom reflects the zoom that the camera \"proposes\" to change to, as a result of either user interaction or methods such as flyTo. The camera does not actually change until the application updates the zoom prop. onZoomEnd: (event: ViewStateChangeEvent) => void​ Called just after the map completes a transition from one zoom level to another. onRotateStart: (event: ViewStateChangeEvent) => void​ Called just before the map begins a transition from one bearing (rotation) to another. onRotate: (event: ViewStateChangeEvent) => void​ Called repeatedly during an animated transition from one bearing (rotation) to another. When Map is used as a controlled component, event.viewState.bearing reflects the zoom that the camera \"proposes\" to change to, as a result of either user interaction or methods such as flyTo. The camera does not actually change until the application updates the bearing prop. onRotateEnd: (event: ViewStateChangeEvent) => void​ Called just after the map completes a transition from one bearing (rotation) to another. onPitchStart: (event: ViewStateChangeEvent) => void​ Called just before the map begins a transition from one pitch (tilt) to another. onPitch: (event: ViewStateChangeEvent) => void​ Called repeatedly during an animated transition from one pitch (tilt) to another. When Map is used as a controlled component, event.viewState.pitch reflects the zoom that the camera \"proposes\" to change to, as a result of either user interaction or methods such as flyTo. The camera does not actually change until the application updates the pitch prop. onPitchEnd: (event: ViewStateChangeEvent) => void​ Called just after the map completes a transition from one pitch (tilt) to another. onBoxZoomStart: (event: MapBoxZoomEvent) => void​ Called when a \"box zoom\" interaction starts. onBoxZoomEnd: (event: MapBoxZoomEvent) => void​ Called when a \"box zoom\" interaction ends. onBoxZoomCancel: (event:MapBoxZoomEvent) => void​ Called when the user cancels a \"box zoom\" interaction, or when the bounding box does not meet the minimum size threshold. onData: (event: MapStyleDataEvent | MapSourceDataEvent) => void​ Called when any map data loads or changes. See MapDataEvent for more information. onStyleData: (event: MapStyleDataEvent) => void​ Called when the map's style loads or changes. See MapDataEvent for more information. onSourceData: (event: MapSourceDataEvent) => void​ Called when one of the map's sources loads or changes, including if a tile belonging to a source loads or changes. See MapDataEvent for more information.","s":"Callbacks","u":"/react-map-gl/docs/api-reference/map","h":"#callbacks","p":48},{"i":63,"t":"The following props, along with any options of the Map class (Mapbox | Maplibre) not listed above, can be specified to construct the underlying Map instance. Note: props in this section are not reactive. They are only used once when the Map instance is constructed. mapLib: any​ Default: import('mapbox-gl') if imported from react-map-gl import('maplibre-gl') if imported from react-map-gl/maplibre Specify the underlying base map library for the Map component. The value can be provided with several options: By module import (and embedding in the final bundle): import * as React from 'react'; import Map from 'react-map-gl'; import mapboxgl from 'mapbox-gl'; function App() { return ; } By dynamic import (thus enable bundle splitting): import * as React from 'react'; import Map from 'react-map-gl'; function App() { return ; } Or to load a pre-bundled version of the library: index.html app.tsx import * as React from 'react'; import Map from 'react-map-gl'; function App() { return ; } mapboxAccessToken: string​ Token used to access the Mapbox data service. See about map tokens. baseApiUrl: string​ The map's default API URL for requesting tiles, styles, sprites, and glyphs. maxParallelImageRequests: number​ Default: 16 The maximum number of images (raster tiles, sprites, icons) to load in parallel. reuseMaps: boolean​ Default: false By default, every time a map component is unmounted, all internal resources associated with the underlying Map instance are released. If the map gets mounted again, a new Map instance is constructed. If reuseMaps is set to true, when a map component is unmounted, the underlying Map instance is retained in memory. The next time a map component gets mounted, the saved instance is reused. This behavior may be desirable if an application frequently mounts/unmounts map(s), for example in a tabbed or collapsable UI, and wants to avoid Mapbox's billable events triggered by initialization. Note that since some map options cannot be modified after initialization, when reusing maps, only the reactive props and initialViewState of the new component are respected. RTLTextPlugin: string​ Default: 'https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-rtl-text/v0.2.3/mapbox-gl-rtl-text.js' Sets the map's RTL text plugin. Necessary for supporting the Arabic and Hebrew languages, which are written right-to-left. Setting this prop is the equivelant of calling mapboxgl.setRTLTextPlugin with lazy: true. workerClass: object​ Default: null Provides an interface for external module bundlers such as Webpack or Rollup to package mapbox-gl's WebWorker into a separate class and integrate it with the library. Takes precedence over workerUrl. workerCount: number​ Default: 2 The number of web workers instantiated on a page with mapbox-gl maps. workerUrl: string​ Provides an interface for loading mapbox-gl's WebWorker bundle from a self-hosted URL. This is useful if your site needs to operate in a strict CSP (Content Security Policy) environment wherein you are not allowed to load JavaScript code from a Blob URL, which is default behavior.","s":"Other options","u":"/react-map-gl/docs/api-reference/map","h":"#other-options","p":48},{"i":65,"t":"Imperative methods are accessible via a React ref or the useMap hook. Mapbox Maplibre import * as React from 'react'; import {useRef, useCallback} from 'react'; import Map from 'react-map-gl'; import type {MapRef} from 'react-map-gl'; function App() { const mapRef = useRef(); const onMapLoad = useCallback(() => { mapRef.current.on('move', () => { // do something }); }, []); return ; } import * as React from 'react'; import {useRef, useCallback} from 'react'; import Map from 'react-map-gl/maplibre'; import type {MapRef} from 'react-map-gl/maplibre'; function App() { const mapRef = useRef(); const onMapLoad = useCallback(() => { mapRef.current.on('move', () => { // do something }); }, []); return ; } The MapRef object exposes Map methods (Mapbox | Maplibre) that are safe to call without breaking the React bindings. For example, setStyle() is hidden from the ref object, because the style is supposed to be changed by updating the mapStyle prop. Calling the method directly may cause the the React prop to mismatch with the underlying state, and lead to unexpected behaviors. You can still access the hidden members via getMap(): getMap()​ Returns the native Map (Mapbox | Maplibre) instance associated with this component.","s":"Methods","u":"/react-map-gl/docs/api-reference/map","h":"#methods","p":48},{"i":67,"t":"map.tsx","s":"Source","u":"/react-map-gl/docs/api-reference/map","h":"#source","p":48},{"i":69,"t":"A Context.Provider that facilitates map operations outside of the component that directly renders a Map. The component should wrap all nodes in which you may want to access the maps: import {MapProvider} from 'react-map-gl'; function Root() { return ( { // Application tree, somewhere one or more component(s) are rendered } ); } See useMap for more information.","s":"MapProvider","u":"/react-map-gl/docs/api-reference/map-provider","h":"","p":68},{"i":71,"t":"use-map.tsx","s":"Source","u":"/react-map-gl/docs/api-reference/map-provider","h":"#source","p":68},{"i":73,"t":"React component that wraps the base library's Marker class (Mapbox | Maplibre). Mapbox Maplibre import * as React from 'react'; import Map, {Marker} from 'react-map-gl'; function App() { return \" initialViewState={{ longitude: -100, latitude: 40, zoom: 3.5 }} mapStyle=\"mapbox://styles/mapbox/streets-v9\" > ; } import * as React from 'react'; import Map, {Marker} from 'react-map-gl/maplibre'; function App() { return ; } If Marker is mounted with child components, then its content will be rendered to the specified location. If it is mounted with no content, then a default marker will be used.","s":"Marker","u":"/react-map-gl/docs/api-reference/marker","h":"","p":72},{"i":76,"t":"draggable: boolean​ Default: false If true, the marker is able to be dragged to a new position on the map. latitude: number​ Required. The latitude of the anchor location. longitude: number​ Required. The longitude of the anchor location. offset: PointLike​ Default: null The offset in pixels as a PointLike object to apply relative to the element's center. Negatives indicate left and up. pitchAlignment: 'map' | 'viewport' | 'auto'​ Default: 'auto' map aligns the Marker to the plane of the map. viewport aligns the Marker to the plane of the viewport. auto automatically matches the value of rotationAlignment. popup: Popup | null​ An instance of the Popup class (Mapbox | Maplibre) to attach to this marker. If undefined or null, any popup set on this Marker instance is unset. rotation: number​ Default: 0 The rotation angle of the marker in degrees, relative to its rotationAlignment setting. A positive value will rotate the marker clockwise. rotationAlignment: 'map' | 'viewport' | 'auto'​ Default: 'auto' map aligns the Marker's rotation relative to the map, maintaining a bearing as the map rotates. viewport aligns the Marker's rotation relative to the viewport, agnostic to map rotations. auto is equivalent to viewport. style: CSSProperties​ CSS style override that applies to the marker's container.","s":"Reactive Properties","u":"/react-map-gl/docs/api-reference/marker","h":"#reactive-properties","p":72},{"i":78,"t":"onClick: (evt: MapEvent) => void​ Called when the marker is clicked on. onDragStart: (evt: MarkerDragEvent) => void​ Called when dragging starts, if draggable is true. onDrag: (evt: MarkerDragEvent) => void​ Called while dragging, if draggable is true. onDragEnd: (evt: MarkerDragEvent) => void​ Called when dragging ends, if draggable is true.","s":"Callbacks","u":"/react-map-gl/docs/api-reference/marker","h":"#callbacks","p":72},{"i":80,"t":"The properties in this section are not reactive. They are only used when the component first mounts. Any options supported by the Marker class (Mapbox | Maplibre), such as anchor color scale clickTolerance","s":"Other Properties","u":"/react-map-gl/docs/api-reference/marker","h":"#other-properties","p":72},{"i":82,"t":"The underlying native Marker instance is accessible via a React ref hook. You may use it to call any imperative methods: Mapbox Maplibre import * as React from 'react'; import {useRef, useMemo, useCallback} from 'react'; import Map, {Marker} from 'react-map-gl'; import mapboxgl from 'mapbox-gl'; function App() { const markerRef = useRef(); const popup = useMemo(() => { return mapboxgl.Popup().setText('Hello world!'); }, []) const togglePopup = useCallback(() => { markerRef.current?.togglePopup(); }, []); return <> ; } import * as React from 'react'; import {useRef, useMemo, useCallback} from 'react'; import Map, {Marker} from 'react-map-gl/maplibre'; import maplibregl from 'maplibre-gl'; function App() { const markerRef = useRef(); const popup = useMemo(() => { return maplibregl.Popup().setText('Hello world!'); }, []) const togglePopup = useCallback(() => { markerRef.current?.togglePopup(); }, []); return <> ; }","s":"Methods","u":"/react-map-gl/docs/api-reference/marker","h":"#methods","p":72},{"i":84,"t":"marker.ts","s":"Source","u":"/react-map-gl/docs/api-reference/marker","h":"#source","p":72},{"i":86,"t":"React component that wraps the base library's NavigationControl class (Mapbox | Maplibre). Mapbox Maplibre import * as React from 'react'; import Map, {NavigationControl} from 'react-map-gl'; function App() { return \" initialViewState={{ longitude: -100, latitude: 40, zoom: 3.5 }} mapStyle=\"mapbox://styles/mapbox/streets-v9\" > ; } import * as React from 'react'; import Map, {NavigationControl} from 'react-map-gl/maplibre'; function App() { return ; }","s":"NavigationControl","u":"/react-map-gl/docs/api-reference/navigation-control","h":"","p":85},{"i":89,"t":"style: CSSProperties​ CSS style override that applies to the control's container.","s":"Reactive Properties","u":"/react-map-gl/docs/api-reference/navigation-control","h":"#reactive-properties","p":85},{"i":91,"t":"The properties in this section are not reactive. They are only used when the component first mounts. Any options supported by the NavigationControl class (Mapbox | Maplibre), such as showCompass showZoom visualizePitch Plus the following: position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'​ Default: 'top-right' Placement of the control relative to the map.","s":"Other Properties","u":"/react-map-gl/docs/api-reference/navigation-control","h":"#other-properties","p":85},{"i":93,"t":"navigation-control.ts","s":"Source","u":"/react-map-gl/docs/api-reference/navigation-control","h":"#source","p":85},{"i":95,"t":"React component that wraps the base library's Popup class (Mapbox | Maplibre). Mapbox Maplibre import * as React from 'react'; import {useState} from 'react'; import Map, {Popup} from 'react-map-gl'; function App() { const [showPopup, setShowPopup] = useState(true); return \" initialViewState={{ longitude: -100, latitude: 40, zoom: 3.5 }} mapStyle=\"mapbox://styles/mapbox/streets-v9\" > {showPopup && ( setShowPopup(false)}> You are here )} ; } import * as React from 'react'; import {useState} from 'react'; import Map, {Popup} from 'react-map-gl/maplibre'; function App() { const [showPopup, setShowPopup] = useState(true); return {showPopup && ( setShowPopup(false)}> You are here )} ; }","s":"Popup","u":"/react-map-gl/docs/api-reference/popup","h":"","p":94},{"i":98,"t":"anchor: 'center' | 'left' | 'right' | 'top' | 'bottom' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | undefined​ A string indicating the part of the popup that should be positioned closest to the coordinate, set via longitude and latitude. If unset, the anchor will be dynamically set to ensure the popup falls within the map container with a preference for 'bottom'. className: string​ Space-separated CSS class names to add to popup container. offset: number | PointLike | Record\\​ Default: null A pixel offset applied to the popup's location specified as: a single number specifying a distance from the popup's location a PointLike specifying a constant offset an object of Points specifing an offset for each anchor position. Negative offsets indicate left and up. maxWidth: string​ Default: 240px A string that sets the CSS property of the popup's maximum width. style: CSSProperties​ CSS style override that applies to the popup's container.","s":"Reactive Properties","u":"/react-map-gl/docs/api-reference/popup","h":"#reactive-properties","p":94},{"i":100,"t":"onOpen: (evt: PopupEvent) => void​ Called when the popup is opened. onClose: (evt: PopupEvent) => void​ Called when the popup is closed by the user clicking on the close button or outside (if closeOnClick: true).","s":"Callbacks","u":"/react-map-gl/docs/api-reference/popup","h":"#callbacks","p":94},{"i":102,"t":"The properties in this section are not reactive. They are only used when the component first mounts. Any options supported by the Popup class (Mapbox | Maplibre), such as closeButton closeOnClick closeOnMove focusAfterOpen","s":"Other Properties","u":"/react-map-gl/docs/api-reference/popup","h":"#other-properties","p":94},{"i":104,"t":"The underlying native Popup instance is accessible via a React ref hook. You may use it to call any imperative methods: Mapbox Maplibre import * as React from 'react'; import {useRef, useEffect} from 'react'; import Map, {Popup} from 'react-map-gl'; import mapboxgl from 'mapbox-gl'; function App() { const popupRef = useRef(); useEffect(() => { popupRef.current?.trackPointer(); }, [popupRef.current]) return Tooltip ; } import * as React from 'react'; import {useRef, useEffect} from 'react'; import Map, {Popup} from 'react-map-gl/maplibre'; import maplibregl from 'maplibre-gl'; function App() { const popupRef = useRef(); useEffect(() => { popupRef.current?.trackPointer(); }, [popupRef.current]) return Tooltip ; }","s":"Methods","u":"/react-map-gl/docs/api-reference/popup","h":"#methods","p":94},{"i":106,"t":"popup.ts","s":"Source","u":"/react-map-gl/docs/api-reference/popup","h":"#source","p":94},{"i":108,"t":"React component that wraps the base library's ScaleControl class (Mapbox | Maplibre). Mapbox Maplibre import * as React from 'react'; import Map, {ScaleControl} from 'react-map-gl'; function App() { return \" initialViewState={{ longitude: -100, latitude: 40, zoom: 3.5 }} mapStyle=\"mapbox://styles/mapbox/streets-v9\" > ; } import * as React from 'react'; import Map, {ScaleControl} from 'react-map-gl/maplibre'; function App() { return ; }","s":"ScaleControl","u":"/react-map-gl/docs/api-reference/scale-control","h":"","p":107},{"i":111,"t":"maxWidth: string​ Default: 100 The maximum length of the scale control in pixels. style: CSSProperties​ CSS style override that applies to the control's container. unit: 'imperial' | 'metric' | 'nautical'​ Default: 'metric' Unit of the distance.","s":"Reactive Properties","u":"/react-map-gl/docs/api-reference/scale-control","h":"#reactive-properties","p":107},{"i":113,"t":"The properties in this section are not reactive. They are only used when the component first mounts. position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'​ Default: 'top-right' Placement of the control relative to the map.","s":"Other Properties","u":"/react-map-gl/docs/api-reference/scale-control","h":"#other-properties","p":107},{"i":115,"t":"scale-control.ts","s":"Source","u":"/react-map-gl/docs/api-reference/scale-control","h":"#source","p":107},{"i":117,"t":"This component allows apps to create a map source using React. It may contain Layer components as children. Mapbox Maplibre import * as React from 'react'; import Map, {Source, Layer} from 'react-map-gl'; import type {CircleLayer} from 'react-map-gl'; import type {FeatureCollection} from 'geojson'; const geojson: FeatureCollection = { type: 'FeatureCollection', features: [ {type: 'Feature', geometry: {type: 'Point', coordinates: [-122.4, 37.8]}} ] }; const layerStyle: CircleLayer = { id: 'point', type: 'circle', paint: { 'circle-radius': 10, 'circle-color': '#007cbf' } }; function App() { return ; } import * as React from 'react'; import Map, {Source, Layer} from 'react-map-gl/maplibre'; import type {CircleLayer} from 'react-map-gl/maplibre'; import type {FeatureCollection} from 'geojson'; const geojson: FeatureCollection = { type: 'FeatureCollection', features: [ {type: 'Feature', geometry: {type: 'Point', coordinates: [-122.4, 37.8]}} ] }; const layerStyle: CircleLayer = { id: 'point', type: 'circle', paint: { 'circle-radius': 10, 'circle-color': '#007cbf' } }; function App() { return ; }","s":"Source","u":"/react-map-gl/docs/api-reference/source","h":"","p":116},{"i":119,"t":"The props provided to this component should be conforming to the Mapbox source specification or CanvasSourceOptions. When props change shallowly, the component will attempt to update the source. Do not define objects/arrays inline to avoid perf hit. Once a is mounted, the following props should not change. If add/remove multiple JSX sources dynamically, make sure you use React's key prop to give each element a stable identity. id: string​ Unique identifier of the source. If not provided, a default id will be assigned. type: string​ Required. Type of the source.","s":"Properties","u":"/react-map-gl/docs/api-reference/source","h":"#properties","p":116},{"i":120,"t":"source.ts","s":"Source","u":"/react-map-gl/docs/api-reference/source","h":"#source-1","p":116},{"i":122,"t":"The following types can be imported from react-map-gl when using TypeScript.","s":"Types","u":"/react-map-gl/docs/api-reference/types","h":"","p":121},{"i":124,"t":"IControl​ A custom control implementation. CustomLayerInterface​ A custom layer implementation. MapRef​ Instance ref of a Map component. See Map documentation for details.","s":"Components","u":"/react-map-gl/docs/api-reference/types","h":"#components","p":121},{"i":126,"t":"MapStyle​ An object conforming to the Mapbox Style Specification. Fog​ An object conforming to the Fog Style Specification. Light​ An object conforming to the Light Style Specification. Terrain​ An object conforming to the Terrain Style Specification. Projection​ An object conforming to the Projection Style Specification. BackgroundLayer​ A JSON object that defines a background layer according to the Mapbox Style Specification. CircleLayer​ A JSON object that defines a circle layer according to the Mapbox Style Specification. FillExtrusionLayer​ A JSON object that defines a fill-extrusion layer according to the Mapbox Style Specification. FillLayer​ A JSON object that defines a fill layer according to the Mapbox Style Specification. HeatmapLayer​ A JSON object that defines a heatmap layer according to the Mapbox Style Specification. HillshadeLayer​ A JSON object that defines a hillshade layer according to the Mapbox Style Specification. LineLayer​ A JSON object that defines a line layer according to the Mapbox Style Specification. RasterLayer​ A JSON object that defines a raster layer according to the Mapbox Style Specification. SymbolLayer​ A JSON object that defines a symbol layer according to the Mapbox Style Specification. SkyLayer​ A JSON object that defines a sky layer according to the Mapbox Style Specification. GeoJSONSourceRaw​ A JSON object that defines a geojson source according to the Mapbox Style Specification. VideoSourceRaw​ A JSON object that defines a video source according to the Mapbox Style Specification. ImageSourceRaw​ A JSON object that defines a image source according to the Mapbox Style Specification. VectorSourceRaw​ A JSON object that defines a vector source according to the Mapbox Style Specification. RasterSource​ A JSON object that defines a raster source according to the Mapbox Style Specification. RasterDemSource​ A JSON object that defines a raster-dem source according to the Mapbox Style Specification. CanvasSourceRaw​ A JSON object that defines a canvas source type. See CanvasSourceOptions.","s":"Styling","u":"/react-map-gl/docs/api-reference/types","h":"#styling","p":121},{"i":128,"t":"ControlPosition​ One of 'top-right', 'top-left', 'bottom-right' and 'bottom-left'. PaddingOptions​ An object with the following fields: left: number - in pixels. top: number - in pixels. right: number - in pixels. bottom: number - in pixels.","s":"Configurations","u":"/react-map-gl/docs/api-reference/types","h":"#configurations","p":121},{"i":130,"t":"LngLat​ A mapboxgl.LngLat object. LngLatLike​ A LngLat object, an array of two numbers representing longitude and latitude, or an object with lng and lat or lon and lat properties. LngLatBounds​ A mapboxgl.LngLatBounds object. LngLatBoundsLike​ A LngLatBounds object, an array of LngLatLike objects in [sw, ne] order, or an array of numbers in [west, south, east, north] order. Point​ A mapboxgl.Point object. PointLike​ A Point or an array of two numbers representing x and y screen coordinates in pixels. MapGeoJSONFeature​ A GeoJSON feature that also contains the following library-specific fields: layer: Layer source: string sourceLayer: string state: { [key: string]: any } ViewState​ An object with the following fields: longitude: number - The longitude of the map center. latitude: number - The latitude of the map center. zoom: number - The zoom level. pitch: number - The pitch (tilt) of the map, in degrees. bearing: number - The bearing (rotation) of the map, in degrees.","s":"Data Types","u":"/react-map-gl/docs/api-reference/types","h":"#data-types","p":121},{"i":132,"t":"The following are implementations of source types that could be retrieved with Map.getSource (Mapbox | Maplibre). GeoJSONSource​ A source containing GeoJSON. See GeoJSONSource (Mapbox | Maplibre). VideoSource​ A source containing video. See VideoSource (Mapbox | Maplibre). ImageSource​ A source containing image. See ImageSource (Mapbox | Maplibre). CanvasSource​ A source containing the contents of an HTML canvas. See CanvasSource(Mapbox | Maplibre). VectorTileSource​ A source containing vector tiles in Mapbox Vector Tile format. See VectorTileSource (Mapbox | Maplibre).","s":"Sources","u":"/react-map-gl/docs/api-reference/types","h":"#sources","p":121},{"i":134,"t":"MapEvent​ An object with the following fields: type: string - Event type target: Map (Mapbox | Maplibre) originalEvent?: Event MapLayerMouseEvent​ An object with the following fields: type: string target: Map (Mapbox | Maplibre) originalEvent?: MouseEvent point: Point lngLat: LngLat preventDefault: () => void defaultPrevented: boolean features?: MapGeoJSONFeature[] MapWheelEvent​ An object with the following fields: type: string target: Map (Mapbox | Maplibre) originalEvent?: WheelEvent preventDefault: () => void defaultPrevented: boolean MapLayerTouchEvent​ An object with the following fields: type: string target: Map (Mapbox | Maplibre) originalEvent?: TouchEvent point: Point lngLat: LngLat points: Point[] lngLats: LngLat[] preventDefault: () => void defaultPrevented: boolean features?: MapGeoJSONFeature[] ViewStateChangeEvent​ An object with the following fields: type: string - Event type target: Map (Mapbox | Maplibre) viewState: ViewState - the next view state that the camera wants to change to based on user input or transition. MapBoxZoomEvent​ An object with the following fields: type: string target: Map (Mapbox | Maplibre) originalEvent?: MouseEvent boxZoomBounds: LngLatBounds MapStyleDataEvent​ An object with the following fields: type: string target: Map (Mapbox | Maplibre) dataType: 'style' MapSourceDataEvent​ An object with the following fields: type: string target: Map (Mapbox | Maplibre) dataType: 'source' isSourceLoaded: boolean source: string sourceId: string sourceDataType: 'metadata' | 'content' tile: any coord: Coordinate See MapDataEvent. ErrorEvent​ An object with the following fields: type: 'error' target: Map (Mapbox | Maplibre) error: Error GeolocateEvent​ An object with the following fields: type: string target: Map (Mapbox | Maplibre) target: GeolocateControl (Mapbox | Maplibre) GeolocateResultEvent​ An object with the following fields: type: string target: GeolocateControl (Mapbox | Maplibre) coords: GeolocationCoordinates - the current location. timestamp: number - the time at which the location was retrieved. GeolocateErrorEvent​ An object with the following fields: type: string target: GeolocateControl (Mapbox | Maplibre) code: PERMISSION_DENIED | POSITION_UNAVAILABLE | TIMEOUT - see GeolocationPositionError message: string - the details of the error. Specifications note that this is primarily intended for debugging use and not to be shown directly in a user interface. MarkerEvent​ An object with the following fields: type: string target: Marker (Mapbox | Maplibre) MarkerDragEvent​ An object with the following fields: type: string target: Marker (Mapbox | Maplibre) lngLat: LngLat - the new location of the marker PopupEvent​ An object with the following fields: type: string target: Popup (Mapbox | Maplibre)","s":"Events","u":"/react-map-gl/docs/api-reference/types","h":"#events","p":121},{"i":136,"t":"The useControl hook is used to create React wrappers for custom map controls. import MapboxDraw from '@mapbox/mapbox-gl-draw'; import Map, {useControl} from 'react-map-gl'; function DrawControl(props: DrawControlProps) { useControl(() => new MapboxDraw(props), { position: props.position }); return null; } function App() { return ( ); } See a full example here.","s":"useControl","u":"/react-map-gl/docs/api-reference/use-control","h":"","p":135},{"i":138,"t":"useControl( onCreate: ({map: MapRef, mapLib: mapboxgl}) => IControl, options?: { position?: ControlPosition; } ): T useControl( onCreate: ({map: MapRef, mapLib: mapboxgl}) => IControl, onRemove: ({map: MapRef, mapLib: mapboxgl}) => void, options?: { position?: ControlPosition; } ): T useControl( onCreate: ({map: MapRef, mapLib: mapboxgl}) => IControl, onAdd: ({map: MapRef, mapLib: mapboxgl}) => void, onRemove: ({map: MapRef, mapLib: mapboxgl}) => void, options?: { position?: ControlPosition; } ): T The hook creates an IControl instance, adds it to the map when it's available, and removes it upon unmount. Parameters: onCreate: ({map: MapRef, mapLib: mapboxgl}) => IControl - called to create an instance of the control. onAdd: ({map: MapRef, mapLib: mapboxgl}) => void - called when the control has been added to the map. onRemove: ({map: MapRef, mapLib: mapboxgl}) => void - called when the control is about to be removed from the map. options: object position: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' - control position relative to the map Returns: IControl - the control instance from onCreate.","s":"Signature","u":"/react-map-gl/docs/api-reference/use-control","h":"#signature","p":135},{"i":140,"t":"use-control.ts","s":"Source","u":"/react-map-gl/docs/api-reference/use-control","h":"#source","p":135},{"i":142,"t":"The useMap hook allows a custom component to reference the Map that contains it. Mapbox Maplibre import {Map, useMap} from 'react-map-gl'; function Root() { return ( ); } function NavigateButton() { const {current: map} = useMap(); const onClick = () => { map.flyTo({center: [-122.4, 37.8]}); }; return ; } import {Map, useMap} from 'react-map-gl/maplibre'; function Root() { return ( ); } function NavigateButton() { const {current: map} = useMap(); const onClick = () => { map.flyTo({center: [-122.4, 37.8]}); }; return ; } When used with the MapProvider, this hook can also reference maps that are rendered outside of the current component's direct render tree. Mapbox Maplibre import {MapProvider, Map, useMap} from 'react-map-gl'; function Root() { return ( ); } function NavigateButton() { const {myMapA, myMapB} = useMap(); const onClick = () => { myMapA.flyTo({center: [-122.4, 37.8]}); myMapB.flyTo({center: [-74, 40.7]}); }; return ; } import {MapProvider, Map, useMap} from 'react-map-gl/maplibre'; function Root() { return ( ); } function NavigateButton() { const {myMapA, myMapB} = useMap(); const onClick = () => { myMapA.flyTo({center: [-122.4, 37.8]}); myMapB.flyTo({center: [-74, 40.7]}); }; return ; } See a full example here.","s":"useMap","u":"/react-map-gl/docs/api-reference/use-map","h":"","p":141},{"i":144,"t":"useMap(): {current?: MapRef, [id: string]: MapRef} The hook returns an object that contains all mounted maps under the closest MapProvider. The keys are each map's id and the values are the MapRef. If the hook is used inside a decendent of a Map component, the returned object also contains a current field that references the containing map.","s":"Signature","u":"/react-map-gl/docs/api-reference/use-map","h":"#signature","p":141},{"i":146,"t":"use-map.tsx","s":"Source","u":"/react-map-gl/docs/api-reference/use-map","h":"#source","p":141},{"i":148,"t":"Thanks for taking the time to contribute! PRs and bug reports are welcome, and we are actively looking for new maintainers.","s":"Contributing","u":"/react-map-gl/docs/contributing","h":"","p":147},{"i":150,"t":"The master branch is the active development branch. Building react-map-gl locally from the source requires node.js >=8. We use yarn to manage the dependencies. git checkout master yarn bootstrap yarn test Test: $ yarn test Test in Node: $ yarn test node Test in browser (can use Chrome dev tools for debugging): $ yarn test browser","s":"Setting Up Dev Environment","u":"/react-map-gl/docs/contributing","h":"#setting-up-dev-environment","p":147},{"i":152,"t":"Any intended change to the code base must open a pull request and be approved. Generally speaking, all PRs are open against the master branch, unless the feature being affected no longer exists on master.","s":"Pull Requests","u":"/react-map-gl/docs/contributing","h":"#pull-requests","p":147},{"i":154,"t":"Tests yarn test must be successful. New code should be covered by unit tests whenever possible. Documentation If public APIs are added/modified, update component documentation in docs/api-reference. Breaking changes and deprecations must be added to docs/upgrade-guide.md. Noteworthy new features should be added to docs/whats-new.md. Description on GitHub Link to relevant issue. Label with a milestone (latest release or vNext). If public APIs are added/modified, describe the intended behavior. If visual/interaction is affected, consider attaching a screenshot/GIF.","s":"PR Checklist","u":"/react-map-gl/docs/contributing","h":"#pr-checklist","p":147},{"i":156,"t":"react-map-gl follows the Semantic Versioning guidelines. Steps for publishing releases can be found here.","s":"Release","u":"/react-map-gl/docs/contributing","h":"#release","p":147},{"i":158,"t":"vis.gl is part of the Urban Computing Foundation. See the organization's Technical Charter.","s":"Community Governance","u":"/react-map-gl/docs/contributing","h":"#community-governance","p":147},{"i":160,"t":"react-map-gl development is governed by the vis.gl Technical Steering Committee (TSC).","s":"Technical Steering Committee","u":"/react-map-gl/docs/contributing","h":"#technical-steering-committee","p":147},{"i":162,"t":"Xiaoji Chen Xintong Xia Maintainers of react-map-gl have commit access to this GitHub repository, and take part in the decision making process. If you are interested in becoming a maintainer, read the governance guidelines. The vis.gl TSC meets monthly and publishes meeting notes via a mailing list. This mailing list can also be utilized to reach out to the TSC.","s":"Maintainers","u":"/react-map-gl/docs/contributing","h":"#maintainers","p":147},{"i":164,"t":"Please be mindful of and adhere to the Linux Foundation's Code of Conduct when contributing to react-map-gl.","s":"Code of Conduct","u":"/react-map-gl/docs/contributing","h":"#code-of-conduct","p":147},{"i":166,"t":"You may find complete project setups in get-started examples.","s":"Get Started","u":"/react-map-gl/docs/get-started","h":"","p":165},{"i":168,"t":"Using react-map-gl requires node >= 12 and react >= 16.3. Mapbox Maplibre npm install --save react-map-gl mapbox-gl @types/mapbox-gl npm install --save react-map-gl maplibre-gl","s":"Installation","u":"/react-map-gl/docs/get-started","h":"#installation","p":165},{"i":170,"t":"Mapbox Maplibre app.tsx import * as React from 'react'; import Map from 'react-map-gl'; function App() { return ( \" initialViewState={{ longitude: -122.4, latitude: 37.8, zoom: 14 }} style={{width: 600, height: 400}} mapStyle=\"mapbox://styles/mapbox/streets-v9\" /> ); } See about Mapbox tokens for alternatives to providing a Mapbox token. app.tsx import * as React from 'react'; import Map from 'react-map-gl/maplibre'; function App() { return ( ); }","s":"Example","u":"/react-map-gl/docs/get-started","h":"#example","p":165},{"i":172,"t":"The base map library requires its stylesheet be included at all times. The marker, popup and navigation components in react-map-gl also need the stylesheet to work properly. You may add the stylesheet to the head of your page: Mapbox Maplibre index.html Find out your mapbox version by running yarn list mapbox-gl or npm ls mapbox-gl. index.html Find out your maplibre version by running yarn list maplibre-gl or npm ls maplibre-gl. Or embed it in your app by using css-loader with Webpack or postcss with rollup: Mapbox Maplibre app.tsx import 'mapbox-gl/dist/mapbox-gl.css'; app.tsx import 'maplibre-gl/dist/maplibre-gl.css';","s":"Styling","u":"/react-map-gl/docs/get-started","h":"#styling","p":165},{"i":174,"t":"npm install --save react-map-gl my-mapbox-fork Then override the mapLib prop of Map: app.tsx import * as React from 'react'; import Map from 'react-map-gl'; // Include style sheet import 'my-mapbox-fork/path/to/style-sheet.css'; function App() { return ; }","s":"Using with a Compatible Fork","u":"/react-map-gl/docs/get-started","h":"#using-with-a-compatible-fork","p":165},{"i":177,"t":"You can inject data and mapbox native layers using the Source and Layer components: import * as React from 'react'; import Map, {Source, Layer} from 'react-map-gl'; import type {CircleLayer} from 'react-map-gl'; import type {FeatureCollection} from 'geojson'; const geojson: FeatureCollection = { type: 'FeatureCollection', features: [ {type: 'Feature', geometry: {type: 'Point', coordinates: [-122.4, 37.8]}} ] }; const layerStyle: CircleLayer = { id: 'point', type: 'circle', paint: { 'circle-radius': 10, 'circle-color': '#007cbf' } }; function App() { return ( ); } For details about data sources and layer configuration, check out the Mapbox style specification. For dynamically updating data sources and layers, check out the GeoJSON and GeoJSON animation examples.","s":"Native Mapbox Layers","u":"/react-map-gl/docs/get-started/adding-custom-data","h":"#native-mapbox-layers","p":175},{"i":179,"t":"You can implement a custom HTML or SVG overlay on top of the map that redraws whenever the camera changes. By calling map.project() you can adjust the DOM or CSS properties so that the customly-drawn features are always aligned with the map. See a full example here.","s":"Custom Overlays","u":"/react-map-gl/docs/get-started/adding-custom-data","h":"#custom-overlays","p":175},{"i":181,"t":"For more feature rich and performant data visualization overlay use cases, you may consider using other visualization libraries. react-map-gl is part of the vis.gl ecosystem, a suite of high-performance data visualization tools for the Web. deck.gl - WebGL-powered framework for the visualization of large datasets. loaders.gl - loaders for file formats focused on visualization of big data, including point clouds, 3D geometries, images, geospatial formats as well as tabular data. nebula.gl - 3D-enabled GeoJSON editing based on deck.gl and React.","s":"Other vis.gl Libraries","u":"/react-map-gl/docs/get-started/adding-custom-data","h":"#other-visgl-libraries","p":175},{"i":183,"t":"react-map-gl itself is open source and free. It provides a React wrapper for mapbox-gl or derived projects. Depending on which Mapbox GL JS version (or fork) you use, you may need a Mapbox token. You will need a Mapbox token if you use: mapbox-gl@>=2.0.0 and above - 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 - 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 their website. 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. There are several ways to provide a token to your app, as showcased in some of the example folders: Provide a mapboxAccessToken prop to the map component Set the MapboxAccessToken environment variable (or set REACT_APP_MAPBOX_ACCESS_TOKEN if you are using Create React App) Provide it in the URL, e.g ?access_token=TOKEN We recommend using an environment variable to minimize leaking risks. See securing Mapbox token for examples.","s":"About Mapbox Tokens","u":"/react-map-gl/docs/get-started/mapbox-tokens","h":"","p":182},{"i":185,"t":"It is possible to use the map component without the Mapbox service, if you use another tile source (for example, if you host your own map tiles). Note that this is no longer allowed using mapbox-gl v2.0 and above. The options are: Stay on mapbox-gl@1.x. react-map-gl plans to continue supporting this release in the foreseeable future, however, this version will not include any of the latest features of the map renderer, nor get any future updates from Mapbox. Use a community fork of mapbox-gl, for example maplibre-gl. See Get Started for how to configure your project. To use your own map service, you will need a custom Mapbox GL style that points to your own vector tile source, and pass it to Map using the mapStyle prop. This custom style must match the schema of your tile source. Open source tile schemas include: TileZen schema OpenMapTiles schema Some useful resources for creating your own map service: Mapbox Vector Tile Spec Open source tools If you are using a third party service that requires header based authentication, you can do this by defining a function to pass to Map using the transformRequest prop. An example function: const transformRequest = (url, resourceType) => { if (resourceType === 'Tile' && url.match('yourTileSource.com')) { return { url: url, headers: { 'Authorization': 'Bearer ' + yourAuthToken } } } }","s":"Display Maps Without A Mapbox Token","u":"/react-map-gl/docs/get-started/mapbox-tokens","h":"#display-maps-without-a-mapbox-token","p":182},{"i":187,"t":"There are two ways to use a Map: Uncontrolled: The application sets the initial view state (Camera options) when the map is mounted, and the component automatically makes changes to the view states afterwards. This mode works very similarly to the mapbox-gl Map class. Controlled: The application manages the view state, and pass it to the map via props. The map invokes a callback with a new view state during user interaction transition, and the application can decide what to do with it. This mode is the most powerful when an application has other components that need to interact with the map, or implements its own user input and data handling logic.","s":"State Management","u":"/react-map-gl/docs/get-started/state-management","h":"","p":186},{"i":189,"t":"You may clone a full app configuration for this example here. import * as React from 'react'; import Map from 'react-map-gl'; function App() { return ; }","s":"Uncontrolled Map","u":"/react-map-gl/docs/get-started/state-management","h":"#uncontrolled-map","p":186},{"i":191,"t":"You may clone a full app configuration for this example here. import * as React from 'react'; import Map from 'react-map-gl'; function App() { const [viewState, setViewState] = React.useState({ longitude: -100, latitude: 40, zoom: 3.5 }); return setViewState(evt.viewState)} mapStyle=\"mapbox://styles/mapbox/streets-v9\" />; } A real-world application likely uses more complicated state flows: Using map with a state store (Redux) example Using map with SSR (Next.js) example","s":"Controlled Map","u":"/react-map-gl/docs/get-started/state-management","h":"#controlled-map","p":186},{"i":193,"t":"Map offers props that set basic constraints for the camera, e.g. maxBounds, minZoom, maxPitch. If you need more complicated logic to constrain the camera, you may use it as a controlled component. The following example restricts the map center inside a GeoJSON geofence: import * as React from 'react'; import Map from 'react-map-gl'; // npm install @turf/turf import * as turf from '@turf/turf'; // A circle of 5 mile radius of the Empire State Building const GEOFENCE = turf.circle([-74.0122106, 40.7467898], 5, {units: 'miles'}); function App() { const [viewState, setViewState] = React.useState({ longitude: -100, latitude: 40, zoom: 3.5 }); const onMove = React.useCallback(({viewState}) => { const newCenter = [viewState.longitude, viewState.latitude]; // Only update the view state if the center is inside the geofence if (turf.booleanPointInPolygon(newCenter, GEOFENCE)) { setViewState(newCenter); } }, []) return ; }","s":"Custom Camera Constraints","u":"/react-map-gl/docs/get-started/state-management","h":"#custom-camera-constraints","p":186},{"i":196,"t":"Because Mapbox tokens are required for the client application to make requests to Mapbox servers, you have to distribute it with your app. It is not possible to stop a visitor to your site from scraping the token. The practice outlined below can help you protect your token from being abused. Never commit your token in clear text into GitHub or other source control. In your local dev environment, define the token in an environment variable e.g. MapboxAccessTokenDev=... in the command line, or use something like dotenv and put MapboxAccessTokenDev=... in a .env file. Add .env to .gitignore so it's never tracked. If your app is deployed by a continuous integration pipeline, follow its documentation and set a secret environment variable. Create separate tokens for development (often times on http://localhost), public code snippet (Gist, Codepen etc.) and production (deployed to https://mycompany.com). The public token should be rotated regularly. The production token should have strict scope and URL restrictions that only allows it to be used on a domain that you own. Add the following to your bundler config: Webpack Rollup /// webpack.config.js const {DefinePlugin} = require('webpack'); module.exports = { ... plugins: [ new DefinePlugin({ 'process.env.MapboxAccessToken': JSON.stringify(process.env.NODE_ENV == 'production' ? process.env.MapboxAccessTokenProd : process.env.MapboxAccessTokenDev) }) ] }; /// rollup.config.js const replace = require('@rollup/plugin-replace').default; module.exports = { ... plugins: [ replace({ 'process.env.MapboxAccessToken': JSON.stringify(process.env.NODE_ENV == 'production' ? process.env.MapboxAccessTokenProd : process.env.MapboxAccessTokenDev) }) ] }; react-map-gl automatically picks up process.env.MapboxAccessToken or process.env.REACT_APP_MAPBOX_ACCESS_TOKEN if they are defined. Alternatively, you can use your own variable name (e.g. __SUPER_SECRET_TOKEN__) and pass it in manually with mapboxAccessToken={__SUPER_SECRET_TOKEN__}.","s":"Securing Mapbox Token","u":"/react-map-gl/docs/get-started/tips-and-tricks","h":"#securing-mapbox-token","p":194},{"i":198,"t":"In a moderately complex single-page app, as the user navigates through the UI, a map component may unmount and mount again many times during a session. Consider the following layout: /// Example using Tabs from Material UI {items.map(renderMarker)} {items.map(renderRow)}
Every time the user clicks the \"table\" tab, the map is unmounted. When they click the \"map\" tab, the map is mounted again. As of v2.0, mapbox-gl generates a billable event every time a Map object is initialized. It is obviously not ideal to get billed for just collapsing and expanding part of the UI. In this case, it is recommended that you set the reuseMaps prop to true: {items.map(renderMarker)} This bypasses the initialization when a map is removed then added back.","s":"Minimize Cost from Frequent Re-mounting","u":"/react-map-gl/docs/get-started/tips-and-tricks","h":"#minimize-cost-from-frequent-re-mounting","p":194},{"i":200,"t":"If your application uses externally managed camera state, like with Redux, the number of React rerenders may be very high when the user is interacting with the map. Consider the following setup: import {useSelector, useDispatch} from 'react-redux'; import Map, {Marker} from 'react-map-gl'; function MapView() { const viewState = useSelector((s: RootState) => s.viewState); const vehicles = useSelector((s: RootState) => s.vehicles); const dispatch = useDispatch(); const onMove = useCallback(evt => { dispatch({type: 'setViewState', payload: evt.viewState}); }, []); return ( > {vehicles.map(vehicle => ( // vehicle icon ) )} ); } This component is rerendered on every animation frame when the user is dragging the map. If it's trying to render hundreds of markers, the performance lag will become quite visible. One way to improve the performance is useMemo: const markers = useMemo(() => vehicles.map(vehicle => ( // vehicle icon ) ), [vehicles]); return ( > {markers} ); } This prevents React from rerendering the markers unless they have changed. If your application can do without complicated DOM objects and CSS styling, consider switching to a symbol layer. Layers are rendered in WebGL and are much more performant than markers: const vehiclesGeoJSON = useMemo(() => { return { type: 'FeatureCollection', features: vehicles.map(vehicle => turf.point(vehicle.coordinates, vehicle)) }; }, [vehicles]); return ( > );","s":"Performance with Many Markers","u":"/react-map-gl/docs/get-started/tips-and-tricks","h":"#performance-with-many-markers","p":194},{"i":202,"t":"There are some situations where you want to know if a point is currently visible on the map. Checking this is simple and can be done like so: const mapRef = useRef(); const checkIfPositionInViewport = (lat, lng) => { const bounds = mapRef.current.getBounds(); return bounds.contains([lng, lat]); } return ","s":"Finding out if a point is within the current viewport","u":"/react-map-gl/docs/get-started/tips-and-tricks","h":"#finding-out-if-a-point-is-within-the-current-viewport","p":194},{"i":205,"t":"maplibre-gl users no longer need to install mapbox-gl or a placeholder package as dependency. Change your imports to the new endpoint react-map-gl/maplibre. Components imported from here do not require setting the mapLib prop, and use the types defined by maplibre-gl. map-v7.0.tsx import Map from 'react-map-gl'; import maplibregl from 'maplibre-gl'; function App() { return ; } map-v7.1.tsx import Map from 'react-map-gl/maplibre'; // <- mind the updated import function App() { return } If you installed mapbox-gl from a placeholder such as npm:empty-npm-package@^1.0.0 as suggested by the previous version's documentation, it should be removed from your package.json. The @types/mapbox-gl dependency has relaxed its version constraint. If you use mapbox-gl as the base map library, it's recommended to explicitly list @types/mapbox-gl in your package.json with a version matching that of mapbox-gl (v1 or v2). This package is no longer required by the non-mapbox code path, and may be further demoted to an optional peer dependency in a future release. If you use the Map component as a child of the DeckGL component from deck.gl, upgrade deck.gl to >=8.9.18.","s":"Upgrading to v7.1","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v71","p":203},{"i":207,"t":"v7 is a complete rewrite of the library. It is redesigned to be fast, lightweight, fully typed, to behave the same and expose the same APIs as the wrapped map library, and to provide the maximum compatibility with third-party plugins. To take advantages of these new features, you need to make some changes to your code that was previously depending on react-map-gl v5 and v6. If you are using react-map-gl controls (Marker, Popup, NavigationControl etc.) with deck.gl's ContextProvider, do not upgrade to this version. The old approach no longer works with v7. We are moving the support for this use case to a new project that does not depend on mapbox.","s":"Upgrading to v7.0","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v70","p":203},{"i":209,"t":"Add mapbox-gl (or a compatible fork) to your package.json. react-map-gl no longer lists a specific map renderer in its dependencies, so you are free to use it with Mapbox v1, v2 or Maplibre. viewport-mercator-project (an alias of @math.gl/web-mercator) is no longer a dependency. You can still install the library on the side as a utility for viewport-related math, but it's no longer required.","s":"Dependencies","u":"/react-map-gl/docs/upgrade-guide","h":"#dependencies","p":203},{"i":211,"t":"InteractiveMap and StaticMap are removed. Instead, import Map. setRTLTextPlugin is removed. Use the Map component's RTLTextPlugin prop (default enabled). MapController is removed. v7.0 has removed its own implementation of user input handling in favor of the native handlers. If you are using a custom implementation of MapController, check if the native handlers offer options to address your application's needs. MapContext and useMapControl are removed. Check out the new API useMap and useControl. The overlay components (HTMLOverlay, CanvasOverlay and SVGOverlay) are removed. Check out this example for implementing similar controls in your own application. LinearInterpolator and FlyToInterpolator are removed. Use map.easeTo() and map.flyTo() instead, see this example.","s":"Module exports","u":"/react-map-gl/docs/upgrade-guide","h":"#module-exports","p":203},{"i":213,"t":"documentation Renamed props for better consistency with the wrapped library: mapboxApiAccessToken is now mapboxAccessToken mapboxApiUrl is now baseApiUrl preventStyleDiffing (default false) is replaced with styleDiffing (default true) mapStyle should be explicitly specified. The default value has changed from \"mapbox://styles/mapbox/light-v9\" to an empty style. The following props are removed and apps should use style instead: width height visible onViewportChange, onViewStateChange and onInteractionStateChange are removed. You can either use Map as an uncontrolled component with the new initialViewState prop, or if you need to manage the camera state externally (e.g. in Redux), use the onMove callback instead. See examples in state management. transition* props are removed. Use map.easeTo() and map.flyTo() instead, see this example. mapOptions is removed. Almost all of the options for the native Map class are exposed as props. onHover is removed. Use onMouseMove or onMouseEnter. The event argument is changed for all interaction callbacks. See documentation for details. getCursor is removed as part of the effort to get Map behave the same as the native component. To set the cursor, use the cursor prop. Follow this example to change cursor on hover. touchAction and eventRecognizerOptions are removed. Check out the cooperativeGestures prop.","s":"Map","u":"/react-map-gl/docs/upgrade-guide","h":"#map","p":203},{"i":215,"t":"capture* props are removed. *label props are removed. Use Map's locale prop. All map controls' props are now strictly aligned with their mapbox-gl counterparts. In heading this direction, we are able to remove a significant amount of custom code and have the components behave more predictably for developers switching from the native library. If your application is relying on an old feature that is no longer supported, please open a topic on Discussion so we can review on a case-by-case basis.","s":"Other components","u":"/react-map-gl/docs/upgrade-guide","h":"#other-components","p":203},{"i":217,"t":"MapContext is now an official API. The experimental _MapContext export will be removed in a future release. react-virtualized-auto-sizer is no longer a dependency. Inertia has been enabled by default on the map controller. To revert to the behavior in previous versions, set the interaction options: const CONTROLLER_OPTS = { dragPan: {inertia: 0}, dragRotate: {inertia: 0}, touchZoom: {inertia: 0} }; Source and Layer components no longer expose imperative methods via ref as part of the migration to functional components. This is to comply with the pattern recommended by the latest React. If you used to call sourceRef.getSource(), it can be replaced with mapRef().getMap().getSource(sourceId). If you used to call layerRef.getLayer(), it can be replaced with mapRef().getMap().getLayer(layerId).","s":"Upgrading to v5.3/v6.1","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v53v61","p":203},{"i":219,"t":"A valid Mapbox access token is always required. The default value of InteractiveMap's maxPitch prop is changed to 85 from 60. mapbox-gl v2 introduced a breaking change to the build system. Transpiling it may result in a crash in the production build with the message m is not defined. Find solutions in this thread.","s":"Upgrading to v6","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v6","p":203},{"i":221,"t":"onChangeViewport is removed, use onViewportChange instead Immutable.js is no longer a dependency Export experimental.MapControls is removed, use MapController instead InteractiveMap's mapControls prop is renamed to controller Removed support for the deprecated interactive property on the layer styles. Use the interactiveLayerIds prop to specify which layers are clickable.","s":"Upgrading to v4","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v4","p":203},{"i":223,"t":"The latest mapbox-gl release requires stylesheet to be included at all times. See Get Started for information about styling. Immutable.js is no longer a hard dependency and will be removed in the next major release. If you are importing immutable in your application, it is recommended that you explicitly list it in the application's dependencies.","s":"Upgrading to v3.2","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v32","p":203},{"i":225,"t":"v3 is a major upgrade of react-map-gl. While we have tried to gently deprecated any changed or removed features, a few breaking changes could not be avoided.","s":"Upgrading to v3","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v3","p":203},{"i":227,"t":"The Node Version Requirement for building react-map-gl is now >=v6.4.0. Using prebuilt react-map-gl does NOT has this limitation. This is introduced by Mapbox GL JS v0.38.0","s":"Version Requirements","u":"/react-map-gl/docs/upgrade-guide","h":"#version-requirements","p":203},{"i":229,"t":"Two Map Components - v3 now splits the Map component into two React components: StaticMap and InteractiveMap. InteractiveMap is the default export, and designed to be as compatible as possible with the v2 default component. onChangeViewport callback now includes width and height.​ The viewport parameter passed to the onChangeViewport callback now includes width and height. Application code that composed the viewport with width and height may have to be updated. Please double check your render code if you relied on this behavior. // BAD: 'width' and 'height' below will be overridden by what's in the 'viewport' object // GOOD: 'width' and 'height' below will override the values in 'viewport' ","s":"MapGL Component","u":"/react-map-gl/docs/upgrade-guide","h":"#mapgl-component","p":203},{"i":231,"t":"Some Overlays Moved to Examples - Some less frequently used overlays (DraggablePointsOverlay, ChoroplethOverlay, ScatterplotOverlay), have been moved to examples. Most users are now using mapbox styles or deck.gl layers and removing these overlays reduces the size of the react-map-gl library for the majority of users that don't need them. If you still use them, simply copy the overlay source file(s) into your application. Overlays must be Children of the Map - Overlays must now be rendered as children of the main react-map-gl component to automatically sync with the map viewport.","s":"Overlays","u":"/react-map-gl/docs/upgrade-guide","h":"#overlays","p":203},{"i":233,"t":"The fitBounds utility has been moved to the math.gl library. The function can now be called as follows: import WebMercatorViewport from 'viewport-mercator-project'; const viewport = new WebMercatorViewport({width: 600, height: 400}); const bound = viewport.fitBounds( [[-73.9876, 40.7661], [-72.9876, 41.7661]], {padding: 20, offset: [0, -40]} ); // => bounds: instance of WebMercatorViewport // {longitude: -73.48760000000007, latitude: 41.268014439447484, zoom: 7.209231188444142}","s":"fitBounds utility function","u":"/react-map-gl/docs/upgrade-guide","h":"#fitbounds-utility-function","p":203},{"i":235,"t":"We have started to deprecate a few React props. In all the cases below, the old props will still work (you'll get a warning in the console), but they will likely be removed in the next major version of react-map-gl so you should start using the new props as soon as possible. Old Prop New Prop onChangeViewport() onViewportChange() onHoverFeatures() onHover() onClickFeatures() onClick() perspectiveEnabled [default: false] dragRotate [default: true]","s":"Deprecations","u":"/react-map-gl/docs/upgrade-guide","h":"#deprecations","p":203},{"i":237,"t":"v2 is API compatible with v1, however if you are still using v1 of react-map-gl, make sure that you first upgrade: Your node version to v4 or higher Your react version to 15.4 or higher. Background: mapbox-gl 0.31.0 introduced a hard dependency on Node >= v4.","s":"Upgrading to v2","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v2","p":203},{"i":239,"t":"(Upgrading from 0.6.x) Importing Overlays - The map overlay components (HTMLOverlay, CanvasOverlay, SVGOverlay etc) are now named exports. They previously had to be imported via their relative source paths: // v1.0 import MapGL, {SVGOverlay} from 'react-map-gl'; // v0.6 import MapGL from 'react-map-gl'; import SVGOverlay from 'react-map-gl/src/api-reference/svg-overlay';. Map State - The map state reported by onViewportChanged will now contain additional state fields (tracking not only pitch and bearing needed for perspective mode, but also transient information about how the projection is being changed by the user). This information must be passed back to the react-map-gl component in the next render. To simplify and future proof applications, it is recommended to simply save the entire mapState in your app store whenever it changes and then pass it back to the component rather than trying to keep track of individual fields (like longitude, latitude and zoom).","s":"Upgrading to v1","u":"/react-map-gl/docs/upgrade-guide","h":"#upgrading-to-v1","p":203},{"i":242,"t":"Release date: June 30 2023 To better accommodate the API divergence between Mapbox and Maplibre, this version adds a new endpoint react-map-gl/maplibre. The new endpoint exports identical components as react-map-gl, but typed for maplibre-gl instead. After switching to this new endpoint, maplibre-gl users no longer need to install mapbox-gl or a placeholder package as dependency. See upgrade guide for an example. Marker, Popup and GeolocateControl components now expose the native instance via React ref.","s":"react-map-gl v7.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v71","p":240},{"i":244,"t":"Release date: Feb 4, 2022 v7 is a complete rewrite of the library. It addresses many long-standing issues in v5 and v6 limited by legacy architecture decisions. The most notable results of this redesign are: Performance: minimize the overhead of React, offer the same fast and smooth interaction as the native library Lightweight: the ESM build size is reduced from 219k to 57k Predictability: Components behave the same as their mapbox counterparts. Props are mapped 1:1 from the native options wherever appropriate. Almost all imperative APIs (flyTo, fitBounds etc.) can now be called directly without breaking the React binding. Compatibility: first and third-party plugins! Directly use mapbox-gl-draw, mapbox-gl-geocoder, to name a few. TypeScript compliant: the code base is now entirely written in TypeScript, and all types can be imported. Visit the upgrade guide if you are trying to upgrade from v5 and v6.","s":"react-map-gl v7.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v70","p":240},{"i":246,"t":"Release date: Jan 27, 2020","s":"react-map-gl v5.3/v6.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v53v61","p":240},{"i":248,"t":"TypeScript and Flow typings are now published with the library More controller customizations. Smooth easing on wheel scroll, three-finger gesture to change pitch, inertia after pan/pinch, and customizable keyboard navigation speed. See the updated interaction options for details. A new eventRecognizerOptions prop is added for fine-tuning the interaction experience. New component: AttributionControl Promoted to official API: MapContext Resolved React error over attempted state update during render GeolocateControl added supports for showAccuracyCircle All controls now support inline styling with a style prop All components and examples have been rewritten as functional components","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights","p":240},{"i":250,"t":"Release date: Dec 16, 2020","s":"react-map-gl v6.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v60","p":240},{"i":252,"t":"The 6.0 release upgrades its Mapbox GL JS dependency to v2.0. There are important changes to mapbox-gl's license and pricing model in this milestone. If you are NOT using a Mapbox account (e.g. self-hosting map tiles), do NOT upgrade to this version, and consider your options discussed in this document. See upgrade guide for a complete list of breaking changes.","s":"What's Changed","u":"/react-map-gl/docs/whats-new","h":"#whats-changed","p":240},{"i":254,"t":"Release date: Jan 6, 2020","s":"react-map-gl v5.2","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v52","p":240},{"i":256,"t":"New Components: ScaleControl NavigationControl: new label prop GeolocateControl: new label, onGeolocate, auto props New Export: WebMercatorViewport is re-exported from the viewport-mercator-project library for ease of use. It's recommended to import it from react-map-gl instead to avoid future dependency change. New Example: Clusters","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-1","p":240},{"i":258,"t":"Release date: Oct 30, 2019","s":"react-map-gl v5.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v51","p":240},{"i":260,"t":"New Components: Layer and Source have been added to provide better React parity with the Mapbox GL JS API. Viewport transition: transitionDuration can be set to 'auto' when using FlyToInterpolator. New Example: Add an example with drawing library react-map-gl-draw.","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-2","p":240},{"i":262,"t":"Release date: May 31, 2019","s":"react-map-gl v5.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v50","p":240},{"i":264,"t":"The only change between the 5.0 release and the latest 4.1 release is Mapbox GL JS v1.0. By using this version, you opt into Mapbox's new pricing model, which bills per map load instead of map views. 5.0.x and 4.1.x will continue to update in parallel with otherwise identical features until November 2019 when Mapbox moves all users of 0.xx to a new pricing scheme. For more details, see mapbox's changelog and blog post. Alongside Mapbox GL JS's new milestone, we have relaxed the mapbox-gl dependency from locking minor release (~0.53.0) to major release (^1.0.0). This will allow developers to upgrade faster without waiting for a new release from react-map-gl.","s":"What's Changed","u":"/react-map-gl/docs/whats-new","h":"#whats-changed-1","p":240},{"i":266,"t":"Release date: Mar 14, 2019","s":"react-map-gl v4.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v41","p":240},{"i":268,"t":"New Components: FullscreenControl, GeolocateControl have been added to provide better React parity with the Mapbox GL JS API. New callback props InteractiveMap supports more callbacks: onNativeClick","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-3","p":240},{"i":270,"t":"Release date: Nov 5, 2018","s":"react-map-gl v4.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v40","p":240},{"i":272,"t":"Relative dimensions Both InteractiveMap and StaticMap now support CSS strings supplied to map width and height props. New onResize callback is fired when the map resizes. React 16 Upgrade to React 16.3 context and ref patterns Babel 7 Upgrade build system to Babel 7, better support for tree-shaking Style diffing Now use Mapbox's native style diffing. Immutable is no longer required. Draggable Markers Marker component now supports a new prop draggable, along with callbacks onDragStart, onDrag, and onDragEnd. 3d Popups Popup component now supports a new prop sortByDepth to enable proper occlusion when multiple popups are used in a tilted map. Interaction states onViewportChange is now called with richer descriptors of the user interaction, including isPanning, isZooming and isRotating. Interactive layers Dropped the requirement for the deprecated interactive property on the layer styles. Use the interactiveLayerIds prop to specify which layers are clickable. New callback props InteractiveMap supports more callbacks: onDblClick onMouseDown onMouseMove onMouseUp onTouchStart onTouchMove onTouchEnd onMouseEnter onMouseLeave onWheel onMouseOut See upgrade guide for breaking changes.","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-4","p":240},{"i":274,"t":"Release date: July, 2018","s":"react-map-gl v3.3","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v33","p":240},{"i":276,"t":"New viewState Property: Makes it possible to specify all map state properties (longitude, latitude, zoom, bearing and pitch) as a single property. New onViewStateChange callback: An alternative callback that matches the new viewState prop.","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-5","p":240},{"i":278,"t":"Realease date: January, 2018","s":"react-map-gl v3.2","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v32","p":240},{"i":280,"t":"Viewport transition: feature equivalent to Mapbox's flyTo and easeTo; smooth transition when using keyboard navigation or the NavigationControl. Better parity of Mapbox interaction: navigation using keyboard and the navigation control matches Mapbox behavior, including smooth transition when zooming and panning. Support for Map Reuse (experimental): A new property reuseMaps is provided for applications that create and destroy maps, to help work around a mapbox-gl resource leak issue that can lead to a browser crash in certain situations. mapbox-gl 0.42.2 New props of the InteractiveMap component: Map creation: transformRequest, reuseMaps Interaction: touchZoom, touchRotate Transition: transitionDuration, transitionInterpolator, transitionEasing, transitionInterruption, onTransitionStart, onTransitionInterrupt, onTransitionEnd","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-6","p":240},{"i":282,"t":"Release date: October 19, 2017","s":"react-map-gl v3.1","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v31","p":240},{"i":284,"t":"Event handling Support right mouse drag to rotate Support keyboard navigation Allow controls and overlays to block map interactions React 16 - react-map-gl is now being tested with React 16, but the React peer dependency requirement is unchanged at >=15.4.x. mapbox-gl v0.40.1 No Token warning: react-map-gl now renders an HTML message if no mapbox token is supplied.","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-7","p":240},{"i":286,"t":"Release date: July 27th, 2017","s":"react-map-gl v3.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v30","p":240},{"i":288,"t":"Latest Mapbox GL JS: Bumps Mapbox GL JS to 0.38. Multi-Touch Support: Full support for multi-touch gestures such as pinch-to-zoom and rotate. New Components: The MapGL component has been split into StaticMap and InteractiveMap (the default). Also, Popup, Marker, NavigationControl have been added to provide better React parity with the Mapbox GL JS API. Improved Overlay Components: Supplying viewport props (width height zoom longitude and latitude) are no longer required if you render SVGOverlay, CanvasOverlay or HTMLOverlay as a child of the map. Perspective mode is now supported in all overlays. New Props: maxPitch, minPitch, dragPan, doubleClickZoom, touchZoomRotate, scrollZoom are now provided to allow granular control of map interactivity. Documentation: Significantly expanded and linked with our other geospatial frameworks. Examples: New stand-alone examples to get you started instantly with the new features. Event Handling: New event handling architecture that enables full customization of event handling (experimental).","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-8","p":240},{"i":290,"t":"InteractiveMap (New, MapGL replacement)​ This is a wrapper on top of StaticMap. It takes all the props of StaticMap and additional ones such as onViewportChange, scrollZoom, dragRotate, etc. to control interactivity on the map. See Source Code for more information. StaticMap (New)​ This is the React wrapper around Mapbox GL JS and takes in viewport properties such as width, height, latitude, longitude. Style diffing and updating logic also live here. See Source Code for more information. Overlays​ Three overlays (ScatterplotOverlay, DraggablePointsOverlay, ChoroplethOverlay), have been moved out of the library and are now only provided as examples.","s":"Components","u":"/react-map-gl/docs/whats-new","h":"#components","p":240},{"i":292,"t":"Property Names - some prop names have been modernized, the old ones will still work for now with a warning. Internal Properties such as isHovering, isDragging, startDragLngLat have been removed. These were never meant to be useful publicly and have caused confusions in the past.","s":"Property Changes","u":"/react-map-gl/docs/whats-new","h":"#property-changes","p":240},{"i":294,"t":"fitBounds: fitBounds has been moved to another repository and has been rewritten to provide a more logical interface. For more information, see the Upgrade Guide.","s":"Utilities","u":"/react-map-gl/docs/whats-new","h":"#utilities","p":240},{"i":296,"t":"Date: Jan 17, 2017","s":"react-map-gl v2.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v20","p":240},{"i":298,"t":"Latest mapbox-gl: Bump mapbox-gl to v0.31.0 new maxZoom prop - Add maxZoom prop and defaults to 20 New onLoad prop - Add onLoad event handler new onClick prop - Add onClick prop handler (#140)","s":"Highlights","u":"/react-map-gl/docs/whats-new","h":"#highlights-9","p":240},{"i":300,"t":"Perspective Mode - Now supports bearing and pitch properties, per mapbox-gl api documentation. These props default to 0 which means that maps will still be rendered in flat/ortographic mode when they are not provided Support for ES6 imports - The map overlay components (HTMLOverlay, CanvasOverlay, SVGOverlay etc) previously had to be imported via their relative source paths can now be imported directly using `import {SVGOverlay} from 'react-map-gl'.","s":"react-map-gl v1.0","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v10","p":240},{"i":302,"t":"Initial public version","s":"react-map-gl v0.6","u":"/react-map-gl/docs/whats-new","h":"#react-map-gl-v06","p":240}],"index":{"version":"2.3.9","fields":["t"],"fieldVectors":[["t/2",[0,3.436,1,3.436,2,2.462,3,3.469,4,1.244,5,0.752,6,1.435,7,3.053,8,0.691,9,1.548,10,4.186,11,2.337,12,2.258,13,3.053,14,1.065,15,4.624,16,4.871,17,3.898,18,1.447,19,3.327,20,2.925,21,2.801,22,4.179,23,2.452,24,2.801,25,6.131,26,2.337,27,2.136,28,2.337,29,3.053,30,1.514,31,2.613,32,1.91,33,2.337,34,3.436,35,3.898,36,2.136,37,1.514,38,2.23,39,3.053,40,2.801,41,2.053,42,3.436,43,2.337,44,3.062,45,2.337,46,2.613,47,1.978,48,2.053,49,2.613,50,2.462,51,1.256,52,2.053,53,2.801,54,2.801,55,1.229,56,2.23,57,2.337]],["t/4",[4,1.256,5,0.827,6,1.165,8,1.456,9,1.12,18,0.849,23,1.204,38,1.953,44,2.77,47,2.669,48,1.798,49,2.289,50,2.157,58,1.673,59,3.01,60,3.779,61,3.01,62,1.871,63,2.454,64,2.289,65,1.567,66,2.454,67,3.01,68,2.454,69,3.01,70,4.123,71,2.674,72,1.477,73,4.61,74,3.01,75,3.255,76,4.636,77,3.01,78,1.436,79,1.953,80,3.01,81,2.454,82,1.1,83,2.454,84,3.01,85,2.674,86,3.01,87,2.289,88,1.521,89,4.636,90,1.953,91,3.01,92,2.152,93,2.289,94,4.12,95,1.477,96,1.477,97,1.436,98,2.674,99,3.515,100,2.289,101,2.454,102,2.157,103,1.361,104,1.871,105,2.454,106,3.01,107,1.732,108,1.673,109,2.674,110,2.289,111,2.289,112,3.01,113,3.01,114,2.949,115,3.779,116,3.01,117,2.674,118,2.289,119,1.798,120,3.01,121,4.636,122,2.674,123,2.454,124,3.01,125,3.01,126,3.01,127,2.454,128,2.454,129,2.674,130,2.454,131,2.674,132,3.01,133,1.798,134,2.674,135,2.289,136,1.15,137,1.953,138,2.454,139,2.674,140,0.915,141,1.953,142,2.454,143,2.674,144,1.521,145,3.01,146,1.798]],["t/6",[4,1.115,5,0.726,6,1.034,9,0.769,10,2.511,12,1.922,33,2.968,36,2.712,73,3.557,75,2.511,78,2.906,82,1.595,114,2.025,137,3.953,139,3.877,140,2.132,146,2.607,147,3.877,148,3.557,149,2.712,150,3.318,151,2.968,152,3.877,153,4.363,154,3.557,155,4.363,156,4.363,157,4.555,158,3.877,159,3.773,160,3.877,161,3.348,162,4.143,163,2.425,164,4.363,165,2.345,166,3.877,167,4.363,168,3.318,169,4.363,170,3.557,171,3.557,172,2.204,173,3.877,174,2.607,175,3.557,176,3.877,177,4.363,178,3.127,179,4.363,180,4.363,181,3.877,182,3.318,183,3.318,184,3.318,185,3.127,186,3.557,187,3.877]],["t/8",[4,1.517,5,0.876,6,0.68,8,0.804,9,1.011,14,1.776,20,1.91,130,4.672,188,2.225,189,1.81,190,2.392,191,6.306,192,1.72,193,1.807,194,2.221,195,1.966,196,2.008,197,1.926,198,2.304,199,1.764,200,2.66,201,2.051,202,3.081,203,2.142,204,3.185,205,2.142,206,3.299,207,1.91,208,1.81,209,5.732,210,1.966,211,5.093,212,5.732,213,5.732,214,1.764,215,2.225]],["t/11",[103,3.232,216,2.931,217,4.445,218,3.843,219,4.115,220,4.64,221,5.123]],["t/13",[5,0.571,8,1.11,9,0.974,14,1.711,18,1.011,37,2.433,58,3.069,65,2.876,75,3.178,108,3.966,136,2.11,191,4.501,192,2.373,193,1.649,210,1.894,222,2.433,223,3.178,224,2.709,225,2.433,226,5.522,227,5.522,228,4.501,229,2.496,230,2.876,231,4.395,232,3.966,233,4.916,234,3.957,235,2.968]],["t/15",[211,6.751,236,5.167]],["t/17",[4,1.553,5,0.895,6,0.736,8,0.872,9,1.07,14,1.88,20,2.069,188,2.41,189,1.961,190,2.591,192,1.864,193,1.806,194,2.302,195,2.081,196,2.125,197,2.038,198,2.496,199,1.911,200,2.816,201,2.17,202,3.261,203,2.267,204,3.371,205,2.267,206,3.492,207,2.069,208,1.961,214,1.911,215,2.41,237,4.763]],["t/20",[103,3.232,216,2.931,217,4.445,218,3.843,219,4.115,220,4.64,221,5.123]],["t/22",[5,0.474,78,3.436,90,4.675,95,2.249,97,3.436,114,2.925,133,2.738,161,3.88,193,1.604,197,2.42,230,4.04,237,3.765,238,4.072,239,6.185,240,5.6,241,5.532,242,6.401,243,5.138,244,4.072,245,4.072,246,3.284,247,4.583,248,3.736,249,4.583,250,5.6,251,2.408,252,3.485,253,4.072,254,4.583,255,3.736]],["t/24",[5,0.558,8,1.085,9,0.952,14,1.673,18,0.988,37,2.379,58,3,65,2.812,75,3.108,108,3.909,136,2.063,192,2.32,193,1.635,210,1.852,222,2.379,223,3.108,224,2.649,225,2.379,228,4.401,229,2.441,230,2.812,231,4.347,232,3.909,233,4.863,234,3.869,235,2.902,237,3.225,256,5.399,257,4.797,258,5.399,259,4.797,260,5.399]],["t/26",[4,1.549,5,0.858,6,1.087,9,0.954,14,1.677,18,0.677,43,3.681,79,2.4,119,2.209,136,2.068,151,2.515,157,2.4,159,1.988,161,1.764,163,2.055,165,1.988,193,1.816,194,2.521,195,1.856,196,1.896,197,1.818,199,1.629,214,1.629,237,4.479,252,4.115,261,2.299,262,4.115,263,6.26,264,2.384,265,2.65,266,2.512,267,5.412,268,3.698,269,4.809,270,5.412,271,5.412,272,5.412,273,2.812,274,3.698]],["t/28",[236,5.167,242,6.751]],["t/30",[4,1.553,5,0.895,6,0.736,8,0.872,9,1.07,14,1.88,20,2.069,188,2.41,189,1.961,190,2.591,192,1.864,193,1.806,194,2.302,195,2.081,196,2.125,197,2.038,198,2.496,199,1.911,200,2.816,201,2.17,202,3.261,203,2.267,204,3.371,205,2.267,206,3.492,207,2.069,208,1.961,214,1.911,215,2.41,275,7.085]],["t/33",[103,3.232,216,2.931,217,4.445,218,3.843,219,4.115,220,4.64,221,5.123]],["t/35",[5,0.727,8,1.085,18,0.988,58,3,75,3.108,103,2.441,108,4.347,136,2.063,193,1.543,210,2.413,222,2.379,223,3.108,224,2.649,230,2.812,231,4.347,232,3.909,233,4.373,234,3.869,235,2.902,276,5.399,277,2.728,278,3.108,279,4.401,280,5.348,281,7.033,282,4.373,283,5.348]],["t/37",[236,5.167,284,7.597]],["t/39",[4,1.486,5,0.87,6,0.818,8,0.636,9,1.029,14,0.981,18,0.58,20,1.511,23,2.609,47,1.823,192,2.071,193,1.824,194,2.247,195,1.653,196,2.044,197,1.62,198,1.823,199,1.395,200,2.238,201,1.725,203,1.801,205,1.801,207,1.511,208,1.432,214,2.124,215,1.76,264,2.874,266,2.238,278,2.775,285,1.823,286,3.568,287,5.797,288,6.523,289,4.82,290,5.797,291,4.82,292,4.82,293,4.82,294,3.93,295,3.665,296,4.82,297,2.88,298,3.128,299,3.128]],["t/41",[8,1.548,9,1.099,97,2.972,140,2.341,216,2.183,251,2.381,286,3.576,300,3.057,301,4.738,302,3.587,303,5.537,304,5.858,305,4.738,306,4.465,307,3.874,308,5.537,309,5.537,310,5.08,311,5.08]],["t/43",[18,1.027,30,2.47,90,3.639,140,2.19,142,4.571,210,1.923,224,2.751,229,2.535,251,2.142,264,3.175,277,3.641,278,4.149,280,4.263,286,3.903,300,2.751,312,4.571,313,4.982,314,4.263,315,4.571,316,3.814,317,3.486,318,4.571,319,4.982,320,4.018,321,4.982,322,4.982,323,4.263,324,4.982,325,4.571]],["t/45",[5,0.489,8,0.951,9,0.834,18,1.341,23,3.144,28,3.219,30,2.085,111,3.598,117,4.205,140,1.957,146,2.827,216,2.257,224,2.322,230,2.464,235,2.544,251,1.808,264,2.085,277,3.254,278,3.708,286,4.102,302,2.724,315,3.858,316,4.382,326,6.442,327,4.205,328,4.732,329,4.205,330,4.732,331,4.732,332,3.858,333,3.858,334,3.219,335,2.942,336,6.442,337,4.732,338,3.598,339,4.205,340,4.732,341,4.205,342,3.391,343,4.732]],["t/47",[344,7.677]],["t/49",[4,1.559,5,0.88,6,0.985,8,0.818,9,1.023,14,1.797,20,1.942,188,2.262,189,1.84,190,2.432,192,1.749,193,1.811,194,2.238,195,1.99,196,2.032,197,1.949,198,2.343,199,1.793,200,2.692,201,2.075,203,2.167,205,2.167,207,1.942,208,1.84,210,1.396,214,1.793,215,2.262,297,3.465,298,3.764,299,3.764,345,2.642,346,4.157,347,5.154,348,4.728,349,3.465,350,4.728]],["t/51",[5,0.877,8,1.153,9,1.012,12,2.529,14,1.779,37,2.529,140,2.223,173,6.501,174,3.429,189,3.307,190,3.429,192,2.466,193,1.132,210,1.969,225,2.529,351,5.74,352,4.548,353,4.113,354,4.679,355,5.74,356,5.74,357,5.74,358,4.364,359,5.74,360,4.364,361,3.429]],["t/53",[5,0.792,103,3.464,202,4.119,210,2.628,216,2.164,217,3.841,218,3.321,230,3.217,235,3.321,264,2.722,277,3.871,278,4.411,349,3.691,362,4.01,363,6.247,364,4.427,365,4.01]],["t/55",[5,0.596,9,0.836,41,1.852,48,1.852,55,1.109,56,2.012,62,1.927,65,2.469,82,1.133,92,2.201,97,2.262,133,1.852,137,2.012,189,1.401,193,1.136,205,1.158,210,2.213,216,2.883,222,2.842,251,1.184,277,2.396,282,1.927,285,1.784,300,2.327,301,4.905,302,3.713,305,2.357,307,1.927,314,2.357,334,2.108,365,2.012,366,6.178,367,3.866,368,2.826,369,5.732,370,3.398,371,3.1,372,2.527,373,2.754,374,4.214,375,1.478,376,2.754,377,2.754,378,4.22,379,4.379,380,2.754,381,5.759,382,3.1,383,4.742,384,3.1,385,3.1,386,3.1,387,3.1,388,4.742,389,3.1,390,3.1,391,3.1,392,3.1,393,3.1,394,3.1,395,3.1,396,2.221,397,2.108,398,2.527,399,3.1,400,2.527,401,3.1,402,3.1,403,3.398,404,3.315,405,2.754,406,2.527,407,2.754,408,2.221,409,3.1,410,2.754,411,2.012,412,2.527,413,3.1,414,6.178]],["t/57",[5,0.898,8,0.519,18,0.753,55,0.924,70,1.676,82,0.944,114,1.909,140,0.785,172,2.077,175,2.105,200,1.909,201,2.432,203,2.539,205,2.765,210,2.828,219,1.486,225,1.812,248,2.105,257,2.295,283,1.964,375,1.962,397,3.974,410,2.295,415,5.464,416,1.757,417,2.949,418,1.543,419,2.583,420,2.295,421,1.851,422,2.105,423,4.443,424,3.654,425,3.974,426,2.583,427,1.964,428,2.583,429,5.307,430,2.583,431,2.583,432,3.654,433,5.819,434,4.443,435,4.225,436,3.127,437,3.792,438,2.556,439,4.112,440,3.352,441,2.583,442,2.295,443,4.553,444,2.583,445,2.295,446,2.295,447,3.654,448,1.757,449,2.105,450,1.435,451,2.295,452,3.654,453,4.112,454,2.583,455,2.947,456,2.295,457,1.964,458,2.295,459,2.295]],["t/59",[5,0.274,9,1.269,14,2.314,32,3.818,41,4.46,55,2.311,96,3.532,103,1.197,174,3.54,193,1.612,205,2.214,210,2.637,216,0.928,222,1.848,223,1.524,225,3.289,277,1.338,286,1.229,333,2.159,375,3.561,403,5.35,404,4.939,417,2.415,418,1.582,425,1.801,435,1.646,438,2.608,460,2.648,461,2.353,462,2.648,463,2.353,464,2.353,465,3.006,466,2.648,467,2.014,468,3.543,469,2.648,470,2.159,471,2.159,472,5.926,473,2.648,474,3.19,475,2.648,476,2.648,477,2.159,478,2.353,479,2.648,480,2.648,481,2.648,482,2.353,483,2.353,484,2.648,485,2.014,486,2.648,487,2.353,488,4.195,489,2.648,490,4.195,491,3.728,492,1.898,493,2.159,494,1.898,495,2.679,496,1.801,497,2.648,498,2.648,499,2.648,500,1.719,501,2.159]],["t/61",[5,0.786,8,0.513,18,0.468,23,0.585,32,4.659,43,2.043,44,0.471,48,3.16,52,0.874,55,0.914,58,0.438,60,0.643,64,0.6,65,1.331,70,0.512,72,1.254,82,0.288,90,0.512,92,0.679,95,1.474,96,2.271,97,1.219,99,2.715,102,1.466,103,2.92,104,2.115,114,1.186,136,0.976,137,1.328,140,0.776,144,1.034,157,1.658,161,3.757,168,1.943,178,1.048,193,1.569,201,0.282,203,0.295,205,1.819,210,0.271,216,0.276,230,0.411,231,0.438,239,0.6,241,5.357,243,0.643,244,0.701,246,0.565,251,1.944,280,0.6,283,0.6,286,2.362,320,0.565,329,2.669,332,1.193,342,0.565,363,4.464,365,0.512,368,0.387,416,2.043,417,3.78,418,0.471,423,0.6,434,1.556,435,1.588,436,1.556,437,1.658,438,1.272,452,0.701,461,2.27,465,0.565,468,1.392,471,1.668,485,3.869,487,1.3,493,3.774,494,1.048,495,2.869,502,0.701,503,2.449,504,0.701,505,0.701,506,0.701,507,0.6,508,0.789,509,2.438,510,3.758,511,0.789,512,0.6,513,0.701,514,0.789,515,0.789,516,0.701,517,2.046,518,0.789,519,3.598,520,0.789,521,0.6,522,0.949,523,0.789,524,2.449,525,0.701,526,0.701,527,0.789,528,0.701,529,4.113,530,2.909,531,4.367,532,4.367,533,4.113,534,2.555,535,3.774,536,3.004,537,4.113,538,0.701,539,0.838,540,0.789,541,0.6,542,1.3,543,0.909,544,0.643,545,1.463,546,1.668,547,0.643,548,0.643,549,0.701,550,1.463,551,0.701,552,0.6,553,0.701,554,0.789,555,0.789,556,0.789,557,0.6,558,0.701,559,0.789,560,0.701,561,0.701,562,0.701,563,0.701,564,2.27,565,0.789,566,0.701,567,0.789,568,0.701,569,0.789,570,0.789,571,0.789,572,0.789,573,5.018,574,2.555,575,4.148,576,0.6,577,3.004,578,2.284,579,0.789,580,2.555,581,2.555,582,2.083,583,2.555,584,2.083,585,0.789,586,0.643,587,0.643,588,0.643,589,0.789,590,0.789,591,0.789,592,0.789,593,0.789,594,0.789,595,0.789,596,0.789,597,0.789,598,0.789,599,0.789,600,0.789,601,0.789,602,1.3,603,0.789,604,0.789,605,0.789,606,0.789,607,0.701,608,0.6,609,0.789,610,0.789,611,1.3,612,1.3,613,1.818,614,1.392,615,0.789,616,0.789,617,0.471,618,0.789]],["t/63",[3,0.806,4,1.272,5,0.881,6,1.239,8,1.016,9,0.973,12,1.673,14,0.524,18,0.695,20,1.38,28,1.968,29,1.501,31,1.285,32,0.939,35,1.285,37,0.744,41,1.009,43,3.059,44,1.009,45,1.149,46,1.285,51,1.058,55,0.604,64,1.285,65,0.88,68,1.377,72,0.829,75,1.666,78,0.806,82,0.618,88,0.853,101,1.377,137,1.878,140,1.367,146,1.729,151,3.059,160,1.501,161,0.806,163,3.066,172,1.918,174,1.009,182,2.201,185,1.211,189,0.764,192,1.243,193,1.439,194,2.111,195,1.302,196,1.33,197,1.275,199,0.744,200,0.784,210,2.229,214,0.744,216,0.592,223,0.972,224,1.42,225,1.673,229,0.764,231,0.939,232,0.939,265,1.211,277,2.272,285,0.972,300,1.863,306,1.211,312,1.377,316,1.149,334,2.582,339,1.501,346,1.211,352,1.05,375,0.806,398,1.377,403,1.211,404,1.666,408,1.211,415,2.074,417,1.666,420,3.373,425,1.149,429,2.796,455,1.211,491,1.501,506,1.501,507,1.285,521,1.285,522,1.878,539,0.692,541,1.285,543,1.799,619,1.501,620,1.377,621,1.285,622,1.689,623,1.501,624,1.501,625,2.894,626,1.689,627,1.689,628,4.498,629,1.689,630,1.689,631,1.377,632,1.377,633,1.689,634,1.501,635,2.894,636,1.689,637,1.689,638,1.689,639,1.689,640,1.377,641,1.501,642,2.894,643,1.689,644,1.689,645,1.285,646,1.211,647,1.501,648,1.501,649,2.359,650,2.359,651,1.501,652,1.501,653,2.894,654,1.501,655,1.689,656,1.689,657,1.211,658,1.285,659,2.572,660,1.501,661,1.689,662,1.689,663,1.501,664,1.501,665,1.689,666,1.689,667,1.501,668,1.689,669,1.689,670,3.796,671,1.689,672,1.689,673,1.377,674,1.689,675,1.689,676,1.689,677,1.501,678,1.689,679,1.689,680,1.689,681,1.377,682,1.501,683,1.377,684,1.377,685,1.377,686,2.572,687,2.894,688,1.377,689,1.501,690,1.211,691,1.689,692,1.501,693,2.894,694,1.689,695,1.689,696,1.689,697,1.501,698,1.501,699,1.501,700,1.689,701,1.285,702,1.501,703,1.689,704,1.377,705,1.689,706,1.689,707,0.908,708,1.689]],["t/65",[4,1.548,5,0.834,6,0.76,8,0.579,9,0.969,14,1.704,19,1.868,79,1.868,81,3.651,82,1.052,97,1.373,114,1.336,119,1.72,140,1.361,146,1.72,151,1.958,157,3.568,159,1.548,161,2.137,162,1.958,163,1.6,165,2.408,166,3.98,170,2.347,186,2.347,187,2.558,193,1.853,194,2.334,195,1.536,196,1.569,197,1.847,199,1.973,214,1.973,216,1.008,251,1.1,261,2.785,262,3.406,264,1.973,266,2.88,370,2.063,375,2.137,652,2.558,709,2.063,710,5.512,711,4.817,712,3.98,713,4.479,714,4.479,715,3.98,716,4.479,717,2.063,718,2.879,719,1.868,720,2.558,721,2.879,722,4.479,723,2.879,724,2.879,725,1.868,726,2.879]],["t/67",[727,6.259]],["t/69",[4,0.96,5,0.88,6,0.89,8,1.387,48,3.133,53,4.274,55,1.876,72,2.573,92,3.203,102,3.758,144,3.486,162,3.566,188,2.914,193,1.784,194,1.593,195,1.799,197,1.762,199,2.31,338,3.987,614,3.566,698,4.659,709,3.758,728,5.243,729,5.243,730,3.758,731,6.287,732,4.659,733,5.243,734,5.243]],["t/71",[18,1.391,727,6.193]],["t/73",[4,1.481,5,0.858,6,0.628,8,1.088,9,0.954,14,1.677,18,0.677,20,1.764,92,1.717,188,2.055,189,1.672,190,2.209,192,1.589,193,1.784,194,2.14,195,1.856,196,1.896,197,1.818,198,2.129,199,1.629,200,2.512,201,2.521,202,3.787,203,2.022,204,3.008,205,2.022,206,3.115,207,1.764,208,1.672,210,1.268,214,1.629,215,2.055,224,2.655,342,2.65,417,2.129,492,2.65,701,4.115,735,4.549,736,4.809,737,4.809,738,5.412,739,5.412]],["t/76",[5,0.841,9,0.563,14,0.99,30,2.138,51,1.168,103,1.444,150,4.983,163,2.697,172,2.451,174,2.899,192,1.373,193,1.464,201,1.736,203,1.813,210,2.417,216,1.7,217,1.986,218,1.717,219,1.839,220,3.149,230,2.527,232,1.775,235,3.523,364,5.317,367,2.604,375,1.524,397,2.173,403,2.289,404,1.839,408,2.289,425,3.991,427,3.69,429,3.648,433,2.289,437,2.073,438,4.793,440,2.604,442,4.312,445,2.839,448,2.173,450,4.285,468,2.173,492,3.477,496,2.173,735,4.145,740,2.604,741,3.956,742,3.956,743,3.195,744,2.839,745,2.839,746,2.429,747,3.195,748,2.429,749,5.868,750,3.413,751,2.839,752,2.839,753,3.195,754,5.868,755,2.604,756,3.195,757,2.839]],["t/78",[52,3.324,161,3.999,193,1.654,239,6.375,241,5.702,332,4.536,404,4.568,465,3.987,468,5.398,503,4.536,552,4.231,586,4.536,587,4.536,588,4.536,735,2.991,740,6.47,758,7.052]],["t/80",[8,1.297,9,1.138,14,2,18,1.181,37,2.843,58,3.586,65,3.36,75,3.714,87,4.906,192,2.772,193,1.273,222,2.843,223,3.714,224,3.166,225,2.843,295,4.906,735,3.468,741,5.26,759,6.452]],["t/82",[4,1.477,5,0.814,6,0.978,9,0.836,14,1.47,18,0.567,79,2.012,119,1.852,151,2.108,157,2.012,159,1.666,161,1.478,163,1.723,165,1.666,193,1.866,194,2.391,195,1.627,196,1.661,197,2.167,199,1.366,201,1.697,214,1.366,261,1.927,262,3.606,265,2.221,266,3.403,273,2.357,297,2.833,406,3.866,557,3.606,710,5.732,735,3.737,750,2.469,760,5.732,761,4.742,762,3.1,763,3.1,764,4.742,765,4.742,766,4.214,767,4.742,768,4.742,769,4.742,770,4.742,771,4.742,772,3.1,773,3.1]],["t/84",[774,7.677]],["t/86",[4,1.553,5,0.895,6,0.736,8,0.872,9,1.07,14,1.88,20,2.069,188,2.41,189,1.961,190,2.591,192,1.864,193,1.806,194,2.302,195,2.081,196,2.125,197,2.038,198,2.496,199,1.911,200,2.816,201,2.17,202,3.261,203,2.267,204,3.371,205,2.267,206,3.492,207,2.069,208,1.961,214,1.911,215,2.41,775,5.423]],["t/89",[103,3.232,216,2.931,217,4.445,218,3.843,219,4.115,220,4.64,221,5.123]],["t/91",[5,0.567,8,1.101,9,0.966,14,1.698,18,1.003,37,2.414,58,3.046,65,2.854,75,3.154,108,4.379,136,2.094,192,2.355,193,1.644,210,1.88,222,2.414,223,3.154,224,2.689,225,2.414,228,4.468,229,2.477,230,2.854,231,4.379,232,3.947,233,4.415,234,3.927,235,2.946,775,3.728,776,5.48,777,5.48,778,5.48]],["t/93",[236,5.167,779,5.167]],["t/95",[4,1.531,5,0.847,6,0.6,8,0.711,9,0.923,14,1.623,20,1.687,188,1.965,189,1.599,190,2.113,192,1.519,193,1.813,194,2.342,195,1.796,196,1.834,197,1.759,198,2.035,199,1.558,200,2.431,201,2.467,202,3.706,203,1.957,204,2.91,205,1.957,206,3.014,207,1.687,208,1.599,214,1.558,215,1.965,266,2.431,736,4.653,737,4.653,750,4.154,780,5.237,781,6.894,782,5.237,783,5.237,784,4.653,785,5.237,786,3.128]],["t/98",[5,0.364,90,2.284,103,2.811,108,3.456,165,1.892,172,3.142,192,1.512,193,1.701,201,1.259,203,1.315,210,1.79,216,1.828,217,2.188,218,3.343,219,2.026,220,3.386,222,1.55,230,2.717,231,3.456,232,3.822,233,4.276,277,3.475,302,2.026,308,3.127,316,2.394,362,2.284,367,2.869,375,1.679,397,2.394,417,3.579,425,2.394,427,4.728,429,3.244,448,2.394,455,2.522,492,3.739,493,2.869,530,2.102,688,2.869,741,5.069,742,5.988,744,3.127,745,4.637,746,2.676,750,3.238,752,3.127,787,2.284,788,3.127,789,2.522,790,3.519,791,3.519,792,3.519,793,3.519,794,3.519,795,2.522,796,2.188,797,3.519,798,6.878,799,2.869,800,3.127,801,3.127,802,3.519]],["t/100",[15,4.238,95,3.057,102,4.465,161,3.675,193,1.52,239,5.858,241,5.24,404,3.587,465,4.465,557,4.738,750,4.012,784,5.537,803,6.231,804,6.845,805,7.703,806,5.537]],["t/102",[8,1.297,9,1.138,14,2,18,1.181,37,2.843,58,3.586,65,3.36,75,3.714,192,2.772,193,1.273,222,2.843,223,3.714,224,3.166,225,2.843,750,3.36,806,5.733,807,6.452,808,6.452,809,6.452]],["t/104",[4,1.553,5,0.86,6,1.093,9,0.961,14,1.69,18,0.684,79,2.425,119,2.232,151,2.541,157,2.425,159,2.008,161,1.782,163,2.076,165,2.008,193,1.799,194,2.528,195,1.87,196,1.91,197,1.832,199,1.646,201,1.951,214,1.646,261,2.323,262,4.146,263,6.29,265,2.677,266,2.531,273,2.841,297,3.257,750,4.227,766,4.845,810,5.452,811,3.736,812,5.452,813,5.452,814,5.452,815,5.452,816,3.736]],["t/106",[817,7.677]],["t/108",[4,1.553,5,0.895,6,0.736,8,0.872,9,1.07,14,1.88,20,2.069,188,2.41,189,1.961,190,2.591,192,1.864,193,1.806,194,2.302,195,2.081,196,2.125,197,2.038,198,2.496,199,1.911,200,2.816,201,2.17,202,3.261,203,2.267,204,3.371,205,2.267,206,3.492,207,2.069,208,1.961,214,1.911,215,2.41,818,7.085]],["t/111",[87,4.581,103,2.724,136,2.302,193,1.488,202,3.239,210,2.588,216,2.642,217,3.745,218,3.239,219,3.468,220,3.91,221,4.317,277,3.044,448,4.098,455,4.317,800,5.354,801,5.354,819,6.025,820,6.15,821,6.025,822,7.544,823,6.025]],["t/113",[5,0.628,8,1.221,18,1.112,58,3.376,75,3.497,108,4.594,136,2.321,193,1.631,210,2.084,222,2.677,223,3.497,224,2.981,230,3.164,231,4.594,232,4.214,233,4.714,234,4.354,235,3.266]],["t/115",[87,5.777,236,5.167]],["t/117",[4,1.394,5,0.824,6,0.868,8,0.824,9,0.454,14,0.798,18,0.471,23,2.846,44,2.45,47,1.481,103,1.163,193,1.832,194,2.245,195,1.407,196,1.791,197,1.378,200,1.903,201,1.467,203,1.532,205,1.532,207,1.228,208,1.163,214,1.807,215,1.43,264,3.574,266,2.707,278,2.36,285,1.481,286,2.956,294,3.343,295,3.118,297,3.483,298,3.784,299,2.661,495,2.636,530,3.483,632,2.098,789,2.939,824,2.287,825,4.753,826,5.531,827,3.784,828,3.343,829,5.181,830,5.159,831,3.343,832,3.644,833,3.644,834,3.644,835,3.343,836,3.644]],["t/119",[8,1.312,9,0.851,18,0.884,23,3.413,30,2.126,90,3.132,97,2.302,140,2.409,142,3.934,210,1.655,224,2.368,229,2.182,251,2.494,264,2.876,277,3.298,278,3.758,280,3.67,300,3.203,301,3.67,302,2.778,303,4.288,306,3.459,307,3,309,4.288,310,3.934,312,3.934,313,4.288,314,3.67,315,3.934,316,3.283,317,3,318,3.934,319,4.288,320,3.459,321,4.288,322,4.288,323,3.67,324,4.288,325,3.934,412,3.934,837,4.288,838,4.826,839,4.826]],["t/120",[840,7.677]],["t/122",[4,1.309,5,0.739,6,1.214,18,1.309,194,2.172,229,3.232,264,3.15,841,5.436]],["t/124",[5,0.823,8,1.32,55,2.35,136,2.51,163,3.65,261,4.084,286,3.049,361,3.924,711,4.707,842,5.837,843,4.753,844,5.702,845,6.569,846,4.468]],["t/126",[9,1.505,23,2.799,55,0.883,216,3.081,255,2.012,264,1.088,286,3.578,287,2.194,290,3.525,301,4.743,302,5.062,307,5.307,366,3.525,369,3.525,370,1.769,374,7.586,375,4.22,378,2.283,414,3.525,546,2.012,646,1.769,647,4.418,825,2.012,827,1.602,830,1.877,837,2.194,847,2.469,848,8.456,849,2.469,850,2.469,851,2.469,852,2.469,853,2.469,854,2.469,855,2.469,856,2.194,857,2.469,858,2.469,859,2.194,860,2.469,861,2.469,862,2.469,863,2.469,864,2.194,865,2.469,866,2.469,867,2.012,868,2.469,869,2.469,870,2.469,871,2.469]],["t/128",[48,3.629,108,4.594,229,2.746,231,4.594,232,4.594,233,5.139,375,2.898,429,5.382,432,5.398,448,5.889,536,3.943,872,5.398]],["t/130",[5,0.734,12,1.654,23,1.502,93,4.162,103,1.698,111,4.162,114,1.743,193,1.08,201,2.311,203,2.413,205,2.045,222,1.654,229,2.474,277,3.262,283,2.855,286,2.54,302,2.161,320,2.691,333,5.785,375,3.974,397,3.723,424,3.337,427,2.855,429,5.179,434,2.855,435,3.402,436,2.855,437,3.552,438,2.335,440,4.462,446,3.337,448,2.554,495,1.698,530,3.27,536,3.552,789,2.691,827,2.437,873,4.863,874,3.755,875,5.473,876,5.473,877,3.337,878,4.863,879,3.755,880,4.863,881,3.755,882,3.755,883,3.755,884,3.755,885,3.755,886,3.755,887,3.755,888,3.755,889,3.755,890,3.337,891,3.755,892,2.554]],["t/132",[9,1.496,14,2.63,23,3.394,55,2.943,103,3.718,193,1.674,229,2.139,264,2.085,522,4.181,546,3.858,646,3.391,701,3.598,827,3.071,844,3.391,864,4.205,867,5.251,893,4.205,894,4.732,895,6.442,896,6.442,897,6.442,898,4.732,899,3.858,900,4.732,901,6.442,902,4.205]],["t/134",[5,0.73,9,1.402,14,2.465,18,0.349,23,1.282,28,1.297,32,2.306,51,0.697,55,1.147,95,1.573,99,1.185,114,0.885,162,1.297,182,1.449,189,0.862,193,1.698,216,0.668,229,3.545,237,2.479,240,1.694,241,2.823,245,1.694,246,3.487,250,1.694,251,0.728,264,3.548,277,4.069,302,1.097,365,1.237,375,3.741,403,3.487,416,1.297,429,1.185,492,2.974,495,1.449,503,1.554,519,1.297,522,1.237,526,1.694,529,1.694,530,3.513,536,5.09,543,1.185,561,1.694,564,1.694,573,1.694,602,1.694,611,1.694,612,1.694,613,1.694,657,1.366,701,1.449,707,1.025,735,2.231,750,0.993,758,1.694,789,1.366,804,1.694,846,1.297,873,5.834,880,1.694,890,2.849,892,2.181,893,1.694,903,7.953,904,5.428,905,3.206,906,4.15,907,4.15,908,1.906,909,1.906,910,1.554,911,1.906,912,3.206,913,1.906,914,1.906,915,1.906,916,1.906,917,3.206,918,1.906,919,1.906,920,1.906,921,1.906,922,1.906,923,1.906,924,1.554,925,1.906,926,1.554,927,1.694,928,1.906,929,1.906]],["t/136",[4,1.12,5,0.828,6,1.195,18,0.804,47,2.527,51,1.605,55,1.571,82,1.605,100,3.338,119,2.622,135,3.338,136,2.337,193,1.809,194,1.859,195,2.098,196,1.538,197,2.055,200,2.037,201,1.571,203,1.64,205,1.64,208,1.984,230,2.286,232,2.439,282,2.729,297,2.622,298,2.849,299,2.849,404,3.521,425,2.986,632,3.578,786,2.622,843,2.622,930,6.256,931,4.389,932,4.389,933,4.389,934,4.389,935,4.389,936,4.389,937,4.389,938,4.389,939,4.389,940,4.389,941,4.389,942,4.389]],["t/138",[5,0.89,47,2.738,108,2.644,119,1.86,136,2.661,141,2.02,161,2.754,163,3.209,193,1.798,197,1.046,225,2.849,230,3.628,231,2.644,232,2.644,233,2.958,235,1.673,241,4.738,265,5.788,335,1.935,354,2.538,368,2.334,375,1.485,380,2.766,525,5.131,621,6.141,650,2.538,711,5.788,796,1.935,842,7.177,872,5.131,943,5.774,944,5.774,945,6.966,946,5.774,947,4.757,948,3.113]],["t/140",[18,1.391,236,5.167]],["t/142",[4,1.009,5,0.894,6,0.644,8,0.469,9,0.668,14,1.175,18,0.427,55,0.835,82,0.853,92,1.76,102,1.673,103,1.055,119,2.265,193,1.9,194,1.674,195,2.445,197,2.395,214,1.67,266,3.308,282,1.451,285,1.343,297,3.292,298,3.576,338,1.775,360,2.883,365,3.107,552,4.19,557,4.19,709,5.28,731,5.577,732,4.897,786,1.394,843,1.394,949,3.791,950,6.493,951,3.791,952,5.511,953,2.074,954,2.074,955,3.791,956,3.791,957,3.791,958,3.791,959,3.791,960,3.791,961,3.791,962,3.791]],["t/144",[5,0.827,8,1.136,18,1.034,90,3.667,103,3.614,119,4.327,137,3.667,174,3.376,197,2.434,224,2.772,277,2.855,278,4.169,320,4.049,360,4.297,365,4.701,375,3.455,536,3.667,537,5.021,548,4.606,709,4.049,711,5.729,731,4.606,788,5.021,963,5.651]],["t/146",[18,1.391,727,6.193]],["t/148",[40,5.608,51,2.515,54,5.608,252,5.231,543,4.277,690,4.93,755,5.608,964,6.879,965,6.879,966,6.113,967,6.879,968,6.879]],["t/150",[4,0.953,5,0.538,6,0.884,18,1.257,23,2.082,30,2.294,50,3.731,56,3.379,62,3.236,70,3.379,193,1.516,252,3.959,730,4.921,927,4.626,969,6.102,970,6.102,971,4.244,972,5.206,973,5.206,974,7.112,975,2.63,976,5.206,977,5.206,978,5.206,979,7.252,980,6.102,981,5.206,982,4.626]],["t/152",[15,5.268,33,4.275,40,5.123,176,5.585,189,2.841,251,2.401,327,5.585,421,4.504,495,2.841,501,5.123,521,4.779,707,3.379,926,5.123,969,6.882,970,5.585,983,6.285,984,6.285,985,6.285,986,5.585,987,3.379]],["t/154",[8,0.996,13,4.405,27,3.082,36,3.082,51,2.43,78,3.171,97,2.365,146,2.962,243,4.041,251,1.894,335,4.133,360,3.77,361,3.972,377,4.405,495,2.241,501,4.041,512,3.77,539,2.029,707,2.665,719,3.217,751,4.405,820,4.041,926,4.041,974,4.041,979,6.114,988,4.958,989,5.419,990,6.648,991,4.958,992,3.553,993,4.958,994,4.958,995,4.958,996,4.958,997,4.958,998,4.041,999,4.041,1000,4.958,1001,4.041,1002,4.041,1003,4.041,1004,4.958,1005,4.958,1006,3.553,1007,4.958]],["t/156",[3,3.281,4,1.259,5,0.711,6,1.168,229,3.11,539,2.816,786,4.11,1008,6.879,1009,6.113,1010,6.879,1011,5.608,1012,6.879]],["t/158",[55,2.533,787,4.595,1013,5.383,1014,7.08,1015,7.08,1016,7.08,1017,7.08,1018,6.291,1019,7.08]],["t/160",[4,1.284,5,0.725,6,1.19,56,4.55,1013,5.332,1018,6.23,1020,6.23,1021,7.012,1022,7.012,1023,6.23]],["t/162",[4,1.003,5,0.567,6,0.93,28,3.728,133,3.274,143,4.87,165,2.946,199,2.414,317,3.407,352,4.415,607,6.311,690,3.927,755,5.79,787,3.557,998,4.468,1009,4.87,1011,4.468,1013,4.167,1020,4.87,1023,6.311,1024,5.48,1025,5.48,1026,5.48,1027,5.48,1028,4.87,1029,4.87,1030,4.87,1031,5.48,1032,5.48,1033,4.87,1034,5.48,1035,7.102,1036,4.468,1037,5.48]],["t/164",[4,1.271,5,0.718,6,1.179,54,5.661,707,3.733,1038,5.661,1039,6.171,1040,6.945,1041,6.945,1042,6.945,1043,6.945]],["t/166",[52,4.357,82,2.666,378,4.198,509,5.226,1044,5.945,1045,6.48]],["t/168",[4,1.562,5,0.839,6,1.527,9,1.303,14,2.29,18,1.068,30,2.569,193,1.458,658,5.62,730,4.179,1046,5.832,1047,5.182,1048,5.296,1049,5.027,1050,5.182]],["t/170",[4,1.504,5,0.849,6,0.723,9,1.222,14,1.32,20,3.305,55,1.525,193,1.813,194,2.284,195,2.055,196,2.099,197,2.013,198,2.453,199,1.877,200,2.781,201,2.144,203,2.239,205,2.239,207,2.033,208,1.926,214,1.877,215,2.368,297,3.579,298,3.888,299,3.888,300,2.091,346,4.293,347,5.324,348,4.884,349,3.579,350,4.884,1051,3.474]],["t/172",[3,2.767,4,0.745,5,0.6,6,1.374,8,0.818,9,1.427,12,1.793,14,2.508,18,0.745,30,1.793,88,2.056,133,3.465,189,1.84,193,1.144,194,1.762,196,1.426,218,2.188,346,4.157,352,3.606,541,3.095,543,2.53,617,2.432,634,5.154,683,3.318,684,3.318,735,2.188,750,2.12,779,2.769,796,2.53,974,4.728,999,4.728,1044,4.728,1048,4.157,1052,6.005,1053,2.769,1054,4.07,1055,3.617,1056,4.07,1057,4.07,1058,7.365,1059,5.8,1060,5.8,1061,5.8,1062,4.07,1063,4.07,1064,4.07,1065,3.617,1066,4.07,1067,4.07,1068,4.07]],["t/174",[4,1.522,5,0.891,6,1.2,9,1.384,16,5.065,140,1.653,193,1.699,194,2.385,195,1.866,196,1.905,197,1.828,216,1.905,219,3.131,346,3.898,617,3.25,621,4.136,658,4.136,1048,3.898,1049,3.7,1069,5.439,1070,5.439,1071,5.439,1072,5.439]],["t/177",[4,1.25,5,0.755,6,0.876,8,0.697,9,0.91,18,0.635,23,3.06,44,4.08,82,1.268,97,1.655,133,3.084,159,1.865,193,1.799,194,2.075,195,1.19,196,1.215,197,1.165,200,1.61,201,1.241,203,1.296,205,1.296,216,1.215,264,3.372,266,2.396,278,1.997,286,3.553,294,2.828,295,2.638,297,2.072,298,2.251,299,2.251,302,1.997,316,2.359,396,2.486,495,2.334,524,2.828,530,3.084,789,2.486,825,4.208,826,5.026,827,4.432,828,2.828,829,4.587,830,4.688,831,2.828,832,3.082,833,3.082,834,3.082,835,2.828,836,3.082,846,2.359,1073,3.469,1074,3.469,1075,3.469,1076,3.699]],["t/179",[5,0.78,55,2.156,82,2.203,99,3.745,107,3.468,108,3.348,127,4.911,150,4.581,161,2.874,218,3.239,222,2.654,251,2.302,279,4.911,282,3.745,495,2.724,512,4.581,513,5.354,786,3.599,843,3.599,844,4.317,899,4.911,1077,5.354,1078,6.025,1079,6.025,1080,6.025,1081,6.025]],["t/181",[4,1.179,5,0.489,6,0.803,7,4.205,12,2.085,18,1.179,38,3.071,41,2.827,44,4.697,50,3.391,60,6.705,63,3.858,64,3.598,66,3.858,105,3.858,107,2.724,110,4.898,122,4.205,144,2.391,189,2.139,304,4.898,495,2.139,530,2.827,617,2.827,646,3.391,787,3.071,827,3.071,828,3.858,902,5.724,1006,3.391,1013,3.598,1065,4.205,1082,4.732,1083,4.732,1084,4.205,1085,4.205,1086,4.732,1087,4.732,1088,4.732,1089,4.205,1090,4.732,1091,4.732,1092,4.732,1093,5.724,1094,4.732,1095,4.732,1096,4.732]],["t/183",[3,1.544,4,1.083,5,0.801,6,1.12,8,0.651,9,1.492,10,1.863,14,1.003,15,2.202,16,2.32,18,1.365,19,2.101,20,3.896,22,3.996,23,1.295,24,2.639,30,2.16,31,2.462,32,1.799,33,2.202,43,2.202,44,1.934,45,2.202,46,3.727,47,1.863,52,1.934,55,1.754,82,1.792,88,2.988,92,1.503,111,2.462,131,2.877,135,2.462,140,0.984,172,2.476,196,1.717,199,2.606,216,1.134,223,1.863,300,3.237,325,2.639,334,2.202,353,2.32,378,1.863,400,2.639,434,2.462,522,3.839,584,2.639,620,2.639,624,2.877,640,3.996,702,2.877,704,3.996,746,2.462,975,1.636,1097,3.237,1098,3.237,1099,3.237,1100,3.237,1101,3.237,1102,4.902,1103,2.877,1104,3.237,1105,3.237,1106,3.237,1107,2.877,1108,3.237,1109,3.237,1110,2.639,1111,3.237,1112,3.237,1113,4.356,1114,3.237,1115,2.32,1116,3.237,1117,2.101,1118,2.877]],["t/185",[3,1.448,4,0.556,5,0.808,6,1.169,8,0.61,9,1.335,14,0.941,15,3.174,16,2.175,18,1.468,19,1.97,23,2.754,27,1.887,28,2.064,30,1.337,35,2.308,36,1.887,37,1.337,46,4.852,47,1.747,50,2.175,52,1.813,55,1.086,82,2.078,88,1.533,92,1.409,97,1.448,140,1.418,183,2.308,184,2.308,189,1.372,193,1.707,195,1.6,197,1.02,216,1.634,225,1.337,266,1.409,285,1.747,307,1.887,334,3.866,370,2.175,376,5.67,378,1.747,396,2.175,495,1.372,496,2.064,507,2.308,522,4.915,530,1.813,539,1.242,575,2.474,617,2.787,620,2.474,843,2.787,867,3.804,987,1.631,1103,2.697,1119,2.474,1120,3.035,1121,3.035,1122,2.474,1123,3.035,1124,3.344,1125,3.035,1126,3.344,1127,3.035,1128,3.035,1129,3.035,1130,4.666,1131,3.035,1132,4.146,1133,4.666,1134,3.035,1135,3.035,1136,3.035,1137,3.035]],["t/187",[5,0.872,6,0.788,8,1.278,9,0.818,18,0.85,44,2.773,51,1.697,63,3.784,70,3.012,72,3.827,88,2.345,93,3.529,95,3.119,96,3.119,99,2.885,114,3.62,136,1.773,140,1.41,165,2.495,172,2.345,192,1.994,224,2.277,225,2.045,251,1.773,317,2.885,415,3.326,416,5.305,422,3.784,500,3.012,519,3.157,578,3.529,748,3.529,844,3.326,910,3.784,1053,3.157,1110,3.784,1126,3.326,1138,4.641,1139,4.834,1140,4.124,1141,4.641,1142,4.641,1143,4.641,1144,3.529,1145,3.529]],["t/189",[4,1.48,5,0.836,6,0.982,82,2.115,193,1.732,194,2.234,195,1.984,196,2.576,197,1.944,200,2.685,201,2.07,202,3.11,203,2.162,204,3.215,205,2.162,206,3.33,207,2.76,208,2.615,282,3.597,396,4.146,786,3.456,1146,5.141]],["t/191",[4,1.345,5,0.852,6,0.809,18,1.345,72,2.337,82,2.687,114,3.003,115,3.883,118,3.622,128,3.883,144,2.406,193,1.716,194,1.966,195,1.634,196,2.267,197,1.6,201,1.704,202,2.56,203,1.78,204,2.647,205,1.78,206,2.742,207,2.272,208,2.153,266,2.211,282,2.961,396,3.413,406,3.883,786,2.845,892,4.401,1146,4.232,1147,3.883,1148,4.232,1149,4.763,1150,4.763,1151,4.763,1152,3.883,1153,4.763,1154,4.763]],["t/193",[4,1.148,5,0.764,6,0.606,8,0.718,18,0.654,62,2.22,82,1.306,88,1.804,97,1.703,99,3.279,114,2.448,136,1.364,140,1.085,144,1.804,171,2.911,172,1.804,193,1.815,194,1.906,195,1.225,196,1.251,197,1.2,201,1.278,202,1.92,203,1.334,204,1.985,205,1.334,206,2.055,207,1.703,208,1.614,229,1.614,248,2.911,266,3.215,358,2.715,397,3.588,416,2.429,451,3.173,457,2.715,459,3.173,548,4.3,576,2.715,820,2.911,827,2.317,830,2.715,831,2.911,892,3.588,1048,2.559,1049,2.429,1115,2.559,1145,2.715,1147,2.911,1148,3.173,1152,2.911,1155,3.571,1156,3.173,1157,6.927,1158,5.275,1159,3.571,1160,4.687,1161,5.275,1162,3.571,1163,3.571,1164,3.571,1165,3.571,1166,3.571,1167,3.571,1168,3.571,1169,3.571,1170,3.571,1171,3.571,1172,3.173]],["t/196",[4,0.505,5,0.285,6,0.468,9,0.764,18,0.979,20,3.612,23,1.103,30,1.215,36,1.715,47,1.588,51,1.009,56,1.79,72,1.354,81,2.249,85,2.451,136,1.054,138,3.532,141,1.79,172,1.394,185,3.105,193,1.792,196,1.518,229,1.959,266,2.011,285,1.588,307,2.693,311,2.249,317,1.715,334,1.876,353,1.977,361,1.648,418,1.648,421,1.977,438,1.715,521,2.098,543,1.715,673,2.249,682,2.451,683,2.249,684,2.249,688,2.249,689,2.451,697,2.451,699,2.451,704,4.361,707,1.483,746,2.098,748,2.098,795,1.977,796,2.693,856,2.451,971,2.249,982,2.451,989,3.532,998,2.249,1028,2.451,1051,2.249,1089,2.451,1113,4.754,1115,3.105,1122,2.249,1126,1.977,1156,2.451,1173,2.759,1174,2.759,1175,2.759,1176,2.759,1177,2.759,1178,2.759,1179,2.759,1180,2.759,1181,2.759,1182,2.759,1183,2.759,1184,4.333,1185,2.759,1186,2.759,1187,4.333,1188,2.759,1189,2.451,1190,4.333,1191,2.759,1192,2.759,1193,2.759,1194,2.759,1195,2.759,1196,2.759,1197,5.386,1198,2.759,1199,2.759,1200,2.759,1201,2.759,1202,2.759,1203,2.759,1204,4.333,1205,2.759,1206,4.333,1207,5.35,1208,4.333,1209,4.333,1210,4.333,1211,2.759,1212,3.294,1213,2.759,1214,2.759,1215,2.759,1216,2.759,1217,2.759,1218,2.759,1219,2.759]],["t/198",[5,0.884,6,0.612,8,0.725,9,0.636,18,0.66,31,2.742,32,2.004,33,2.453,38,2.34,49,2.742,71,3.205,82,1.318,95,2.607,101,5.143,140,1.096,172,1.822,181,3.205,193,1.464,196,1.263,207,2.534,208,2.402,224,2.607,229,1.63,335,2.242,368,1.769,375,1.72,404,2.076,415,3.808,465,3.808,541,2.742,543,3.922,578,2.742,649,4.331,650,4.331,654,4.721,663,6.593,664,3.205,779,2.453,787,2.34,799,2.94,1006,2.584,1117,2.34,1119,2.94,1220,3.606,1221,3.606,1222,3.205,1223,3.606,1224,5.313,1225,3.606,1226,5.313,1227,3.606,1228,3.606,1229,6.308,1230,3.606,1231,5.313,1232,7.762,1233,5.313,1234,6.308,1235,3.606,1236,3.606,1237,3.606,1238,3.205,1239,3.205,1240,3.606,1241,3.205]],["t/200",[4,1.013,5,0.785,6,0.399,8,0.472,18,0.43,19,1.525,23,1.524,48,1.403,70,1.525,72,1.87,92,1.769,95,1.87,96,1.153,99,1.46,105,1.915,114,1.09,118,2.898,141,1.525,144,1.187,193,1.851,194,1.158,195,0.806,197,1.859,207,2.293,208,2.173,216,0.823,218,1.263,229,1.062,251,0.898,264,1.035,266,3.023,278,1.352,279,1.915,286,2.232,304,3.656,375,1.121,429,1.46,468,1.598,494,1.683,495,1.062,516,2.087,524,1.915,536,1.525,576,1.786,608,1.786,646,1.683,648,5.403,673,1.915,681,1.915,735,4.079,760,4.272,826,1.915,835,1.915,859,2.087,892,3.763,986,2.087,1006,2.731,1033,2.087,1045,2.087,1077,4.915,1084,2.087,1110,1.915,1140,2.087,1147,1.915,1152,1.915,1172,4.272,1222,2.087,1242,4.808,1243,2.349,1244,3.811,1245,2.349,1246,3.811,1247,3.811,1248,2.349,1249,6.859,1250,2.349,1251,2.349,1252,2.349,1253,2.349,1254,2.349,1255,2.349,1256,4.808,1257,3.811,1258,3.811,1259,3.811,1260,1.786,1261,2.349,1262,2.349,1263,2.349,1264,2.087,1265,2.349,1266,1.915,1267,2.349,1268,2.349,1269,2.349,1270,2.349,1271,2.349,1272,2.349,1273,2.349]],["t/202",[5,0.753,53,4.642,193,1.815,197,2.446,266,3.725,365,3.696,423,4.33,494,4.081,530,3.402,711,4.081,712,5.06,715,5.06,877,5.06,878,6.469,1076,4.081,1274,5.06,1275,5.695,1276,5.695,1277,5.695,1278,5.695,1279,5.695,1280,5.695]],["t/205",[3,2.212,4,1.035,5,0.859,6,1.411,8,1.136,9,1.278,12,1.326,14,1.752,17,2.289,18,1.035,21,2.454,24,2.454,26,2.047,30,2.043,33,2.047,51,1.1,65,1.567,88,1.521,95,1.477,97,1.436,110,3.525,123,2.454,140,0.915,141,3.009,171,2.454,172,1.521,189,1.361,193,1.611,194,2.202,195,1.59,196,1.624,197,1.558,210,1.032,214,2.043,225,2.043,246,2.157,251,1.15,264,1.326,273,2.289,307,2.882,342,2.157,352,1.871,361,1.798,368,1.477,496,2.047,539,1.232,621,3.525,623,2.674,685,3.779,707,1.618,786,1.798,841,2.289,975,2.857,987,2.492,1039,2.674,1048,2.157,1049,3.153,1050,4.12,1117,1.953,1124,2.157,1281,4.12,1282,2.674,1283,3.01,1284,3.01,1285,4.636,1286,4.636,1287,3.01,1288,3.01,1289,3.01,1290,3.01,1291,3.01,1292,4.12,1293,2.674,1294,2.454,1295,2.454,1296,3.01,1297,3.01,1298,3.01,1299,1.673,1300,3.01]],["t/207",[2,3.305,3,2.2,4,1.159,5,0.747,6,1.075,9,0.813,11,3.137,12,2.789,18,1.159,37,2.032,38,2.993,51,2.314,73,3.76,78,2.2,88,2.33,104,2.867,136,1.762,178,4.536,183,3.507,184,3.507,185,3.305,188,2.563,251,1.762,264,2.032,300,2.263,317,2.867,378,2.655,418,2.755,455,3.305,495,2.085,509,3.305,690,3.305,707,2.479,717,3.305,735,2.479,750,2.402,775,3.137,975,3.198,987,2.479,1053,3.137,1299,2.563,1301,5.625,1302,4.098,1303,4.098,1304,4.098,1305,4.098,1306,3.507,1307,4.612,1308,3.76,1309,4.098,1310,4.098,1311,4.612,1312,4.612,1313,4.612]],["t/209",[4,0.996,5,0.731,6,1.2,9,1.246,11,3.7,12,2.396,14,1.686,16,3.898,17,4.136,18,0.996,22,4.434,26,3.7,30,2.396,92,2.525,94,4.833,141,3.53,302,3.131,352,3.382,378,3.131,379,5.374,450,3.928,725,3.53,796,3.382,975,3.57,987,4.22,1036,4.434,1049,3.7,1292,4.833,1314,5.439,1315,5.439,1316,5.439,1317,5.439]],["t/211",[5,0.641,8,0.898,18,1.302,41,2.671,51,1.634,55,1.6,72,2.193,78,2.132,82,2.265,83,3.644,88,2.258,95,2.193,107,2.573,133,3.701,136,1.708,140,1.358,147,3.972,159,3.33,194,1.358,210,1.533,225,1.97,358,3.399,368,4.196,411,4.021,667,3.972,709,3.204,843,2.671,844,5.095,910,3.644,930,3.972,953,3.972,1076,5.095,1144,3.399,1318,2.901,1319,3.204,1320,4.47,1321,5.505,1322,4.47,1323,5.505,1324,3.972,1325,3.972,1326,3.644,1327,4.47,1328,3.399,1329,3.399,1330,3.399,1331,4.47,1332,4.47,1333,3.972,1334,3.972]],["t/213",[5,0.627,8,1.016,12,1.486,18,1.387,32,1.874,51,1.233,55,2.169,70,3.28,82,2.217,83,2.749,88,1.704,96,1.655,99,2.097,114,2.346,118,2.564,133,2.015,140,2.386,149,2.097,159,2.717,172,1.704,174,2.015,178,2.417,188,1.874,192,1.449,196,1.181,200,1.565,208,1.525,210,2.08,216,1.771,225,1.486,229,2.285,251,2.316,341,2.997,349,2.015,361,3.02,362,2.189,363,4.943,368,3.853,370,2.417,373,2.997,404,1.941,407,2.997,408,2.417,411,3.935,417,1.941,422,2.749,494,2.417,500,3.28,519,2.294,544,2.749,547,2.749,576,2.564,640,2.749,641,2.997,681,2.749,717,2.417,787,2.189,846,2.294,1076,2.417,1115,2.417,1212,2.564,1294,2.749,1306,2.564,1334,2.997,1335,2.997,1336,3.372,1337,2.346,1338,3.372,1339,3.372,1340,3.372,1341,2.417,1342,2.997,1343,3.372,1344,3.372,1345,3.372,1346,3.372,1347,3.372,1348,3.372,1349,3.372,1350,3.372,1351,2.997,1352,3.372]],["t/215",[2,3.678,5,0.531,6,0.871,8,1.031,9,0.905,12,2.261,15,3.491,18,0.94,37,2.261,38,4.415,56,3.331,72,2.518,136,1.961,137,3.331,140,2.469,144,2.593,150,3.903,159,2.759,368,3.744,495,2.32,707,2.759,843,3.066,954,4.561,971,4.184,987,2.759,1002,4.184,1038,4.184,1055,4.561,1266,4.184,1306,3.903,1337,2.382,1353,5.132,1354,5.132,1355,4.561,1356,5.132,1357,5.132,1358,4.561,1359,4.561,1360,5.132,1361,4.561,1362,5.132,1363,5.132]],["t/217",[3,2.069,4,1.111,5,0.448,8,1.219,18,1.111,21,3.536,23,1.734,27,2.696,41,2.591,78,2.069,79,2.815,96,2.128,136,1.657,146,2.591,154,3.536,157,2.815,161,2.894,165,2.331,172,2.191,193,1.573,195,1.488,210,1.488,225,1.911,261,2.696,266,2.013,286,2.013,345,2.815,364,3.108,368,2.128,433,5.013,467,3.298,470,3.536,539,1.775,717,3.108,787,2.815,975,2.191,987,3.261,1117,2.815,1124,3.108,1212,4.613,1326,3.536,1337,2.013,1364,3.854,1365,3.536,1366,4.337,1367,4.337,1368,4.337,1369,6.732,1370,4.337,1371,6.066,1372,3.854,1373,3.298,1374,4.337,1375,4.337,1376,4.337,1377,4.337,1378,4.337,1379,4.337]],["t/219",[6,0.974,9,1.29,20,2.738,26,3.904,30,2.529,62,4.548,127,4.679,140,1.744,168,4.364,174,3.429,199,2.529,210,1.969,251,2.795,307,3.568,443,5.1,457,4.364,458,5.1,719,3.725,924,4.679,1044,4.679,1197,5.1,1380,5.74,1381,5.1,1382,4.679,1383,5.1,1384,5.74,1385,5.1,1386,5.74,1387,5.74,1388,5.74]],["t/221",[18,1.48,37,2.549,96,2.839,136,2.21,140,2.234,216,2.027,222,2.549,286,3.413,345,3.755,368,3.966,411,4.772,417,3.33,485,4.399,975,2.923,987,3.11,992,4.146,1321,6.534,1335,5.141,1341,4.146,1381,5.141,1389,5.141,1390,5.141,1391,5.785,1392,5.141]],["t/223",[6,1.014,9,1.054,27,3.715,30,2.633,52,3.57,55,2.138,72,2.932,194,1.816,216,2.093,352,3.715,368,2.932,372,4.871,539,3.072,543,3.715,614,4.064,617,3.57,657,4.282,975,3.791,987,3.212,1052,5.31,1117,3.878,1294,4.871,1325,5.31,1390,5.31,1393,5.31,1394,4.282]],["t/225",[4,1.213,5,0.685,6,1.125,251,3.056,306,4.75,368,3.252,495,2.996,719,4.302,992,4.75,1260,5.04,1299,3.684,1394,4.75,1395,5.89,1396,6.628,1397,5.403]],["t/227",[3,3.051,4,1.433,5,0.809,6,1.436,9,1.128,10,3.681,18,1.171,30,2.818,62,3.976,730,4.583,1337,2.969,1382,5.214,1398,6.395,1399,6.395,1400,5.683,1401,6.395]],["t/229",[4,0.776,5,0.617,8,1.507,11,2.881,26,2.881,36,2.634,72,2.078,92,1.966,93,4.537,97,2.021,130,3.453,146,2.531,174,2.531,193,1.479,210,2.047,219,2.438,345,2.749,349,4.722,353,4.276,354,3.453,362,5.129,375,2.021,450,4.557,464,3.764,500,3.872,617,3.565,631,3.453,707,3.207,1038,3.453,1076,3.036,1126,3.036,1318,3.872,1319,3.036,1337,3.206,1359,3.764,1389,5.302,1395,3.764,1402,4.236,1403,4.236,1404,4.236,1405,4.236,1406,5.967,1407,5.967,1408,5.967,1409,4.236]],["t/231",[4,1.206,5,0.824,6,1.118,8,0.983,9,0.862,12,2.155,18,1.364,23,1.956,72,2.4,82,2.408,88,2.471,92,2.27,95,3.232,104,4.095,107,4.933,110,3.719,134,4.346,216,1.713,286,2.27,368,2.4,405,4.346,450,2.718,608,3.719,660,4.346,725,3.174,748,3.719,824,5.854,1337,3.058,1394,3.505,1410,4.891,1411,4.346,1412,4.346,1413,4.346,1414,4.346,1415,4.891,1416,4.346,1417,4.891,1418,4.891]],["t/233",[12,2.23,51,1.85,104,3.146,161,2.414,163,2.813,193,1.77,194,1.538,195,1.736,201,1.811,203,1.891,204,2.813,205,1.891,229,2.288,266,3.129,348,4.126,349,3.024,350,4.126,378,2.913,379,3.848,423,5.125,433,3.627,447,4.497,450,3.746,742,4.126,1036,4.126,1337,2.349,1419,4.126,1420,5.061,1421,5.989,1422,5.061,1423,5.061,1424,5.061,1425,5.061,1426,5.061,1427,5.061,1428,4.497,1429,5.061,1430,5.061,1431,5.061]],["t/235",[2,4.992,3,2.538,4,1.275,5,0.55,6,0.903,18,0.974,36,3.307,38,3.453,51,2.547,52,4.162,140,2.599,210,2.389,269,4.727,353,3.812,368,2.61,404,3.062,408,3.812,467,4.045,657,3.812,725,3.453,992,3.812,1053,3.619,1394,3.812,1397,4.337,1432,5.32,1433,4.337,1434,5.32,1435,5.32,1436,5.32,1437,5.32,1438,5.32,1439,5.32,1440,5.32,1441,5.32]],["t/237",[3,3.508,4,1.346,5,0.598,6,1.248,9,1.02,11,3.935,17,5.591,18,1.059,26,3.935,58,3.215,78,2.76,193,1.141,255,4.716,317,3.597,318,4.716,725,3.755,730,5.269,975,2.923,1299,3.215,1382,4.716,1393,5.141,1442,7.353,1443,7.353,1444,5.785,1445,5.785]],["t/239",[4,1.305,5,0.843,6,1.103,8,1.305,23,1.517,72,1.862,88,1.917,92,1.761,95,1.862,103,1.715,107,3.739,114,3.015,115,3.093,165,2.04,193,1.088,194,2.302,196,1.329,201,1.358,203,1.418,205,1.418,235,2.04,251,2.107,345,2.462,378,2.184,418,2.267,421,2.719,435,2.359,437,2.462,512,2.885,535,3.093,536,3.579,614,3.751,657,2.719,658,2.885,795,2.719,966,3.372,1117,2.462,1124,2.719,1126,3.952,1139,2.885,1189,4.9,1241,4.9,1260,2.885,1295,3.093,1299,2.109,1308,3.093,1328,2.885,1329,2.885,1330,4.94,1337,2.56,1341,2.719,1373,4.193,1416,3.372,1446,3.794,1447,3.372,1448,3.794,1449,3.794,1450,3.794,1451,3.093,1452,3.794,1453,3.794,1454,3.794,1455,3.372,1456,3.794,1457,3.794,1458,3.794]],["t/242",[3,2.257,4,1.341,5,0.666,6,1.335,8,1.295,9,1.136,14,2.27,51,2.678,55,1.693,57,3.219,78,2.257,82,1.73,88,2.391,95,2.322,149,2.942,159,2.544,163,2.63,165,2.544,214,2.085,237,2.827,261,2.942,264,2.085,323,3.598,345,3.071,411,3.071,539,1.937,685,3.858,717,3.391,735,2.544,750,2.464,796,2.942,975,2.391,987,2.544,1049,3.219,1266,3.858,1281,4.205,1282,6.508,1299,2.63,1337,2.196,1459,2.391,1460,4.732,1461,4.205,1462,4.732,1463,4.732,1464,4.732,1465,4.205]],["t/244",[4,1.01,5,0.392,6,0.936,8,0.763,9,1.145,11,2.581,12,2.43,18,0.695,19,2.462,49,2.885,57,2.581,58,2.109,62,2.359,78,1.81,79,2.462,96,1.862,100,2.885,109,3.372,129,3.372,140,1.153,152,3.372,158,3.372,159,2.964,161,1.81,162,3.751,168,2.885,178,3.952,183,2.885,184,2.885,185,2.719,189,1.715,194,1.153,225,1.672,264,1.672,304,2.885,358,2.885,400,3.093,418,2.267,509,2.719,539,1.553,582,3.093,608,2.885,677,3.372,707,2.04,719,2.462,720,3.372,795,2.719,841,4.193,1001,3.093,1030,3.372,1260,2.885,1299,3.065,1301,3.372,1302,3.372,1303,3.372,1304,3.372,1305,3.372,1306,2.885,1309,4.9,1310,4.9,1324,3.372,1337,2.56,1355,3.372,1358,3.372,1397,3.093,1400,3.372,1414,3.372,1419,3.093,1455,3.372,1459,1.917,1466,3.794,1467,3.794,1468,3.794,1469,3.372,1470,3.794,1471,3.372,1472,3.794,1473,3.093,1474,3.794,1475,3.794,1476,3.794,1477,3.794,1478,3.794,1479,3.794,1480,3.794]],["t/246",[539,3.016,1459,3.721,1481,6.005,1482,7.366,1483,6.005]],["t/248",[4,0.818,8,1.429,12,1.97,37,2.729,51,2.265,55,1.6,78,2.132,82,1.634,92,2.075,96,3.04,97,2.955,114,2.075,128,3.644,136,2.367,140,1.882,144,2.258,148,3.644,191,3.644,195,1.533,216,2.17,225,1.97,237,2.671,246,3.204,251,1.708,259,3.972,264,1.97,310,3.644,335,3.851,412,3.644,435,2.779,474,3.399,478,3.972,562,3.972,578,3.399,692,3.972,779,3.041,841,3.399,843,2.671,846,3.041,1011,3.644,1326,3.644,1337,2.876,1351,3.972,1364,3.972,1369,3.972,1473,3.644,1484,3.972,1485,3.972,1486,4.47,1487,3.972,1488,4.47,1489,4.47,1490,4.47,1491,4.47,1492,4.47,1493,4.47,1494,4.47,1495,4.47]],["t/250",[539,3.016,645,5.601,1459,3.721,1483,6.005,1496,7.366]],["t/252",[3,2.654,5,0.575,6,0.945,9,1.399,10,3.203,18,1.019,35,4.231,55,1.991,57,3.785,68,4.536,194,1.691,225,2.451,251,2.74,352,3.459,361,3.324,509,3.987,522,3.611,539,2.278,686,4.944,719,3.611,975,2.811,1003,4.536,1006,3.987,1115,3.987,1119,4.536,1299,4.411,1361,4.944,1497,5.564,1498,5.564,1499,4.944,1500,4.944,1501,5.564]],["t/254",[539,3.016,1459,3.721,1481,6.005,1483,6.005,1502,7.366]],["t/256",[4,1.011,5,0.571,6,0.937,8,1.11,12,2.433,18,1.011,51,3.165,82,2.019,140,2.169,141,3.584,194,1.678,237,3.299,238,4.907,251,2.11,306,3.957,345,4.632,364,3.957,378,3.178,379,4.199,411,3.584,450,3.069,775,3.756,818,4.907,975,2.79,1002,5.818,1117,3.584,1124,3.957,1421,4.907,1484,4.907,1503,5.522,1504,5.522]],["t/258",[539,3.016,1459,3.721,1461,6.546,1505,7.366,1506,5.601]],["t/260",[4,1.36,5,0.608,6,1.261,8,1.181,9,1.036,10,3.384,12,2.59,18,1.076,23,2.351,51,2.716,78,2.804,82,2.716,100,5.648,149,3.655,172,2.97,286,2.729,300,2.884,335,3.655,364,4.213,450,3.267,519,3.999,796,3.655,1333,5.224,1507,4.47,1508,5.224]],["t/262",[539,3.046,1459,3.76,1506,5.659,1509,7.442]],["t/264",[3,2.021,4,0.776,5,0.714,6,1.273,9,1.322,10,2.438,18,0.776,19,2.749,27,2.634,39,3.764,43,2.881,45,4.058,51,2.741,55,1.516,56,2.749,95,2.078,97,2.021,104,2.634,144,2.14,251,1.618,253,3.764,285,2.438,323,3.221,398,3.453,411,2.749,416,2.881,495,1.915,539,3.235,584,3.453,846,2.881,975,2.14,1003,3.453,1122,3.453,1238,3.764,1293,3.764,1299,2.354,1394,3.036,1447,3.764,1465,3.764,1499,5.302,1500,3.764,1506,3.221,1510,4.236,1511,4.236,1512,4.236,1513,3.764,1514,4.236,1515,4.236,1516,4.236,1517,4.236,1518,4.236,1519,4.236,1520,4.236,1521,4.236,1522,4.236,1523,4.236,1524,4.236,1525,4.236,1526,4.236,1527,4.236,1528,4.236]],["t/266",[299,4.781,539,3.016,1459,3.721,1506,5.601,1529,7.366]],["t/268",[4,1.161,6,1.076,8,1.274,9,1.118,10,3.649,37,2.793,51,2.846,78,3.024,140,1.926,144,3.203,149,3.941,237,3.787,275,5.633,300,3.111,335,3.941,500,5.053,1318,4.114,1507,4.821,1530,6.34]],["t/270",[539,3.016,1160,6.546,1459,3.721,1531,7.366,1532,6.005]],["t/272",[4,0.894,5,0.61,8,0.982,18,1.08,30,2.152,37,3.117,41,1.926,45,2.192,51,2.407,55,1.153,57,2.192,62,2.004,95,1.581,96,3.23,98,2.864,114,1.496,140,2.149,144,1.628,149,2.004,154,2.627,159,1.733,161,1.537,216,2.066,218,1.733,222,1.42,235,1.733,251,1.231,261,2.004,277,1.628,286,2.738,305,3.715,314,2.451,338,2.451,349,1.926,362,2.092,372,2.627,417,1.855,436,2.451,485,2.451,500,4.272,502,2.864,504,2.864,528,2.864,538,2.864,542,2.864,544,2.627,547,2.627,549,2.864,551,2.864,553,2.864,558,2.864,560,2.864,563,2.864,566,2.864,568,2.864,586,2.627,587,2.627,588,2.627,617,1.926,619,2.864,645,2.451,719,2.092,735,2.626,740,3.982,750,3.072,987,1.733,992,2.31,1047,2.864,1093,2.864,1299,3.278,1318,3.17,1319,2.31,1337,3.284,1341,2.31,1383,2.864,1392,2.864,1533,3.223,1534,2.627,1535,4.885,1536,4.885,1537,3.223,1538,3.223,1539,3.223,1540,3.223,1541,3.223,1542,3.223,1543,3.223,1544,3.223,1545,3.223,1546,3.223]],["t/274",[539,3.046,1459,3.76,1532,6.067,1547,6.613]],["t/276",[5,0.633,36,3.809,51,3.034,114,2.844,140,1.861,201,2.192,203,2.289,205,2.289,222,3.656,317,3.809,417,3.526,435,3.809,437,3.976,496,4.167,500,4.947,799,4.994,892,5.185,1051,4.994,1342,5.444]],["t/278",[1459,3.76,1532,6.067,1548,7.442,1549,7.442]],["t/280",[5,0.716,6,1.017,8,0.856,9,1.325,18,1.097,37,1.877,45,2.898,47,2.453,51,2.19,72,2.091,96,2.94,136,1.628,140,1.295,146,2.546,149,2.649,186,3.474,205,1.592,222,1.877,300,2.091,311,3.474,449,3.474,450,2.368,471,3.474,474,4.556,495,1.926,496,2.898,507,3.24,519,5.113,582,3.474,617,2.546,649,4.884,659,3.786,757,3.786,775,2.898,779,4.713,980,3.786,1001,3.474,1053,2.898,1107,3.786,1118,3.786,1132,3.786,1274,3.786,1318,2.765,1365,3.474,1372,3.786,1385,3.786,1473,4.884,1507,3.24,1508,3.786,1550,4.261,1551,4.261,1552,4.261,1553,4.261,1554,4.261,1555,4.261,1556,4.261,1557,4.261,1558,4.261,1559,4.261,1560,4.261]],["t/282",[539,3.016,1459,3.721,1561,7.366,1562,7.366,1563,6.005]],["t/284",[4,1.551,5,0.792,6,1.3,9,1.205,20,3.26,30,2.277,32,2.873,37,3.011,92,2.399,96,2.536,107,2.975,123,4.214,136,1.975,231,2.873,285,2.975,421,3.704,438,3.213,468,3.516,474,3.93,533,4.593,645,5.197,779,3.516,899,4.214,924,4.214,975,2.611,979,4.214,1144,3.93,1337,3.173,1433,4.214,1534,4.214,1564,5.169,1565,5.169,1566,5.169,1567,5.169]],["t/286",[539,3.016,1459,3.721,1547,6.546,1563,6.005,1568,7.366]],["t/288",[4,0.664,5,0.551,6,1.074,8,1.271,9,1.115,10,3.642,27,2.253,30,1.597,32,3.516,37,2.787,41,2.165,51,2.718,52,2.165,65,1.887,66,2.955,78,1.729,82,1.95,92,1.682,96,1.778,107,3.069,136,1.385,140,1.62,149,2.253,201,1.297,203,1.354,205,1.993,210,1.243,282,3.315,285,2.086,300,2.616,335,2.253,342,2.597,349,2.165,361,2.165,362,2.352,438,2.253,450,2.014,456,3.221,457,2.756,463,3.221,470,2.955,477,2.955,482,3.221,483,3.221,495,1.638,631,2.955,735,1.948,750,1.887,775,2.465,843,2.165,987,1.948,999,2.955,1085,3.221,1139,2.756,1144,4.811,1239,3.221,1264,3.221,1318,2.352,1319,2.597,1328,2.756,1329,2.756,1330,2.756,1337,2.475,1365,2.955,1373,2.756,1451,2.955,1469,3.221,1471,3.221,1487,3.221,1507,2.756,1534,2.955,1569,3.221,1570,3.624,1571,5.333,1572,5.333,1573,3.624,1574,3.624,1575,3.624,1576,3.624]],["t/290",[4,0.844,5,0.477,6,0.783,9,0.813,10,2.655,12,2.032,23,2.531,48,2.755,51,2.314,55,2.265,65,3.296,82,1.686,96,2.263,97,2.2,104,2.867,107,3.643,108,2.563,133,2.755,135,4.813,136,1.762,140,1.401,144,3.198,201,1.65,203,1.723,216,1.616,222,2.032,300,2.263,305,3.507,349,2.755,362,2.993,418,2.755,449,3.76,450,2.563,467,3.507,477,3.76,535,3.76,614,4.305,690,4.536,707,3.403,786,2.755,1145,3.507,1212,3.507,1318,2.993,1319,5.179,1337,2.141,1341,3.305,1373,3.507,1411,4.098,1412,4.098,1413,4.098,1485,4.098,1577,4.612]],["t/292",[2,4.39,18,1.122,48,3.66,65,3.19,138,4.994,140,1.861,170,4.994,222,3.358,368,3.006,651,5.444,725,3.976,795,5.463,1053,4.167,1337,2.844,1433,4.994,1578,6.126,1579,6.126,1580,6.126,1581,6.126,1582,6.126,1583,6.126,1584,6.126,1585,6.126]],["t/294",[55,2.393,57,4.55,104,4.159,144,4.064,148,5.453,182,5.086,300,3.282,575,5.453,614,4.55,1029,5.944,1145,5.086,1299,3.718,1419,6.558]],["t/296",[1459,3.76,1481,6.067,1563,6.067,1586,7.442]],["t/298",[6,1.261,9,1.31,27,3.655,32,3.267,51,2.977,140,2.681,175,6.056,210,2.016,505,6.601,552,5.648,796,5.063,1323,6.601,1428,5.224,1569,5.224,1587,5.879,1588,5.879]],["t/300",[4,0.946,5,0.792,6,1.16,8,1.039,9,0.911,18,0.946,23,2.067,37,3.011,78,2.466,92,2.399,107,2.975,140,1.571,162,3.516,165,2.779,194,2.476,210,1.773,222,2.277,235,2.779,300,2.536,361,3.088,418,3.088,433,3.704,435,3.213,437,3.355,725,3.355,1139,5.197,1295,4.214,1308,4.214,1328,3.93,1329,3.93,1330,5.197,1337,3.173,1451,4.214,1513,4.593,1589,5.169,1590,5.169,1591,5.169]],["t/302",[3,3.586,415,5.388,989,6.129]]],"invertedIndex":[["",{"_index":193,"t":{"8":{"position":[[79,1],[115,1],[209,1],[326,2],[374,2],[436,1],[495,2],[506,1],[515,1],[618,1],[693,2],[777,2],[839,1],[898,2],[909,1]]},"13":{"position":[[163,1],[252,1],[265,1],[282,1]]},"17":{"position":[[77,1],[113,1],[205,1],[322,2],[370,1],[390,2],[401,1],[410,1],[511,1],[586,2],[670,1],[690,2],[701,1]]},"22":{"position":[[41,2],[159,2],[288,2],[460,2],[582,2]]},"24":{"position":[[161,1],[311,1],[324,1],[341,1]]},"26":{"position":[[154,1],[326,1],[348,1],[400,2],[403,1],[405,2],[484,2],[564,2],[575,1],[584,1],[769,1],[791,1],[845,2],[848,1],[850,2],[929,2],[1009,2],[1020,1]]},"30":{"position":[[78,1],[114,1],[207,1],[324,2],[372,1],[393,2],[404,1],[413,1],[515,1],[590,2],[674,1],[695,2],[706,1]]},"35":{"position":[[264,1],[277,1],[294,1]]},"39":{"position":[[85,1],[223,1],[225,1],[314,6],[346,1],[372,1],[374,2],[392,1],[512,2],[560,1],[584,2],[595,1],[604,1],[760,1],[762,1],[851,6],[883,1],[909,1],[911,2],[929,1],[1007,2],[1091,1],[1115,2],[1126,1]]},"49":{"position":[[64,1],[159,1],[231,1],[240,1],[353,2],[435,2],[438,2],[441,1],[458,1],[539,1],[548,1],[619,2],[737,2],[740,2],[743,1]]},"51":{"position":[[114,1]]},"55":{"position":[[256,1],[265,1],[467,1]]},"59":{"position":[[107,1],[254,1],[386,1],[416,1],[577,1],[692,1],[725,1],[892,1],[924,1],[1089,1],[1127,1],[1309,1]]},"61":{"position":[[28,2],[101,2],[264,2],[348,2],[588,2],[664,2],[686,2],[784,2],[1062,2],[1343,2],[1597,2],[1820,2],[2233,2],[2455,2],[2571,2],[2877,2],[3212,2],[3512,2],[3612,2],[3870,2],[4127,2],[4387,2],[4649,2],[4769,2],[5237,2],[5364,2],[5459,2],[5563,2],[5661,2],[5787,2],[6187,2],[6322,2],[6458,2],[6874,2],[7016,2],[7145,2],[7550,2],[7683,2],[7776,2],[7869,2],[8034,1],[8056,2],[8187,2],[8323,2]]},"63":{"position":[[69,1],[571,1],[677,1],[709,3],[713,1],[772,1],[844,1],[887,3],[891,1],[1049,1],[1121,1],[1160,3],[1164,1]]},"65":{"position":[[93,1],[250,1],[265,1],[301,1],[318,2],[321,1],[349,2],[352,2],[355,1],[357,2],[373,3],[377,2],[380,4],[429,3],[433,3],[437,1],[446,1],[621,1],[636,1],[672,1],[689,2],[692,1],[720,2],[723,2],[726,1],[728,2],[744,3],[748,2],[751,4],[800,3],[804,3],[808,1],[856,1],[1282,1]]},"69":{"position":[[241,1],[250,1],[266,1],[268,2],[316,2],[345,1],[362,2],[365,1]]},"73":{"position":[[67,1],[103,1],[185,1],[302,2],[350,1],[407,1],[430,2],[451,1],[460,1],[551,1],[626,2],[710,1],[767,1],[790,2],[811,1]]},"76":{"position":[[412,1],[425,1],[627,1],[674,1],[975,1],[988,1]]},"78":{"position":[[25,2],[108,2],[199,2],[287,2]]},"80":{"position":[[151,1]]},"82":{"position":[[144,1],[312,1],[330,1],[371,1],[384,2],[387,1],[438,2],[441,3],[463,1],[480,2],[483,1],[519,2],[522,4],[534,2],[628,2],[690,4],[695,1],[704,1],[885,1],[903,1],[946,1],[959,2],[962,1],[1015,2],[1018,3],[1040,1],[1057,2],[1060,1],[1096,2],[1099,4],[1111,2],[1205,2],[1267,4],[1272,1]]},"86":{"position":[[78,1],[114,1],[207,1],[324,2],[372,1],[393,2],[404,1],[413,1],[515,1],[590,2],[674,1],[695,2],[706,1]]},"91":{"position":[[162,1],[261,1],[274,1],[291,1]]},"95":{"position":[[66,1],[102,1],[215,1],[249,1],[391,2],[439,1],[452,2],[455,1],[523,2],[580,1],[589,1],[711,1],[745,1],[845,2],[929,1],[942,2],[945,1],[1013,2],[1070,1]]},"98":{"position":[[17,1],[26,1],[36,1],[44,1],[55,1],[68,1],[82,1],[98,1],[115,1],[476,1],[488,1]]},"100":{"position":[[26,2],[95,2]]},"102":{"position":[[150,1]]},"104":{"position":[[143,1],[299,1],[316,1],[357,2],[360,1],[396,2],[489,1],[516,1],[525,1],[694,1],[711,1],[754,2],[757,1],[793,2],[886,1],[913,1]]},"108":{"position":[[73,1],[109,1],[197,1],[314,2],[362,1],[378,2],[389,1],[398,1],[495,1],[570,2],[654,1],[670,2],[681,1]]},"111":{"position":[[181,1],[192,1]]},"113":{"position":[[123,1],[136,1],[153,1]]},"117":{"position":[[131,1],[333,1],[335,1],[374,1],[433,1],[450,1],[452,2],[485,1],[487,1],[525,1],[574,1],[576,2],[594,1],[701,2],[749,1],[826,2],[847,1],[856,1],[1076,1],[1078,1],[1117,1],[1176,1],[1193,1],[1195,2],[1228,1],[1230,1],[1268,1],[1317,1],[1319,2],[1337,1],[1415,2],[1499,1],[1576,2],[1597,1]]},"130":{"position":[[657,1],[678,1]]},"132":{"position":[[101,1],[184,1],[261,1],[338,1],[441,1],[564,1]]},"134":{"position":[[93,1],[217,1],[300,2],[303,2],[453,1],[508,2],[511,2],[635,1],[752,2],[755,2],[925,1],[1137,1],[1293,1],[1413,1],[1527,1],[1668,1],[1779,1],[1824,1],[1941,1],[2178,1],[2214,1],[2237,1],[2528,1],[2630,1],[2774,1]]},"136":{"position":[[219,1],[235,2],[261,1],[288,3],[305,1],[322,1],[331,1],[431,2],[481,1],[586,2],[589,2],[599,2],[602,1]]},"138":{"position":[[76,2],[99,1],[129,1],[131,2],[212,2],[269,2],[288,1],[318,1],[320,2],[401,2],[455,2],[508,2],[527,1],[557,1],[559,2],[728,2],[828,2],[933,2],[1041,1],[1055,1],[1071,1]]},"142":{"position":[[155,1],[164,1],[171,3],[175,1],[195,2],[205,2],[208,1],[236,1],[259,1],[285,1],[287,2],[290,2],[293,1],[314,1],[332,2],[381,1],[450,1],[459,1],[466,3],[470,1],[490,2],[500,2],[503,1],[531,1],[554,1],[580,1],[582,2],[585,2],[588,1],[609,1],[627,2],[676,1],[904,1],[913,1],[946,3],[950,2],[970,3],[974,2],[993,2],[1011,2],[1014,1],[1042,1],[1067,1],[1093,1],[1095,2],[1098,2],[1101,1],[1125,1],[1165,1],[1180,2],[1229,1],[1311,1],[1320,1],[1353,3],[1357,2],[1377,3],[1381,2],[1400,2],[1418,2],[1421,1],[1449,1],[1474,1],[1500,1],[1502,2],[1505,2],[1508,1],[1532,1],[1572,1],[1587,2],[1636,1]]},"150":{"position":[[211,1],[237,1],[312,1]]},"168":{"position":[[33,2],[49,2]]},"170":{"position":[[31,1],[103,1],[112,1],[225,2],[307,2],[310,2],[313,1],[400,1],[481,1],[490,1],[561,2],[679,2],[682,2],[685,1]]},"172":{"position":[[363,2],[563,2]]},"174":{"position":[[100,1],[157,2],[244,1],[292,3],[296,1]]},"177":{"position":[[91,1],[293,1],[295,1],[334,1],[393,1],[410,1],[412,2],[445,1],[447,1],[485,1],[534,1],[536,2],[554,1],[563,1],[636,3],[715,2],[735,2],[738,1]]},"185":{"position":[[1172,1],[1194,2],[1197,1],[1216,3],[1227,2],[1263,1],[1272,1],[1293,1],[1320,1],[1322,1],[1338,1],[1340,1],[1342,1],[1344,1]]},"189":{"position":[[69,1],[141,1],[216,2],[264,3],[268,1]]},"191":{"position":[[69,1],[141,1],[175,1],[235,3],[278,2],[355,3],[359,1]]},"193":{"position":[[278,1],[335,2],[368,1],[397,2],[470,1],[548,1],[582,1],[642,3],[659,1],[693,2],[696,1],[714,1],[759,2],[879,1],[906,1],[908,2],[911,3],[1003,3],[1007,1]]},"196":{"position":[[1138,3],[1181,1],[1218,1],[1220,1],[1222,3],[1235,1],[1325,2],[1341,1],[1377,1],[1413,2],[1416,1],[1418,2],[1421,3],[1456,1],[1516,1],[1518,1],[1520,3],[1533,1],[1614,2],[1630,1],[1666,1],[1702,2],[1705,1],[1707,2]]},"198":{"position":[[183,3],[322,2],[357,2],[444,1],[1040,1]]},"200":{"position":[[310,1],[328,1],[357,2],[389,1],[418,2],[449,1],[479,1],[497,2],[500,1],[560,2],[563,4],[575,1],[658,1],[660,1],[684,2],[687,1],[790,2],[824,2],[834,2],[837,1],[1082,1],[1095,2],[1119,2],[1122,1],[1225,2],[1259,2],[1282,1],[1365,1],[1367,1],[1386,2],[1389,1],[1674,1],[1687,2],[1690,1],[1699,1],[1759,2],[1804,2],[1807,2],[1830,1],[1913,1],[1915,1],[2083,2],[2086,2],[2106,2]]},"202":{"position":[[155,1],[207,1],[220,2],[223,1],[238,1],[304,1],[331,3],[335,2]]},"205":{"position":[[367,1],[432,2],[516,3],[520,1],[576,2],[579,1],[621,1],[635,2],[714,2],[717,1]]},"217":{"position":[[322,1],[324,1],[399,2],[430,3],[434,2]]},"229":{"position":[[535,2],[675,2],[678,2],[804,2]]},"233":{"position":[[180,1],[246,1],[268,2],[290,1],[344,2],[347,2],[350,2],[393,2]]},"237":{"position":[[253,2]]},"239":{"position":[[207,2],[263,2]]}}}],["0",{"_index":433,"t":{"57":{"position":[[709,2],[779,2],[829,2],[893,2],[965,2],[1217,2],[1443,1],[1479,2],[1550,2],[1585,1],[1616,2],[1683,2]]},"76":{"position":[[809,1]]},"217":{"position":[[345,3],[371,3],[396,2]]},"233":{"position":[[334,3]]},"300":{"position":[[118,1]]}}}],["0.31.0",{"_index":1445,"t":{"237":{"position":[[209,6]]}}}],["0.38",{"_index":1570,"t":{"288":{"position":[[43,5]]}}}],["0.42.2",{"_index":1552,"t":{"280":{"position":[[554,6]]}}}],["0.53.0",{"_index":1525,"t":{"264":{"position":[[531,9]]}}}],["0.6.x",{"_index":1446,"t":{"239":{"position":[[16,6]]}}}],["0.xx",{"_index":1518,"t":{"264":{"position":[[337,4]]}}}],["007cbf",{"_index":833,"t":{"117":{"position":[[564,9],[1307,9]]},"177":{"position":[[524,9]]}}}],["1",{"_index":1273,"t":{"200":{"position":[[2052,2]]}}}],["1.0.0",{"_index":1526,"t":{"264":{"position":[[558,9]]}}}],["10",{"_index":832,"t":{"117":{"position":[[544,3],[1287,3]]},"177":{"position":[[504,3]]}}}],["100",{"_index":202,"t":{"8":{"position":[[297,4],[664,4]]},"17":{"position":[[293,4],[557,4]]},"30":{"position":[[295,4],[561,4]]},"53":{"position":[[91,7],[107,7]]},"73":{"position":[[273,4],[372,4],[597,4],[732,4]]},"86":{"position":[[295,4],[561,4]]},"95":{"position":[[362,4],[476,4],[816,4],[966,4]]},"108":{"position":[[285,4],[541,4]]},"111":{"position":[[27,3]]},"189":{"position":[[187,4]]},"191":{"position":[[206,4]]},"193":{"position":[[613,4]]}}}],["12",{"_index":1046,"t":{"168":{"position":[[36,2]]}}}],["122.4",{"_index":297,"t":{"39":{"position":[[480,6],[975,6]]},"49":{"position":[[321,6],[587,6]]},"82":{"position":[[563,6],[1140,6]]},"104":{"position":[[451,6],[848,6]]},"117":{"position":[[435,6],[669,6],[1178,6],[1383,6]]},"136":{"position":[[399,6]]},"142":{"position":[[316,6],[611,6],[1127,6],[1534,6]]},"170":{"position":[[193,6],[529,6]]},"177":{"position":[[395,6]]}}}],["122.45",{"_index":1074,"t":{"177":{"position":[[602,7]]}}}],["14",{"_index":299,"t":{"39":{"position":[[509,2],[1004,2]]},"49":{"position":[[350,2],[616,2]]},"117":{"position":[[698,2],[1412,2]]},"136":{"position":[[428,2]]},"170":{"position":[[222,2],[558,2]]},"177":{"position":[[633,2]]},"266":{"position":[[18,3]]}}}],["140",{"_index":1588,"t":{"298":{"position":[[186,6]]}}}],["15.4",{"_index":1444,"t":{"237":{"position":[[171,4]]}}}],["15.4.x",{"_index":1566,"t":{"284":{"position":[[249,9]]}}}],["16",{"_index":645,"t":{"63":{"position":[[1401,2]]},"250":{"position":[[18,3]]},"272":{"position":[[177,2]]},"284":{"position":[[138,2],[187,3]]}}}],["16.3",{"_index":1047,"t":{"168":{"position":[[52,5]]},"272":{"position":[[197,4]]}}}],["17",{"_index":1586,"t":{"296":{"position":[[10,3]]}}}],["19",{"_index":1562,"t":{"282":{"position":[[22,3]]}}}],["1:1",{"_index":158,"t":{"6":{"position":[[190,3]]},"244":{"position":[[468,3]]}}}],["2",{"_index":29,"t":{"2":{"position":[[451,1]]},"63":{"position":[[2887,1]]}}}],["20",{"_index":1428,"t":{"233":{"position":[[322,3]]},"298":{"position":[[96,2]]}}}],["2017",{"_index":1563,"t":{"282":{"position":[[26,4]]},"286":{"position":[[25,4]]},"296":{"position":[[14,4]]}}}],["2018",{"_index":1532,"t":{"270":{"position":[[21,4]]},"274":{"position":[[20,4]]},"278":{"position":[[24,4]]}}}],["2019",{"_index":1506,"t":{"258":{"position":[[22,4]]},"262":{"position":[[22,4]]},"264":{"position":[[301,4]]},"266":{"position":[[22,4]]}}}],["2020",{"_index":1483,"t":{"246":{"position":[[22,4]]},"250":{"position":[[22,4]]},"254":{"position":[[21,4]]}}}],["2022",{"_index":1468,"t":{"244":{"position":[[21,4]]}}}],["2023",{"_index":1462,"t":{"242":{"position":[[22,4]]}}}],["219k",{"_index":1475,"t":{"244":{"position":[[366,4]]}}}],["22",{"_index":454,"t":{"57":{"position":[[1513,2]]}}}],["24",{"_index":453,"t":{"57":{"position":[[1482,4],[1553,4]]}}}],["240px",{"_index":802,"t":{"98":{"position":[[830,5]]}}}],["27",{"_index":1482,"t":{"246":{"position":[[18,3]]}}}],["27th",{"_index":1568,"t":{"286":{"position":[[19,5]]}}}],["3.5",{"_index":206,"t":{"8":{"position":[[322,3],[689,3]]},"17":{"position":[[318,3],[582,3]]},"30":{"position":[[320,3],[586,3]]},"73":{"position":[[298,3],[622,3]]},"86":{"position":[[320,3],[586,3]]},"95":{"position":[[387,3],[841,3]]},"108":{"position":[[310,3],[566,3]]},"189":{"position":[[212,3]]},"191":{"position":[[231,3]]},"193":{"position":[[638,3]]}}}],["30",{"_index":1461,"t":{"242":{"position":[[19,2]]},"258":{"position":[[18,3]]}}}],["31",{"_index":1509,"t":{"262":{"position":[[18,3]]}}}],["37.78",{"_index":1075,"t":{"177":{"position":[[620,6]]}}}],["37.8",{"_index":298,"t":{"39":{"position":[[497,5],[992,5]]},"49":{"position":[[338,5],[604,5]]},"117":{"position":[[442,7],[686,5],[1185,7],[1400,5]]},"136":{"position":[[416,5]]},"142":{"position":[[323,8],[618,8],[1134,8],[1541,8]]},"170":{"position":[[210,5],[546,5]]},"177":{"position":[[402,7]]}}}],["3d",{"_index":1093,"t":{"181":{"position":[[416,2],[495,2]]},"272":{"position":[[513,2]]}}}],["4",{"_index":1467,"t":{"244":{"position":[[18,2]]}}}],["4.1",{"_index":1511,"t":{"264":{"position":[[55,3]]}}}],["4.1.x",{"_index":1515,"t":{"264":{"position":[[210,5]]}}}],["40",{"_index":204,"t":{"8":{"position":[[312,3],[679,3]]},"17":{"position":[[308,3],[572,3]]},"30":{"position":[[310,3],[576,3]]},"73":{"position":[[288,3],[612,3]]},"86":{"position":[[310,3],[576,3]]},"95":{"position":[[377,3],[831,3]]},"108":{"position":[[300,3],[556,3]]},"189":{"position":[[202,3]]},"191":{"position":[[221,3]]},"193":{"position":[[628,3]]},"233":{"position":[[339,4]]}}}],["40.7",{"_index":962,"t":{"142":{"position":[[1171,8],[1578,8]]}}}],["40.7467898",{"_index":1165,"t":{"193":{"position":[[498,12]]}}}],["40.7661",{"_index":1425,"t":{"233":{"position":[[280,9]]}}}],["400",{"_index":350,"t":{"49":{"position":[[384,5],[650,5]]},"170":{"position":[[256,5],[592,5]]},"233":{"position":[[227,6]]}}}],["41.268014439447484",{"_index":1430,"t":{"233":{"position":[[438,19]]}}}],["41.7661",{"_index":1427,"t":{"233":{"position":[[301,10]]}}}],["4e3fc8",{"_index":296,"t":{"39":{"position":[[362,9],[899,9]]}}}],["5",{"_index":1160,"t":{"193":{"position":[[412,1],[511,2]]},"270":{"position":[[18,2]]}}}],["5.0",{"_index":1510,"t":{"264":{"position":[[28,3]]}}}],["5.0.x",{"_index":1514,"t":{"264":{"position":[[200,5]]}}}],["57k",{"_index":1476,"t":{"244":{"position":[[374,3]]}}}],["6",{"_index":1502,"t":{"254":{"position":[[18,2]]}}}],["6.0",{"_index":1497,"t":{"252":{"position":[[4,3]]}}}],["60",{"_index":458,"t":{"57":{"position":[[1651,2]]},"219":{"position":[[122,3]]}}}],["600",{"_index":348,"t":{"49":{"position":[[371,4],[637,4]]},"170":{"position":[[243,4],[579,4]]},"233":{"position":[[214,4]]}}}],["7",{"_index":1536,"t":{"272":{"position":[[233,1],[265,2]]}}}],["7.209231188444142",{"_index":1431,"t":{"233":{"position":[[464,18]]}}}],["72.9876",{"_index":1426,"t":{"233":{"position":[[292,8]]}}}],["73.48760000000007",{"_index":1429,"t":{"233":{"position":[[409,18]]}}}],["73.9876",{"_index":1424,"t":{"233":{"position":[[271,8]]}}}],["74",{"_index":961,"t":{"142":{"position":[[1167,3],[1574,3]]}}}],["74.0122106",{"_index":1164,"t":{"193":{"position":[[486,11]]}}}],["8",{"_index":973,"t":{"150":{"position":[[115,4]]}}}],["8.9.18",{"_index":1300,"t":{"205":{"position":[[1383,9]]}}}],["85",{"_index":443,"t":{"57":{"position":[[1220,4],[1619,4],[1686,4]]},"219":{"position":[[114,2]]}}}],["__super_secret_token__",{"_index":1217,"t":{"196":{"position":[[1898,23]]}}}],["_mapcontext",{"_index":1366,"t":{"217":{"position":[[52,11]]}}}],["abov",{"_index":620,"t":{"63":{"position":[[92,6]]},"183":{"position":[[259,5]]},"185":{"position":[[207,6]]}}}],["abus",{"_index":1182,"t":{"196":{"position":[[285,7]]}}}],["accept",{"_index":42,"t":{"2":{"position":[[764,9]]}}}],["access",{"_index":199,"t":{"8":{"position":[[250,6]]},"17":{"position":[[246,6]]},"26":{"position":[[51,10]]},"30":{"position":[[248,6]]},"39":{"position":[[433,6]]},"49":{"position":[[274,6]]},"63":{"position":[[1207,6]]},"65":{"position":[[23,10],[1201,6]]},"69":{"position":[[166,6]]},"73":{"position":[[226,6]]},"82":{"position":[[41,10]]},"86":{"position":[[248,6]]},"95":{"position":[[315,6]]},"104":{"position":[[40,10]]},"108":{"position":[[238,6]]},"162":{"position":[[64,6]]},"170":{"position":[[146,6]]},"183":{"position":[[285,6],[310,6],[465,6]]},"219":{"position":[[15,6]]}}}],["access_token=token",{"_index":1116,"t":{"183":{"position":[[1137,19]]}}}],["accommod",{"_index":1463,"t":{"242":{"position":[[37,11]]}}}],["accord",{"_index":848,"t":{"126":{"position":[[387,9],[487,9],[602,9],[698,9],[800,9],[906,9],[1002,9],[1102,9],[1202,9],[1296,9],[1403,9],[1506,9],[1609,9],[1714,9],[1816,9],[1925,9]]}}}],["account",{"_index":1501,"t":{"252":{"position":[[180,7]]}}}],["accpt",{"_index":472,"t":{"59":{"position":[[502,5],[814,5],[1012,5],[1226,5]]}}}],["achiev",{"_index":180,"t":{"6":{"position":[[623,8]]}}}],["activ",{"_index":252,"t":{"22":{"position":[[517,6]]},"26":{"position":[[408,8],[853,8]]},"148":{"position":[[86,8]]},"150":{"position":[[25,6]]}}}],["actual",{"_index":583,"t":{"61":{"position":[[5060,8],[6085,8],[6767,8],[7446,8]]}}}],["ad",{"_index":335,"t":{"45":{"position":[[250,5]]},"138":{"position":[[871,5]]},"154":{"position":[[241,5],[307,5]]},"198":{"position":[[1147,5]]},"248":{"position":[[319,5],[520,5]]},"260":{"position":[[43,5]]},"268":{"position":[[62,5]]},"288":{"position":[[291,5]]}}}],["add",{"_index":796,"t":{"98":{"position":[[437,3]]},"138":{"position":[[603,4]]},"172":{"position":[[182,3]]},"196":{"position":[[572,3],[1081,3]]},"209":{"position":[[0,3]]},"242":{"position":[[110,4]]},"260":{"position":[[211,3]]},"298":{"position":[[63,3],[117,3],[161,3]]}}}],["add/remov",{"_index":313,"t":{"43":{"position":[[73,10]]},"119":{"position":[[320,10]]}}}],["added/modifi",{"_index":990,"t":{"154":{"position":[[129,15],[450,15]]}}}],["addit",{"_index":535,"t":{"61":{"position":[[931,10],[1210,10],[2099,10],[2745,10],[3077,10],[3388,10],[3738,10],[3994,10],[4252,10],[4514,10]]},"239":{"position":[[448,10]]},"290":{"position":[[120,10]]}}}],["address",{"_index":1324,"t":{"211":{"position":[[381,7]]},"244":{"position":[[70,9]]}}}],["adher",{"_index":1040,"t":{"164":{"position":[[25,6]]}}}],["adjust",{"_index":1080,"t":{"179":{"position":[[140,6]]}}}],["advantag",{"_index":1307,"t":{"207":{"position":[[243,10]]}}}],["affect",{"_index":501,"t":{"59":{"position":[[1827,8]]},"152":{"position":[[168,8]]},"154":{"position":[[523,9]]}}}],["afterward",{"_index":1138,"t":{"187":{"position":[[198,11]]}}}],["again",{"_index":654,"t":{"63":{"position":[[1678,6]]},"198":{"position":[[117,5],[698,6]]}}}],["against",{"_index":985,"t":{"152":{"position":[[116,7]]}}}],["agnost",{"_index":756,"t":{"76":{"position":[[1174,8]]}}}],["alber",{"_index":381,"t":{"55":{"position":[[573,6],[580,11],[828,6]]}}}],["alia",{"_index":1314,"t":{"209":{"position":[[221,5]]}}}],["align",{"_index":150,"t":{"6":{"position":[[52,5]]},"76":{"position":[[455,6],[507,6],[1018,6],[1119,6]]},"179":{"position":[[220,7]]},"215":{"position":[[118,7]]}}}],["allow",{"_index":285,"t":{"39":{"position":[[15,6]]},"55":{"position":[[902,5]]},"63":{"position":[[3184,7]]},"117":{"position":[[15,6]]},"142":{"position":[[16,6]]},"185":{"position":[[174,7]]},"196":{"position":[[1034,6]]},"264":{"position":[[578,5]]},"284":{"position":[[78,5]]},"288":{"position":[[709,5]]}}}],["alon",{"_index":1575,"t":{"288":{"position":[[861,5]]}}}],["along",{"_index":619,"t":{"63":{"position":[[21,5]]},"272":{"position":[[456,5]]}}}],["alongsid",{"_index":1523,"t":{"264":{"position":[[423,9]]}}}],["altern",{"_index":1051,"t":{"170":{"position":[[343,12]]},"196":{"position":[[1842,14]]},"276":{"position":[[182,11]]}}}],["alway",{"_index":127,"t":{"4":{"position":[[1148,6]]},"179":{"position":[[213,6]]},"219":{"position":[[31,6]]}}}],["amount",{"_index":1357,"t":{"215":{"position":[[224,6]]}}}],["analyt",{"_index":67,"t":{"4":{"position":[[145,9]]}}}],["anchor",{"_index":741,"t":{"76":{"position":[[155,6],[222,6]]},"80":{"position":[[172,6]]},"98":{"position":[[0,7],[269,6],[747,6]]}}}],["anchor=\"bottom",{"_index":737,"t":{"73":{"position":[[391,15],[751,15]]},"95":{"position":[[495,15],[985,15]]}}}],["angl",{"_index":753,"t":{"76":{"position":[[824,5]]}}}],["anim",{"_index":524,"t":{"61":{"position":[[533,10],[4806,8],[5824,8],[6495,8],[7182,8]]},"177":{"position":[[922,9]]},"200":{"position":[[877,9]]}}}],["anoth",{"_index":575,"t":{"61":{"position":[[4722,8],[4843,8],[5312,8],[5740,8],[5867,8],[6268,8],[6409,8],[6546,8],[6963,8],[7097,8],[7227,8],[7633,8]]},"185":{"position":[[79,7]]},"294":{"position":[[39,7]]}}}],["anywher",{"_index":499,"t":{"59":{"position":[[1727,8]]}}}],["api",{"_index":78,"t":{"4":{"position":[[309,4]]},"6":{"position":[[62,3],[219,3]]},"22":{"position":[[77,3],[195,3],[324,3]]},"63":{"position":[[1299,3]]},"154":{"position":[[120,4],[441,4]]},"207":{"position":[[135,4]]},"211":{"position":[[475,3]]},"217":{"position":[[30,4]]},"237":{"position":[[6,3]]},"242":{"position":[[53,3]]},"244":{"position":[[540,4]]},"248":{"position":[[424,4]]},"260":{"position":[[102,4]]},"268":{"position":[[121,4]]},"288":{"position":[[350,4]]},"300":{"position":[[76,3]]}}}],["app",{"_index":196,"t":{"8":{"position":[[203,5],[612,5]]},"17":{"position":[[199,5],[505,5]]},"26":{"position":[[320,5],[763,5]]},"30":{"position":[[201,5],[509,5]]},"39":{"position":[[22,4],[386,5],[923,5]]},"49":{"position":[[225,5],[533,5]]},"63":{"position":[[671,5],[838,5],[1115,5]]},"65":{"position":[[244,5],[615,5]]},"73":{"position":[[179,5],[545,5]]},"82":{"position":[[306,5],[879,5]]},"86":{"position":[[201,5],[509,5]]},"95":{"position":[[209,5],[705,5]]},"104":{"position":[[293,5],[688,5]]},"108":{"position":[[191,5],[489,5]]},"117":{"position":[[22,4],[588,5],[1331,5]]},"136":{"position":[[316,5]]},"170":{"position":[[97,5],[475,5]]},"172":{"position":[[673,3]]},"174":{"position":[[238,5]]},"177":{"position":[[548,5]]},"183":{"position":[[886,4],[1105,4]]},"189":{"position":[[21,3],[135,5]]},"191":{"position":[[21,3],[135,5]]},"193":{"position":[[542,5]]},"196":{"position":[[134,4],[626,3]]},"198":{"position":[[36,4]]},"205":{"position":[[361,5],[615,5]]},"213":{"position":[[400,4]]},"239":{"position":[[816,3]]}}}],["app.tsx",{"_index":346,"t":{"49":{"position":[[144,7],[443,7]]},"63":{"position":[[1034,7]]},"170":{"position":[[16,7],[385,7]]},"172":{"position":[[750,7],[797,7]]},"174":{"position":[[85,7]]}}}],["append",{"_index":331,"t":{"45":{"position":[[118,8]]}}}],["appli",{"_index":220,"t":{"11":{"position":[[46,7]]},"20":{"position":[[46,7]]},"33":{"position":[[46,7]]},"76":{"position":[[318,5],[1279,7]]},"89":{"position":[[46,7]]},"98":{"position":[[547,7],[948,7]]},"111":{"position":[[128,7]]}}}],["applic",{"_index":72,"t":{"4":{"position":[[226,13]]},"61":{"position":[[5086,11],[6111,11],[6793,11],[7472,11]]},"63":{"position":[[1946,11]]},"69":{"position":[[271,11]]},"187":{"position":[[51,11],[285,11],[448,11],[530,11]]},"191":{"position":[[374,11]]},"196":{"position":[[50,11]]},"200":{"position":[[8,11],[1474,11]]},"211":{"position":[[651,12]]},"215":{"position":[[352,11]]},"223":{"position":[[255,12]]},"229":{"position":[[376,11]]},"231":{"position":[[413,12]]},"239":{"position":[[741,13]]},"280":{"position":[[393,12]]}}}],["application'",{"_index":1325,"t":{"211":{"position":[[394,13]]},"223":{"position":[[321,13]]}}}],["approach",{"_index":1313,"t":{"207":{"position":[[528,8]]}}}],["appropri",{"_index":1477,"t":{"244":{"position":[[505,12]]}}}],["approv",{"_index":984,"t":{"152":{"position":[[69,9]]}}}],["arab",{"_index":674,"t":{"63":{"position":[[2470,6]]}}}],["architectur",{"_index":1471,"t":{"244":{"position":[[137,12]]},"288":{"position":[[963,12]]}}}],["argument",{"_index":1346,"t":{"213":{"position":[[1005,8]]}}}],["around",{"_index":449,"t":{"57":{"position":[[1396,6]]},"280":{"position":[[449,6]]},"290":{"position":[[309,6]]}}}],["array",{"_index":333,"t":{"45":{"position":[[152,6]]},"59":{"position":[[1600,5]]},"130":{"position":[[66,5],[271,5],[324,5],[435,5]]}}}],["asid",{"_index":351,"t":{"51":{"position":[[0,5]]}}}],["assign",{"_index":142,"t":{"4":{"position":[[1458,9]]},"43":{"position":[[274,9]]},"119":{"position":[[523,9]]}}}],["associ",{"_index":652,"t":{"63":{"position":[[1596,10]]},"65":{"position":[[1303,10]]}}}],["attach",{"_index":751,"t":{"76":{"position":[[689,6]]},"154":{"position":[[542,9]]}}}],["attempt",{"_index":412,"t":{"55":{"position":[[1289,10]]},"119":{"position":[[165,7]]},"248":{"position":[[466,9]]}}}],["attribut",{"_index":211,"t":{"8":{"position":[[397,11],[800,11]]},"15":{"position":[[0,11]]}}}],["attributioncontrol",{"_index":191,"t":{"8":{"position":[[46,18],[152,20],[438,19],[552,20],[841,19]]},"13":{"position":[[130,18]]},"248":{"position":[[384,18]]}}}],["attributioncontrol={fals",{"_index":212,"t":{"8":{"position":[[409,26],[812,26]]}}}],["authent",{"_index":1131,"t":{"185":{"position":[[1025,15]]}}}],["author",{"_index":1135,"t":{"185":{"position":[[1295,16]]}}}],["auto",{"_index":364,"t":{"53":{"position":[[159,6]]},"76":{"position":[[427,7],[444,6],[555,4],[990,7],[1007,6],[1201,4]]},"217":{"position":[[126,4]]},"256":{"position":[[105,4]]},"260":{"position":[[161,6]]}}}],["automat",{"_index":748,"t":{"76":{"position":[[560,13]]},"187":{"position":[[151,13]]},"196":{"position":[[1723,13]]},"231":{"position":[[545,13]]}}}],["avail",{"_index":380,"t":{"55":{"position":[[547,9]]},"138":{"position":[[632,10]]}}}],["avoid",{"_index":306,"t":{"41":{"position":[[184,5]]},"63":{"position":[[2049,5]]},"119":{"position":[[234,5]]},"225":{"position":[[149,8]]},"256":{"position":[[282,5]]}}}],["away",{"_index":441,"t":{"57":{"position":[[1183,4]]}}}],["babel",{"_index":1535,"t":{"272":{"position":[[227,5],[259,5]]}}}],["back",{"_index":1241,"t":{"198":{"position":[[1153,5]]},"239":{"position":[[657,4],[863,4]]}}}],["background",{"_index":255,"t":{"22":{"position":[[639,10]]},"126":{"position":[[370,10]]},"237":{"position":[[187,11]]}}}],["backgroundlay",{"_index":847,"t":{"126":{"position":[[324,16]]}}}],["bad",{"_index":1403,"t":{"229":{"position":[[538,4]]}}}],["base",{"_index":189,"t":{"8":{"position":[[31,4]]},"17":{"position":[[31,4]]},"30":{"position":[[31,4]]},"49":{"position":[[31,4]]},"51":{"position":[[194,4],[290,4]]},"55":{"position":[[1307,5]]},"63":{"position":[[422,4]]},"73":{"position":[[31,4]]},"86":{"position":[[31,4]]},"95":{"position":[[31,4]]},"108":{"position":[[31,4]]},"134":{"position":[[1015,5]]},"152":{"position":[[32,4]]},"172":{"position":[[4,4]]},"181":{"position":[[522,5]]},"185":{"position":[[1019,5]]},"205":{"position":[[997,4]]},"244":{"position":[[773,4]]}}}],["baseapiurl",{"_index":641,"t":{"63":{"position":[[1261,11]]},"213":{"position":[[143,10]]}}}],["basemap",{"_index":25,"t":{"2":{"position":[[348,8],[580,9],[778,9]]}}}],["basi",{"_index":1363,"t":{"215":{"position":[[491,6]]}}}],["basic",{"_index":1155,"t":{"193":{"position":[[26,5]]}}}],["be",{"_index":421,"t":{"57":{"position":[[194,5]]},"152":{"position":[[162,5]]},"196":{"position":[[279,5]]},"239":{"position":[[597,5]]},"284":{"position":[[163,5]]}}}],["bear",{"_index":437,"t":{"57":{"position":[[896,8],[926,7],[1225,8],[1254,7]]},"61":{"position":[[6387,7],[6524,7],[6817,7],[6941,7]]},"76":{"position":[[1082,7]]},"130":{"position":[[920,8],[942,7]]},"239":{"position":[[501,7]]},"276":{"position":[[106,7]]},"300":{"position":[[32,7]]}}}],["bearer",{"_index":1136,"t":{"185":{"position":[[1312,7]]}}}],["becom",{"_index":1033,"t":{"162":{"position":[[169,8]]},"200":{"position":[[999,6]]}}}],["befor",{"_index":329,"t":{"45":{"position":[[67,7]]},"61":{"position":[[394,6],[4670,6],[5682,6],[6343,6],[7037,6]]}}}],["beforeid",{"_index":326,"t":{"45":{"position":[[0,9],[423,8]]}}}],["begin",{"_index":574,"t":{"61":{"position":[[4685,6],[5697,6],[6358,6],[7052,6]]}}}],["behav",{"_index":1306,"t":{"207":{"position":[[99,6]]},"213":{"position":[[1141,6]]},"215":{"position":[[270,6]]},"244":{"position":[[405,6]]}}}],["behavior",{"_index":146,"t":{"4":{"position":[[1494,8]]},"6":{"position":[[730,10]]},"45":{"position":[[447,9]]},"63":{"position":[[1914,8],[3250,9]]},"65":{"position":[[1176,10]]},"154":{"position":[[488,9]]},"217":{"position":[[240,8]]},"229":{"position":[[525,9]]},"280":{"position":[[250,9]]}}}],["belong",{"_index":618,"t":{"61":{"position":[[8407,9]]}}}],["below",{"_index":353,"t":{"51":{"position":[[28,6]]},"183":{"position":[[598,5]]},"196":{"position":[[236,5]]},"229":{"position":[[564,5],[708,5]]},"235":{"position":[[65,6]]}}}],["better",{"_index":149,"t":{"6":{"position":[[45,6]]},"213":{"position":[[32,6]]},"242":{"position":[[30,6]]},"260":{"position":[[60,6]]},"268":{"position":[[79,6]]},"272":{"position":[[268,6]]},"280":{"position":[[145,6]]},"288":{"position":[[308,6]]}}}],["between",{"_index":1465,"t":{"242":{"position":[[68,7]]},"264":{"position":[[16,7]]}}}],["bewar",{"_index":356,"t":{"51":{"position":[[127,6]]}}}],["big",{"_index":1091,"t":{"181":{"position":[[382,3]]}}}],["bill",{"_index":1238,"t":{"198":{"position":[[827,6]]},"264":{"position":[[159,5]]}}}],["billabl",{"_index":31,"t":{"2":{"position":[[513,8]]},"63":{"position":[[2064,8]]},"183":{"position":[[349,8]]},"198":{"position":[[739,8]]}}}],["bind",{"_index":720,"t":{"65":{"position":[[917,9]]},"244":{"position":[[623,8]]}}}],["blob",{"_index":708,"t":{"63":{"position":[[3223,4]]}}}],["block",{"_index":1564,"t":{"284":{"position":[[109,5]]}}}],["blog",{"_index":1521,"t":{"264":{"position":[[412,4]]}}}],["boolean",{"_index":403,"t":{"55":{"position":[[1020,8],[1130,8]]},"59":{"position":[[9,8],[136,8],[279,8],[408,7],[600,8],[717,7],[916,7],[1119,7]]},"63":{"position":[[1496,8]]},"76":{"position":[[11,8]]},"134":{"position":[[329,7],[537,7],[781,7],[1460,7]]}}}],["bootstrap",{"_index":978,"t":{"150":{"position":[[185,9]]}}}],["both",{"_index":98,"t":{"4":{"position":[[630,4]]},"272":{"position":[[20,4]]}}}],["bottom",{"_index":233,"t":{"13":{"position":[[267,7],[284,7],[308,7]]},"24":{"position":[[326,7],[343,7],[367,7]]},"35":{"position":[[279,7],[296,7]]},"91":{"position":[[276,7],[293,7]]},"98":{"position":[[46,8],[84,7],[100,7],[373,9]]},"113":{"position":[[138,7],[155,7]]},"128":{"position":[[49,7],[68,7],[214,7]]},"138":{"position":[[1057,7],[1073,7]]}}}],["bound",{"_index":423,"t":{"57":{"position":[[270,7],[309,6],[469,6],[1778,7]]},"61":{"position":[[7945,8]]},"202":{"position":[[231,6]]},"233":{"position":[[240,5],[353,7]]}}}],["bounds.contains([lng",{"_index":1280,"t":{"202":{"position":[[275,21]]}}}],["box",{"_index":461,"t":{"59":{"position":[[45,4]]},"61":{"position":[[7706,4],[7799,4],[7909,4],[7954,3]]}}}],["boxzoom",{"_index":460,"t":{"59":{"position":[[0,8]]}}}],["boxzoombound",{"_index":911,"t":{"134":{"position":[[1176,14]]}}}],["boxzoomhandl",{"_index":462,"t":{"59":{"position":[[84,14]]}}}],["branch",{"_index":970,"t":{"150":{"position":[[11,6],[44,7]]},"152":{"position":[[135,7]]}}}],["break",{"_index":719,"t":{"65":{"position":[[898,8]]},"154":{"position":[[199,8]]},"219":{"position":[[152,8]]},"225":{"position":[[119,8]]},"244":{"position":[[604,8]]},"252":{"position":[[346,8]]},"272":{"position":[[1178,8]]}}}],["browser",{"_index":980,"t":{"150":{"position":[[262,7],[324,7]]},"280":{"position":[[507,7]]}}}],["bug",{"_index":965,"t":{"148":{"position":[[50,3]]}}}],["build",{"_index":62,"t":{"4":{"position":[[101,5]]},"55":{"position":[[1255,8]]},"150":{"position":[[52,8]]},"193":{"position":[[446,8]]},"219":{"position":[[175,5],[244,5]]},"227":{"position":[[33,8]]},"244":{"position":[[339,5]]},"272":{"position":[[243,5]]}}}],["bump",{"_index":1569,"t":{"288":{"position":[[21,5]]},"298":{"position":[[18,4]]}}}],["bundl",{"_index":628,"t":{"63":{"position":[[555,8],[746,6],[910,7],[3034,6]]}}}],["bundler",{"_index":682,"t":{"63":{"position":[[2699,8]]},"196":{"position":[[1107,7]]}}}],["button",{"_index":557,"t":{"61":{"position":[[3243,6]]},"82":{"position":[[638,7],[1215,7]]},"100":{"position":[[170,6]]},"142":{"position":[[342,7],[637,7],[1190,7],[1597,7]]}}}],["bypass",{"_index":1240,"t":{"198":{"position":[[1092,8]]}}}],["call",{"_index":161,"t":{"6":{"position":[[254,4],[418,7],[557,7]]},"22":{"position":[[50,6],[168,6],[297,6],[469,6],[591,6]]},"26":{"position":[[102,4]]},"61":{"position":[[37,6],[110,6],[273,6],[357,6],[597,6],[714,6],[793,6],[1071,6],[1352,6],[1606,6],[1829,6],[2242,6],[2464,6],[2580,6],[2886,6],[3221,6],[3521,6],[3621,6],[3879,6],[4136,6],[4396,6],[4658,6],[4778,6],[5246,6],[5373,6],[5468,6],[5572,6],[5670,6],[5796,6],[6196,6],[6331,6],[6467,6],[6883,6],[7025,6],[7154,6],[7559,6],[7692,6],[7785,6],[7878,6],[8065,6],[8196,6],[8332,6]]},"63":{"position":[[2571,7]]},"65":{"position":[[885,4],[1057,7]]},"78":{"position":[[34,6],[117,6],[208,6],[296,6]]},"82":{"position":[[92,4]]},"100":{"position":[[35,6],[104,6]]},"104":{"position":[[91,4]]},"138":{"position":[[742,6],[838,6],[943,6]]},"179":{"position":[[110,7]]},"217":{"position":[[643,4],[749,4]]},"233":{"position":[[85,6]]},"244":{"position":[[580,6]]},"272":{"position":[[692,6]]}}}],["callback",{"_index":500,"t":{"59":{"position":[[1805,9]]},"187":{"position":[[373,8]]},"213":{"position":[[703,8],[1045,10]]},"229":{"position":[[241,8],[336,8]]},"268":{"position":[[130,8],[174,10]]},"272":{"position":[[131,8],[467,9],[975,8],[1019,10]]},"276":{"position":[[169,9],[194,8]]}}}],["camera",{"_index":99,"t":{"4":{"position":[[635,8],[711,7],[1406,6]]},"61":{"position":[[436,6],[4945,6],[5044,6],[5968,6],[6069,6],[6650,6],[6751,6],[7329,6],[7430,6]]},"134":{"position":[[989,6]]},"179":{"position":[[91,6]]},"187":{"position":[[91,7]]},"193":{"position":[[52,7],[147,7]]},"200":{"position":[[44,6]]},"213":{"position":[[647,6]]}}}],["cancel",{"_index":606,"t":{"61":{"position":[[7899,7]]}}}],["canva",{"_index":546,"t":{"61":{"position":[[1771,7],[2407,7],[2526,7]]},"126":{"position":[[2016,6]]},"132":{"position":[[409,7]]}}}],["canvasoverlay",{"_index":1329,"t":{"211":{"position":[[539,13]]},"239":{"position":[[85,14]]},"288":{"position":[[501,13]]},"300":{"position":[[284,14]]}}}],["canvassourc",{"_index":898,"t":{"132":{"position":[[351,13]]}}}],["canvassource(mapbox",{"_index":900,"t":{"132":{"position":[[421,19]]}}}],["canvassourceopt",{"_index":837,"t":{"119":{"position":[[96,20]]},"126":{"position":[[2040,20]]}}}],["canvassourceraw",{"_index":871,"t":{"126":{"position":[[1970,16]]}}}],["captur",{"_index":1353,"t":{"215":{"position":[[0,8]]}}}],["carrée/wgs84",{"_index":386,"t":{"55":{"position":[[642,12]]}}}],["case",{"_index":38,"t":{"2":{"position":[[708,5]]},"4":{"position":[[816,6]]},"181":{"position":[[68,6]]},"198":{"position":[[892,5]]},"207":{"position":[[601,4]]},"215":{"position":[[478,4],[486,4]]},"235":{"position":[[59,5]]}}}],["caus",{"_index":170,"t":{"6":{"position":[[455,5]]},"65":{"position":[[1089,5]]},"292":{"position":[[249,6]]}}}],["center",{"_index":397,"t":{"55":{"position":[[865,6]]},"57":{"position":[[693,7],[763,7],[1012,7],[1062,7]]},"76":{"position":[[350,7]]},"98":{"position":[[8,8]]},"130":{"position":[[773,7],[824,7]]},"193":{"position":[[237,6],[796,6]]}}}],["certain",{"_index":1107,"t":{"183":{"position":[[798,7]]},"280":{"position":[[524,7]]}}}],["chang",{"_index":251,"t":{"22":{"position":[[502,7],[624,7]]},"41":{"position":[[104,6]]},"43":{"position":[[58,7]]},"45":{"position":[[359,7]]},"55":{"position":[[1182,8]]},"61":{"position":[[2003,7],[5069,6],[5989,6],[6094,6],[6671,6],[6776,6],[7350,6],[7455,6],[8099,8],[8233,8],[8378,8],[8438,8]]},"65":{"position":[[1018,7]]},"119":{"position":[[128,6],[309,7]]},"134":{"position":[[1005,6]]},"152":{"position":[[13,6]]},"154":{"position":[[208,7]]},"179":{"position":[[98,8]]},"187":{"position":[[171,7]]},"200":{"position":[[1457,8]]},"205":{"position":[[94,6]]},"207":{"position":[[299,7]]},"213":{"position":[[298,7],[1017,7],[1245,6]]},"219":{"position":[[103,7],[161,6]]},"225":{"position":[[84,7],[128,7]]},"239":{"position":[[603,7],[838,7]]},"248":{"position":[[150,6]]},"252":{"position":[[82,7],[355,8]]},"256":{"position":[[306,7]]},"264":{"position":[[9,6]]},"272":{"position":[[1187,8]]}}}],["changelog",{"_index":1520,"t":{"264":{"position":[[398,9]]}}}],["charter",{"_index":1019,"t":{"158":{"position":[[83,8]]}}}],["check",{"_index":1076,"t":{"177":{"position":[[796,5],[888,5]]},"202":{"position":[[93,8]]},"211":{"position":[[335,5],[457,5],[582,5]]},"213":{"position":[[1321,5]]},"229":{"position":[[480,5]]}}}],["checkifpositioninviewport",{"_index":1278,"t":{"202":{"position":[[181,25]]}}}],["checkout",{"_index":977,"t":{"150":{"position":[[164,8]]}}}],["chen",{"_index":1025,"t":{"162":{"position":[[7,4]]}}}],["child",{"_index":342,"t":{"45":{"position":[[573,5]]},"61":{"position":[[1539,5]]},"73":{"position":[[839,5]]},"205":{"position":[[1320,5]]},"288":{"position":[[535,5]]}}}],["children",{"_index":824,"t":{"117":{"position":[[98,9]]},"231":{"position":[[443,8],[498,8]]}}}],["choroplethoverlay",{"_index":1412,"t":{"231":{"position":[[94,18]]},"290":{"position":[[563,19]]}}}],["chrome",{"_index":981,"t":{"150":{"position":[[279,6]]}}}],["circl",{"_index":830,"t":{"117":{"position":[[508,9],[527,7],[548,7],[1251,9],[1270,7],[1291,7]]},"126":{"position":[[474,6]]},"177":{"position":[[468,9],[487,7],[508,7]]},"193":{"position":[[402,6]]}}}],["circlelay",{"_index":825,"t":{"117":{"position":[[217,13],[473,11],[951,13],[1216,11]]},"126":{"position":[[432,12]]},"177":{"position":[[177,13],[433,11]]}}}],["class",{"_index":192,"t":{"8":{"position":[[65,5]]},"13":{"position":[[149,5]]},"17":{"position":[[63,5]]},"24":{"position":[[147,5]]},"30":{"position":[[64,5]]},"39":{"position":[[321,8],[858,8]]},"49":{"position":[[50,5]]},"51":{"position":[[88,5]]},"63":{"position":[[55,5],[2783,5]]},"73":{"position":[[53,5]]},"76":{"position":[[660,5]]},"80":{"position":[[137,5]]},"86":{"position":[[64,5]]},"91":{"position":[[148,5]]},"95":{"position":[[52,5]]},"98":{"position":[[422,5]]},"102":{"position":[[136,5]]},"108":{"position":[[59,5]]},"187":{"position":[[262,6]]},"213":{"position":[[914,5]]}}}],["classnam",{"_index":793,"t":{"98":{"position":[[383,10]]}}}],["clear",{"_index":1183,"t":{"196":{"position":[[320,5]]}}}],["click",{"_index":465,"t":{"59":{"position":[[180,5],[1436,5]]},"61":{"position":[[3266,7]]},"78":{"position":[[60,7]]},"100":{"position":[[148,8]]},"198":{"position":[[602,6],[658,5]]}}}],["clickabl",{"_index":1392,"t":{"221":{"position":[[364,10]]},"272":{"position":[[960,10]]}}}],["clicktoler",{"_index":759,"t":{"80":{"position":[[191,14]]}}}],["client",{"_index":1173,"t":{"196":{"position":[[43,6]]}}}],["clockwis",{"_index":445,"t":{"57":{"position":[[1313,9]]},"76":{"position":[[939,10]]}}}],["clone",{"_index":1146,"t":{"189":{"position":[[8,5]]},"191":{"position":[[8,5]]}}}],["close",{"_index":805,"t":{"100":{"position":[[129,6],[164,5]]}}}],["closebutton",{"_index":807,"t":{"102":{"position":[[171,11]]}}}],["closeonclick",{"_index":806,"t":{"100":{"position":[[192,13]]},"102":{"position":[[183,12]]}}}],["closeonmov",{"_index":808,"t":{"102":{"position":[[196,11]]}}}],["closest",{"_index":788,"t":{"98":{"position":[[196,7]]},"144":{"position":[[119,7]]}}}],["cloud",{"_index":1092,"t":{"181":{"position":[[408,7]]}}}],["cluster",{"_index":1504,"t":{"256":{"position":[[327,8]]}}}],["code",{"_index":707,"t":{"63":{"position":[[3211,4]]},"134":{"position":[[2190,5]]},"152":{"position":[[27,4]]},"154":{"position":[[40,4]]},"164":{"position":[[58,4]]},"196":{"position":[[825,4]]},"205":{"position":[[1196,4]]},"207":{"position":[[315,4]]},"215":{"position":[[241,4]]},"229":{"position":[[388,4],[498,4]]},"244":{"position":[[768,4]]},"290":{"position":[[239,4],[466,4]]}}}],["codepen",{"_index":1196,"t":{"196":{"position":[[845,7]]}}}],["collaps",{"_index":664,"t":{"63":{"position":[[2020,11]]},"198":{"position":[[843,10]]}}}],["color",{"_index":295,"t":{"39":{"position":[[354,7],[891,7]]},"80":{"position":[[179,5]]},"117":{"position":[[556,7],[1299,7]]},"177":{"position":[[516,7]]}}}],["color=\"r",{"_index":767,"t":{"82":{"position":[[586,11],[1163,11]]}}}],["command",{"_index":85,"t":{"4":{"position":[[426,7]]},"196":{"position":[[480,7]]}}}],["commit",{"_index":1028,"t":{"162":{"position":[[57,6]]},"196":{"position":[[299,6]]}}}],["committe",{"_index":1022,"t":{"160":{"position":[[70,9]]}}}],["commun",{"_index":1125,"t":{"185":{"position":[[469,9]]}}}],["compact",{"_index":226,"t":{"13":{"position":[[184,7]]}}}],["compat",{"_index":11,"t":{"2":{"position":[[107,10]]},"207":{"position":[[195,13]]},"209":{"position":[[20,10]]},"229":{"position":[[170,10]]},"237":{"position":[[10,10]]},"244":{"position":[[632,14]]}}}],["complet",{"_index":509,"t":{"61":{"position":[[191,8],[549,9],[5272,9],[6222,9],[6909,9],[7585,9]]},"166":{"position":[[13,8]]},"207":{"position":[[8,8]]},"244":{"position":[[34,8]]},"252":{"position":[[329,8]]}}}],["complex",{"_index":71,"t":{"4":{"position":[[206,10]]},"198":{"position":[[16,7]]}}}],["compli",{"_index":1375,"t":{"217":{"position":[[571,6]]}}}],["compliant",{"_index":1479,"t":{"244":{"position":[[753,10]]}}}],["complic",{"_index":1152,"t":{"191":{"position":[[403,11]]},"193":{"position":[[112,11]]},"200":{"position":[[1501,11]]}}}],["compon",{"_index":8,"t":{"2":{"position":[[79,10]]},"4":{"position":[[88,9],[489,10],[840,10],[977,9],[1253,10],[1352,9]]},"8":{"position":[[6,9]]},"13":{"position":[[77,9]]},"17":{"position":[[6,9]]},"24":{"position":[[77,9]]},"30":{"position":[[6,9]]},"35":{"position":[[77,9]]},"39":{"position":[[5,9]]},"41":{"position":[[27,9],[126,9]]},"45":{"position":[[591,10]]},"49":{"position":[[6,9]]},"51":{"position":[[43,9]]},"57":{"position":[[224,10]]},"61":{"position":[[4885,10],[5909,10],[6588,10],[7269,10]]},"63":{"position":[[451,10],[1549,9],[1760,9],[1855,9],[2258,9]]},"65":{"position":[[1324,10]]},"69":{"position":[[66,9],[109,9]]},"73":{"position":[[6,9],[845,11]]},"80":{"position":[[77,9]]},"86":{"position":[[6,9]]},"91":{"position":[[77,9]]},"95":{"position":[[6,9]]},"102":{"position":[[77,9]]},"108":{"position":[[6,9]]},"113":{"position":[[77,9]]},"117":{"position":[[5,9],[84,10]]},"119":{"position":[[27,9],[150,9]]},"124":{"position":[[126,10]]},"142":{"position":[[32,9]]},"144":{"position":[[246,10]]},"154":{"position":[[152,9]]},"172":{"position":[[104,10]]},"177":{"position":[[72,11]]},"183":{"position":[[980,9]]},"185":{"position":[[30,9]]},"187":{"position":[[141,9],[552,10]]},"193":{"position":[[186,10]]},"198":{"position":[[85,9]]},"200":{"position":[[844,9]]},"205":{"position":[[157,10],[1305,9],[1340,9]]},"211":{"position":[[514,10]]},"213":{"position":[[572,9],[1171,10]]},"215":{"position":[[259,10]]},"217":{"position":[[454,10],[548,11]]},"229":{"position":[[8,10],[43,9],[68,11],[213,10]]},"231":{"position":[[532,9]]},"239":{"position":[[60,10],[682,9],[875,9]]},"242":{"position":[[188,10],[452,10]]},"244":{"position":[[394,10]]},"248":{"position":[[373,10],[620,10],[678,10]]},"256":{"position":[[4,11]]},"260":{"position":[[4,11]]},"268":{"position":[[4,11]]},"272":{"position":[[411,9],[529,9]]},"280":{"position":[[593,10]]},"288":{"position":[[146,11],[168,9],[372,11]]},"300":{"position":[[259,10]]}}}],["component'",{"_index":953,"t":{"142":{"position":[[785,11]]},"211":{"position":[[104,11]]}}}],["component(",{"_index":734,"t":{"69":{"position":[[319,12]]}}}],["compos",{"_index":1402,"t":{"229":{"position":[[398,8]]}}}],["comput",{"_index":1015,"t":{"158":{"position":[[28,9]]}}}],["conduct",{"_index":1043,"t":{"164":{"position":[[66,7]]}}}],["config",{"_index":1202,"t":{"196":{"position":[[1115,7]]}}}],["configur",{"_index":396,"t":{"55":{"position":[[852,12]]},"177":{"position":[[781,14]]},"185":{"position":[[550,9]]},"189":{"position":[[25,13]]},"191":{"position":[[25,13]]}}}],["conform",{"_index":301,"t":{"41":{"position":[[47,10]]},"55":{"position":[[46,7],[192,7],[355,10],[1375,7]]},"119":{"position":[[47,10]]},"126":{"position":[[20,10],[81,10],[141,10],[205,10],[274,10]]}}}],["confus",{"_index":1584,"t":{"292":{"position":[[256,10]]}}}],["conic",{"_index":395,"t":{"55":{"position":[[802,5]]}}}],["consid",{"_index":1006,"t":{"154":{"position":[[533,8]]},"181":{"position":[[83,8]]},"198":{"position":[[152,8]]},"200":{"position":[[165,8],[1542,8]]},"252":{"position":[[255,8]]}}}],["consist",{"_index":341,"t":{"45":{"position":[[436,10]]},"213":{"position":[[39,11]]}}}],["consol",{"_index":1434,"t":{"235":{"position":[[131,9]]}}}],["console.error(evt.error",{"_index":527,"t":{"61":{"position":[[689,24]]}}}],["const",{"_index":266,"t":{"26":{"position":[[328,5],[771,5]]},"39":{"position":[[196,5],[733,5]]},"65":{"position":[[252,5],[285,5],[623,5],[656,5]]},"82":{"position":[[314,5],[359,5],[445,5],[887,5],[934,5],[1022,5]]},"95":{"position":[[217,5],[713,5]]},"104":{"position":[[301,5],[696,5]]},"117":{"position":[[300,5],[455,5],[1043,5],[1198,5]]},"142":{"position":[[238,5],[271,5],[533,5],[566,5],[1044,5],[1079,5],[1451,5],[1486,5]]},"177":{"position":[[260,5],[415,5]]},"185":{"position":[[1149,5]]},"191":{"position":[[143,5]]},"193":{"position":[[455,5],[550,5],[646,5],[698,5]]},"196":{"position":[[1160,5],[1442,5]]},"200":{"position":[[312,5],[374,5],[434,5],[466,5],[1068,5],[1652,5]]},"202":{"position":[[142,5],[175,5],[225,5]]},"217":{"position":[[300,5]]},"233":{"position":[[165,5],[234,5]]}}}],["constant",{"_index":308,"t":{"41":{"position":[[199,8]]},"98":{"position":[[682,8]]}}}],["constrain",{"_index":459,"t":{"57":{"position":[[1753,11]]},"193":{"position":[[133,9]]}}}],["constraint",{"_index":171,"t":{"6":{"position":[[471,10]]},"193":{"position":[[32,11]]},"205":{"position":[[957,11]]}}}],["construct",{"_index":420,"t":{"57":{"position":[[132,12]]},"63":{"position":[[119,9],[253,12],[1707,12]]}}}],["constructor",{"_index":355,"t":{"51":{"position":[[94,11]]}}}],["contain",{"_index":103,"t":{"4":{"position":[[680,10]]},"11":{"position":[[71,10]]},"20":{"position":[[71,10]]},"33":{"position":[[71,10]]},"35":{"position":[[198,9]]},"53":{"position":[[16,9],[119,9]]},"59":{"position":[[1586,10]]},"61":{"position":[[920,7],[962,8],[1199,7],[1241,8],[1466,10],[2088,7],[2130,8],[2734,7],[2776,8],[3066,7],[3108,8],[3377,7],[3419,8],[3727,7],[3769,8],[3983,7],[4025,8],[4241,7],[4283,8],[4503,7],[4545,8]]},"76":{"position":[[1303,10]]},"89":{"position":[[71,10]]},"98":{"position":[[341,9],[450,10],[971,10]]},"111":{"position":[[153,10]]},"117":{"position":[[70,7]]},"130":{"position":[[554,8]]},"132":{"position":[[138,10],[219,10],[296,10],[374,10],[481,10]]},"142":{"position":[[68,8]]},"144":{"position":[[83,8],[282,8],[327,10]]},"239":{"position":[[440,7]]}}}],["containerid",{"_index":276,"t":{"35":{"position":[[101,12]]}}}],["content",{"_index":701,"t":{"63":{"position":[[3126,8]]},"73":{"position":[[866,7],[943,8]]},"132":{"position":[[389,8]]},"134":{"position":[[1529,9]]}}}],["context",{"_index":558,"t":{"61":{"position":[[3281,7]]},"272":{"position":[[202,7]]}}}],["context.provid",{"_index":728,"t":{"69":{"position":[[2,16]]}}}],["contextprovid",{"_index":1312,"t":{"207":{"position":[[471,16]]}}}],["continu",{"_index":1122,"t":{"185":{"position":[[276,8]]},"196":{"position":[[647,10]]},"264":{"position":[[221,8]]}}}],["contribut",{"_index":54,"t":{"2":{"position":[[961,11]]},"148":{"position":[[30,11]]},"164":{"position":[[79,12]]}}}],["control",{"_index":136,"t":{"4":{"position":[[1375,11]]},"13":{"position":[[340,7]]},"24":{"position":[[399,7]]},"26":{"position":[[432,7],[877,7]]},"35":{"position":[[349,7]]},"61":{"position":[[4874,10],[5898,10],[6577,10],[7258,10]]},"91":{"position":[[346,7]]},"111":{"position":[[63,7]]},"113":{"position":[[208,7]]},"124":{"position":[[19,7]]},"136":{"position":[[68,9],[547,11]]},"138":{"position":[[778,8],[854,7],[959,7],[1090,7],[1151,7]]},"187":{"position":[[269,11]]},"193":{"position":[[175,10]]},"196":{"position":[[359,8]]},"207":{"position":[[407,8]]},"211":{"position":[[630,8]]},"215":{"position":[[85,9]]},"217":{"position":[[211,11]]},"221":{"position":[[215,10]]},"248":{"position":[[68,10],[562,8]]},"280":{"position":[[227,7]]},"284":{"position":[[84,8]]},"288":{"position":[[724,7]]},"290":{"position":[[194,7]]}}}],["control'",{"_index":221,"t":{"11":{"position":[[61,9]]},"20":{"position":[[61,9]]},"33":{"position":[[61,9]]},"89":{"position":[[61,9]]},"111":{"position":[[143,9]]}}}],["control.t",{"_index":236,"t":{"15":{"position":[[12,10]]},"28":{"position":[[10,10]]},"37":{"position":[[11,10]]},"93":{"position":[[11,10]]},"115":{"position":[[6,10]]},"140":{"position":[[4,10]]}}}],["controller_opt",{"_index":1371,"t":{"217":{"position":[[306,15],[409,20]]}}}],["controlposit",{"_index":872,"t":{"128":{"position":[[0,16]]},"138":{"position":[[112,16],[301,16],[540,16]]}}}],["cooperativegestur",{"_index":1352,"t":{"213":{"position":[[1335,19]]}}}],["coord",{"_index":917,"t":{"134":{"position":[[1549,6],[1953,7]]}}}],["coordin",{"_index":789,"t":{"98":{"position":[[211,11]]},"117":{"position":[[420,12],[1163,12]]},"130":{"position":[[484,11]]},"134":{"position":[[1556,10]]},"177":{"position":[[380,12]]}}}],["copi",{"_index":405,"t":{"55":{"position":[[1061,6]]},"231":{"position":[[371,4]]}}}],["core",{"_index":145,"t":{"4":{"position":[[1489,4]]}}}],["correctli",{"_index":112,"t":{"4":{"position":[[866,10]]}}}],["correspond",{"_index":497,"t":{"59":{"position":[[1697,13]]}}}],["counter",{"_index":444,"t":{"57":{"position":[[1305,7]]}}}],["counterpart",{"_index":1355,"t":{"215":{"position":[[147,13]]},"244":{"position":[[437,13]]}}}],["cover",{"_index":988,"t":{"154":{"position":[[55,7]]}}}],["crash",{"_index":1385,"t":{"219":{"position":[[220,5]]},"280":{"position":[[515,5]]}}}],["creat",{"_index":47,"t":{"2":{"position":[[845,6]]},"4":{"position":[[23,7],[1296,7]]},"39":{"position":[[30,6]]},"117":{"position":[[30,6]]},"136":{"position":[[31,6]]},"138":{"position":[[573,7],[752,6]]},"183":{"position":[[1092,6]]},"185":{"position":[[886,8]]},"196":{"position":[[744,6]]},"280":{"position":[[411,6]]}}}],["creation",{"_index":1553,"t":{"280":{"position":[[608,9]]}}}],["csp",{"_index":700,"t":{"63":{"position":[[3122,3]]}}}],["css",{"_index":218,"t":{"11":{"position":[[22,3]]},"20":{"position":[[22,3]]},"33":{"position":[[22,3]]},"53":{"position":[[129,4]]},"76":{"position":[[1255,3]]},"89":{"position":[[22,3]]},"98":{"position":[[418,3],[859,3],[924,3]]},"111":{"position":[[104,3]]},"172":{"position":[[686,3]]},"179":{"position":[[158,3]]},"200":{"position":[[1529,3]]},"272":{"position":[[66,3]]}}}],["cssproperti",{"_index":217,"t":{"11":{"position":[[7,14]]},"20":{"position":[[7,14]]},"33":{"position":[[7,14]]},"53":{"position":[[37,14]]},"76":{"position":[[1240,14]]},"89":{"position":[[7,14]]},"98":{"position":[[909,14]]},"111":{"position":[[89,14]]}}}],["current",{"_index":365,"t":{"53":{"position":[[170,7]]},"55":{"position":[[1237,7]]},"61":{"position":[[475,9]]},"134":{"position":[[1990,7]]},"142":{"position":[[244,9],[539,9],[777,7]]},"144":{"position":[[10,10],[293,7]]},"202":{"position":[[63,9]]}}}],["cursor",{"_index":363,"t":{"53":{"position":[[134,7],[178,6]]},"61":{"position":[[990,6],[1269,6],[1441,6],[1896,6],[1938,6],[1996,6],[2158,6],[2804,6],[3136,6],[3447,6],[3797,6],[4053,6],[4311,6],[4573,6]]},"213":{"position":[[1193,7],[1209,6],[1252,6]]}}}],["custom",{"_index":843,"t":{"124":{"position":[[12,6],[67,6]]},"136":{"position":[[57,6]]},"142":{"position":[[25,6]]},"179":{"position":[[20,6]]},"185":{"position":[[619,6],[735,6]]},"211":{"position":[[295,6]]},"215":{"position":[[234,6]]},"248":{"position":[[79,15]]},"288":{"position":[[994,13]]}}}],["customattribut",{"_index":227,"t":{"13":{"position":[[192,17]]}}}],["customattribution=\"map",{"_index":213,"t":{"8":{"position":[[458,22],[861,22]]}}}],["customiz",{"_index":1489,"t":{"248":{"position":[[193,12]]}}}],["customlayerinterfac",{"_index":845,"t":{"124":{"position":[[43,21]]}}}],["customli",{"_index":1081,"t":{"179":{"position":[[185,8]]}}}],["data",{"_index":44,"t":{"2":{"position":[[805,4],[874,4]]},"4":{"position":[[172,4],[1143,4]]},"61":{"position":[[8085,4]]},"63":{"position":[[1225,4]]},"117":{"position":[[766,5],[1516,5]]},"177":{"position":[[15,4],[655,5],[758,4],[863,4]]},"181":{"position":[[37,4],[203,4],[386,5],[477,5]]},"183":{"position":[[534,4]]},"187":{"position":[[636,4]]}}}],["data={geojson",{"_index":836,"t":{"117":{"position":[[787,15],[1537,15]]},"177":{"position":[[676,15]]}}}],["data={vehiclesgeojson",{"_index":1271,"t":{"200":{"position":[[1954,23]]}}}],["dataset",{"_index":1087,"t":{"181":{"position":[[306,9]]}}}],["datatyp",{"_index":912,"t":{"134":{"position":[[1305,9],[1425,9]]}}}],["date",{"_index":1459,"t":{"242":{"position":[[8,5]]},"244":{"position":[[8,5]]},"246":{"position":[[8,5]]},"250":{"position":[[8,5]]},"254":{"position":[[8,5]]},"258":{"position":[[8,5]]},"262":{"position":[[8,5]]},"266":{"position":[[8,5]]},"270":{"position":[[8,5]]},"274":{"position":[[8,5]]},"278":{"position":[[9,5]]},"282":{"position":[[8,5]]},"286":{"position":[[8,5]]},"296":{"position":[[0,5]]}}}],["debug",{"_index":927,"t":{"134":{"position":[[2378,9]]},"150":{"position":[[300,11]]}}}],["dec",{"_index":1496,"t":{"250":{"position":[[14,3]]}}}],["decend",{"_index":963,"t":{"144":{"position":[[227,9]]}}}],["decid",{"_index":1143,"t":{"187":{"position":[[464,6]]}}}],["decis",{"_index":1030,"t":{"162":{"position":[[119,8]]},"244":{"position":[[150,10]]}}}],["deck.gl",{"_index":110,"t":{"4":{"position":[[794,8]]},"181":{"position":[[241,7],[531,7]]},"205":{"position":[[1355,8],[1372,7]]},"231":{"position":[[205,7]]}}}],["deck.gl'",{"_index":1311,"t":{"207":{"position":[[461,9]]}}}],["deckgl",{"_index":1298,"t":{"205":{"position":[[1333,6]]}}}],["default",{"_index":210,"t":{"8":{"position":[[389,7],[792,7]]},"13":{"position":[[299,8]]},"24":{"position":[[358,8]]},"35":{"position":[[181,8],[311,8]]},"43":{"position":[[255,7]]},"49":{"position":[[94,7]]},"51":{"position":[[245,7]]},"53":{"position":[[52,8],[150,8]]},"55":{"position":[[278,8],[481,8],[1029,8],[1139,8]]},"57":{"position":[[397,7],[484,7],[701,7],[771,7],[821,7],[885,7],[957,7],[1360,8],[1434,8],[1504,8],[1576,8],[1642,8],[1720,8]]},"59":{"position":[[18,8],[145,8],[288,8],[426,8],[609,8],[735,8],[934,8],[1137,8],[1353,8]]},"61":{"position":[[673,8]]},"63":{"position":[[279,8],[1291,7],[1392,8],[1505,8],[1523,8],[2306,8],[2643,8],[2878,8],[3242,7]]},"73":{"position":[[959,7]]},"76":{"position":[[20,8],[258,8],[435,8],[800,8],[998,8]]},"91":{"position":[[308,8]]},"98":{"position":[[518,8],[821,8]]},"111":{"position":[[18,8],[206,8]]},"113":{"position":[[170,8]]},"119":{"position":[[504,7]]},"205":{"position":[[648,7]]},"211":{"position":[[135,8]]},"213":{"position":[[174,8],[220,8],[280,7]]},"217":{"position":[[192,7]]},"219":{"position":[[52,7]]},"229":{"position":[[132,7],[205,7]]},"235":{"position":[[461,9],[489,9]]},"288":{"position":[[232,9]]},"298":{"position":[[84,8]]},"300":{"position":[[107,7]]}}}],["defaultprev",{"_index":907,"t":{"134":{"position":[[311,17],[519,17],[763,17]]}}}],["defin",{"_index":307,"t":{"41":{"position":[[190,8]]},"55":{"position":[[922,6]]},"119":{"position":[[202,6]]},"126":{"position":[[360,7],[464,7],[571,7],[677,7],[776,7],[880,7],[981,7],[1079,7],[1179,7],[1276,7],[1378,7],[1483,7],[1586,7],[1690,7],[1792,7],[1897,7],[2006,7]]},"185":{"position":[[1060,8]]},"196":{"position":[[399,6],[1833,8]]},"205":{"position":[[245,7],[490,7]]},"219":{"position":[[276,8]]}}}],["defineplugin",{"_index":1204,"t":{"196":{"position":[[1166,14],[1241,14]]}}}],["degre",{"_index":440,"t":{"57":{"position":[[1175,7],[1297,7]]},"76":{"position":[[847,8]]},"130":{"position":[[911,8],[976,8]]}}}],["dem",{"_index":870,"t":{"126":{"position":[[1914,3]]}}}],["demot",{"_index":1297,"t":{"205":{"position":[[1226,7]]}}}],["depend",{"_index":975,"t":{"150":{"position":[[146,13]]},"183":{"position":[[108,9]]},"205":{"position":[[82,11],[922,10],[1254,10]]},"207":{"position":[[340,9],[637,6]]},"209":{"position":[[119,13],[268,11]]},"217":{"position":[[152,11]]},"221":{"position":[[86,10]]},"223":{"position":[[158,10],[335,13]]},"237":{"position":[[234,10]]},"242":{"position":[[371,11]]},"252":{"position":[[42,10]]},"256":{"position":[[295,10]]},"264":{"position":[[493,10]]},"284":{"position":[[210,10]]}}}],["deploy",{"_index":1190,"t":{"196":{"position":[[633,8],[874,9]]}}}],["deprec",{"_index":992,"t":{"154":{"position":[[220,12]]},"221":{"position":[[250,10]]},"225":{"position":[[69,10]]},"235":{"position":[[19,9]]},"272":{"position":[[846,10]]}}}],["deriv",{"_index":1098,"t":{"183":{"position":[[90,7]]}}}],["describ",{"_index":377,"t":{"55":{"position":[[380,9]]},"154":{"position":[[466,8]]}}}],["descript",{"_index":13,"t":{"2":{"position":[[137,11]]},"154":{"position":[[335,11]]}}}],["descriptor",{"_index":1542,"t":{"272":{"position":[[711,11]]}}}],["design",{"_index":130,"t":{"4":{"position":[[1225,8]]},"8":{"position":[[481,6],[884,6]]},"229":{"position":[[152,8]]}}}],["desir",{"_index":339,"t":{"45":{"position":[[392,8]]},"63":{"position":[[1930,9]]}}}],["destroy",{"_index":1551,"t":{"280":{"position":[[422,7]]}}}],["detail",{"_index":846,"t":{"124":{"position":[[163,8]]},"134":{"position":[[2300,7]]},"177":{"position":[[744,7]]},"213":{"position":[[1078,8]]},"248":{"position":[[273,8]]},"264":{"position":[[376,8]]}}}],["dev",{"_index":982,"t":{"150":{"position":[[286,3]]},"196":{"position":[[382,3]]}}}],["develop",{"_index":56,"t":{"2":{"position":[[981,9]]},"55":{"position":[[908,10]]},"150":{"position":[[32,11]]},"160":{"position":[[13,11]]},"196":{"position":[[771,11]]},"215":{"position":[[298,10]]},"264":{"position":[[584,10]]}}}],["deviat",{"_index":139,"t":{"4":{"position":[[1425,7]]},"6":{"position":[[381,7]]}}}],["devic",{"_index":531,"t":{"61":{"position":[[816,6],[1094,6],[1375,6],[1629,6],[1852,6],[2265,6],[2484,6],[2603,6],[2909,6]]}}}],["dif",{"_index":305,"t":{"41":{"position":[[155,7]]},"55":{"position":[[1160,7]]},"272":{"position":[[306,7],[344,8]]},"290":{"position":[[412,7]]}}}],["diff",{"_index":413,"t":{"55":{"position":[[1302,4]]}}}],["differ",{"_index":173,"t":{"6":{"position":[[494,6]]},"51":{"position":[[184,9],[223,9]]}}}],["dimens",{"_index":1533,"t":{"272":{"position":[[9,10]]}}}],["direct",{"_index":954,"t":{"142":{"position":[[797,6]]},"215":{"position":[[177,10]]}}}],["directli",{"_index":162,"t":{"6":{"position":[[278,8],[441,8]]},"65":{"position":[[1076,8]]},"69":{"position":[[81,8]]},"134":{"position":[[2412,8]]},"244":{"position":[[587,8],[678,8]]},"300":{"position":[[397,8]]}}}],["disabl",{"_index":209,"t":{"8":{"position":[[377,7],[780,7]]}}}],["discuss",{"_index":1361,"t":{"215":{"position":[[445,10]]},"252":{"position":[[277,9]]}}}],["disencourag",{"_index":177,"t":{"6":{"position":[[584,13]]}}}],["dispatch",{"_index":1251,"t":{"200":{"position":[[440,8]]}}}],["dispatch({typ",{"_index":1253,"t":{"200":{"position":[[502,15]]}}}],["display",{"_index":1102,"t":{"183":{"position":[[396,10],[552,8]]}}}],["displaycontrolsdefault={fals",{"_index":940,"t":{"136":{"position":[[516,30]]}}}],["distanc",{"_index":800,"t":{"98":{"position":[[622,8]]},"111":{"position":[[236,9]]}}}],["distort",{"_index":401,"t":{"55":{"position":[[976,11]]}}}],["distribut",{"_index":1175,"t":{"196":{"position":[[110,10]]}}}],["diverg",{"_index":1464,"t":{"242":{"position":[[57,10]]}}}],["do",{"_index":167,"t":{"6":{"position":[[339,5]]}}}],["doc",{"_index":0,"t":{"2":{"position":[[6,4]]}}}],["docs/api",{"_index":991,"t":{"154":{"position":[[179,8]]}}}],["docs/upgrad",{"_index":993,"t":{"154":{"position":[[250,12]]}}}],["docs/what",{"_index":996,"t":{"154":{"position":[[316,10]]}}}],["document",{"_index":361,"t":{"51":{"position":[[309,14]]},"124":{"position":[[145,13]]},"154":{"position":[[96,13],[162,13]]},"196":{"position":[[691,13]]},"205":{"position":[[841,14]]},"213":{"position":[[0,13],[1060,13]]},"252":{"position":[[295,9]]},"288":{"position":[[754,14]]},"300":{"position":[[80,14]]}}}],["dom",{"_index":279,"t":{"35":{"position":[[132,3]]},"179":{"position":[[151,3]]},"200":{"position":[[1513,3]]}}}],["domain",{"_index":1201,"t":{"196":{"position":[[1060,6]]}}}],["don't",{"_index":1415,"t":{"231":{"position":[[324,5]]}}}],["done",{"_index":1277,"t":{"202":{"position":[[128,4]]}}}],["dotenv",{"_index":1185,"t":{"196":{"position":[[516,6]]}}}],["doubl",{"_index":464,"t":{"59":{"position":[[172,7]]},"229":{"position":[[473,6]]}}}],["doubleclickzoom",{"_index":463,"t":{"59":{"position":[[119,16]]},"288":{"position":[[644,16]]}}}],["doubleclickzoomhandl",{"_index":466,"t":{"59":{"position":[[223,22]]}}}],["doubt",{"_index":359,"t":{"51":{"position":[[269,6]]}}}],["down",{"_index":121,"t":{"4":{"position":[[1041,4],[1161,5]]}}}],["download",{"_index":508,"t":{"61":{"position":[[157,10]]}}}],["drag",{"_index":468,"t":{"59":{"position":[[315,5],[453,5],[961,5]]},"61":{"position":[[5387,5],[5495,5],[5586,5]]},"76":{"position":[[69,7]]},"78":{"position":[[129,8],[221,9],[308,8]]},"200":{"position":[[910,8]]},"284":{"position":[[35,4]]}}}],["draggabl",{"_index":740,"t":{"76":{"position":[[0,10]]},"78":{"position":[[149,9],[234,9],[326,9]]},"272":{"position":[[386,9],[445,10]]}}}],["draggablepointsoverlay",{"_index":1411,"t":{"231":{"position":[[69,24]]},"290":{"position":[[539,23]]}}}],["dragpan",{"_index":470,"t":{"59":{"position":[[399,8]]},"217":{"position":[[326,8]]},"288":{"position":[[635,8]]}}}],["dragpanhandler.en",{"_index":473,"t":{"59":{"position":[[547,21]]}}}],["dragrot",{"_index":467,"t":{"59":{"position":[[267,11]]},"217":{"position":[[349,11]]},"235":{"position":[[478,10]]},"290":{"position":[[174,11]]}}}],["dragrotatehandl",{"_index":469,"t":{"59":{"position":[[360,17]]}}}],["draw",{"_index":100,"t":{"4":{"position":[[647,4]]},"136":{"position":[[120,6]]},"244":{"position":[[701,5]]},"260":{"position":[[231,7],[260,5]]}}}],["drawcontrol",{"_index":938,"t":{"136":{"position":[[483,12]]}}}],["drawcontrol(prop",{"_index":933,"t":{"136":{"position":[[182,18]]}}}],["drawcontrolprop",{"_index":934,"t":{"136":{"position":[[201,17]]}}}],["drawn",{"_index":513,"t":{"61":{"position":[[300,5]]},"179":{"position":[[194,5]]}}}],["drive",{"_index":69,"t":{"4":{"position":[[164,7]]}}}],["drop",{"_index":1546,"t":{"272":{"position":[[814,7]]}}}],["dure",{"_index":578,"t":{"61":{"position":[[4796,6],[5486,6],[5814,6],[6485,6],[7172,6]]},"187":{"position":[[404,6]]},"198":{"position":[[134,6]]},"248":{"position":[[489,6]]}}}],["dynam",{"_index":316,"t":{"43":{"position":[[104,12]]},"45":{"position":[[185,7],[370,7]]},"63":{"position":[[718,7]]},"98":{"position":[[284,11]]},"119":{"position":[[352,12]]},"177":{"position":[[842,11]]}}}],["e.g",{"_index":1115,"t":{"183":{"position":[[1133,3]]},"193":{"position":[[60,4]]},"196":{"position":[[443,4],[1892,5]]},"213":{"position":[[671,5]]},"252":{"position":[[188,5]]}}}],["each",{"_index":90,"t":{"4":{"position":[[530,4]]},"22":{"position":[[60,4],[178,4],[307,4]]},"43":{"position":[[160,4]]},"61":{"position":[[1504,4]]},"98":{"position":[[742,4]]},"119":{"position":[[408,4]]},"144":{"position":[[153,4]]}}}],["earth",{"_index":383,"t":{"55":{"position":[[598,5],[742,5]]}}}],["eas",{"_index":1484,"t":{"248":{"position":[[102,6]]},"256":{"position":[[210,4]]}}}],["easeto",{"_index":1550,"t":{"280":{"position":[[62,7]]}}}],["east",{"_index":886,"t":{"130":{"position":[[358,5]]}}}],["ecosystem",{"_index":1083,"t":{"181":{"position":[[164,10]]}}}],["edit",{"_index":1096,"t":{"181":{"position":[[514,7]]}}}],["effort",{"_index":1348,"t":{"213":{"position":[[1123,6]]}}}],["element",{"_index":280,"t":{"35":{"position":[[136,7],[208,7]]},"43":{"position":[[165,7]]},"61":{"position":[[1545,9]]},"119":{"position":[[413,7]]}}}],["element'",{"_index":743,"t":{"76":{"position":[[340,9]]}}}],["emb",{"_index":1064,"t":{"172":{"position":[[656,5]]}}}],["embed",{"_index":626,"t":{"63":{"position":[[532,9]]}}}],["embrac",{"_index":74,"t":{"4":{"position":[[249,7]]}}}],["empir",{"_index":1162,"t":{"193":{"position":[[433,6]]}}}],["empti",{"_index":373,"t":{"55":{"position":[[287,6]]},"213":{"position":[[351,5]]}}}],["enabl",{"_index":41,"t":{"2":{"position":[[727,6]]},"55":{"position":[[1153,6]]},"59":{"position":[[71,8],[210,8],[347,8],[482,8],[655,8],[794,8],[992,8],[1206,8]]},"63":{"position":[[739,6]]},"181":{"position":[[498,7]]},"211":{"position":[[144,9]]},"217":{"position":[[181,7]]},"272":{"position":[[578,6]]},"288":{"position":[[981,7]]}}}],["end",{"_index":332,"t":{"45":{"position":[[134,3]]},"61":{"position":[[5612,5],[7822,5]]},"78":{"position":[[317,5]]}}}],["endpoint",{"_index":1282,"t":{"205":{"position":[[125,8]]},"242":{"position":[[121,8],[161,8],[279,9]]}}}],["ensur",{"_index":790,"t":{"98":{"position":[[303,6]]}}}],["enter",{"_index":517,"t":{"61":{"position":[[409,6],[1517,6],[1654,6]]}}}],["entir",{"_index":1455,"t":{"239":{"position":[[792,6]]},"244":{"position":[[785,8]]}}}],["env",{"_index":1187,"t":{"196":{"position":[[561,4],[576,4]]}}}],["environ",{"_index":704,"t":{"63":{"position":[[3152,11]]},"183":{"position":[[1016,11],[1179,11]]},"196":{"position":[[386,12],[422,11],[722,11]]}}}],["equal",{"_index":382,"t":{"55":{"position":[[592,5]]}}}],["equalearth",{"_index":384,"t":{"55":{"position":[[604,15]]}}}],["equirectangular",{"_index":387,"t":{"55":{"position":[[655,20]]}}}],["equirectangular/pl",{"_index":385,"t":{"55":{"position":[[620,21]]}}}],["equival",{"_index":757,"t":{"76":{"position":[[1209,10]]},"280":{"position":[[29,10]]}}}],["equivel",{"_index":160,"t":{"6":{"position":[[223,12]]},"63":{"position":[[2557,10]]}}}],["error",{"_index":246,"t":{"22":{"position":[[235,6]]},"61":{"position":[[729,5]]},"134":{"position":[[1640,7],[1680,6],[1687,5],[2315,6]]},"205":{"position":[[467,5]]},"248":{"position":[[455,5]]}}}],["errorev",{"_index":526,"t":{"61":{"position":[[652,11]]},"134":{"position":[[1585,11]]}}}],["es6",{"_index":1591,"t":{"300":{"position":[[229,3]]}}}],["esm",{"_index":1474,"t":{"244":{"position":[[335,3]]}}}],["etc",{"_index":418,"t":{"57":{"position":[[101,4]]},"59":{"position":[[1442,5]]},"61":{"position":[[5154,6]]},"196":{"position":[[853,5]]},"207":{"position":[[450,5]]},"239":{"position":[[111,4]]},"244":{"position":[[563,5]]},"290":{"position":[[186,4]]},"300":{"position":[[310,4]]}}}],["even",{"_index":34,"t":{"2":{"position":[[543,4]]}}}],["event",{"_index":32,"t":{"2":{"position":[[522,6]]},"59":{"position":[[1418,5],[1550,5],[1658,5],[1711,5],[1756,5],[1836,7]]},"61":{"position":[[10,7],[83,7],[245,7],[329,7],[569,7],[644,7],[756,7],[909,5],[1034,7],[1188,5],[1315,7],[1488,5],[1569,7],[1792,7],[1965,5],[2077,5],[2205,7],[2427,7],[2543,7],[2723,5],[2849,7],[3055,5],[3184,7],[3366,5],[3489,7],[3541,5],[3584,7],[3646,5],[3716,5],[3842,7],[3902,5],[3972,5],[4099,7],[4160,5],[4230,5],[4359,7],[4422,5],[4492,5],[4619,7],[4739,7],[5207,7],[5334,7],[5429,7],[5533,7],[5631,7],[5757,7],[6157,7],[6292,7],[6428,7],[6844,7],[6986,7],[7115,7],[7520,7],[7658,7],[7751,7],[8008,7],[8160,7],[8295,7]]},"63":{"position":[[2073,6]]},"134":{"position":[[62,5],[121,5],[894,5]]},"183":{"position":[[358,6]]},"198":{"position":[[748,5]]},"213":{"position":[[999,5]]},"284":{"position":[[0,5]]},"288":{"position":[[928,5],[948,5],[1011,5]]},"298":{"position":[[128,5]]}}}],["event.viewst",{"_index":579,"t":{"61":{"position":[[4896,15]]}}}],["event.viewstate.bear",{"_index":595,"t":{"61":{"position":[[6599,23]]}}}],["event.viewstate.pitch",{"_index":599,"t":{"61":{"position":[[7280,21]]}}}],["event.viewstate.zoom",{"_index":591,"t":{"61":{"position":[[5920,20]]}}}],["event:mapboxzoomev",{"_index":605,"t":{"61":{"position":[[7845,23]]}}}],["eventrecognizeropt",{"_index":1351,"t":{"213":{"position":[[1285,22]]},"248":{"position":[[288,22]]}}}],["evt",{"_index":239,"t":{"22":{"position":[[13,5],[132,5],[260,5],[438,5],[560,5]]},"61":{"position":[[682,3]]},"78":{"position":[[9,5],[85,5],[176,5],[264,5]]},"100":{"position":[[8,5],[77,5]]}}}],["evt.viewst",{"_index":1255,"t":{"200":{"position":[[543,16]]}}}],["exampl",{"_index":82,"t":{"4":{"position":[[381,8]]},"6":{"position":[[409,8]]},"55":{"position":[[992,8]]},"57":{"position":[[260,9]]},"61":{"position":[[5186,9]]},"63":{"position":[[1997,7]]},"65":{"position":[[931,8]]},"136":{"position":[[615,7]]},"142":{"position":[[1649,7]]},"166":{"position":[[52,9]]},"177":{"position":[[932,9]]},"179":{"position":[[253,7]]},"183":{"position":[[919,7],[1257,9]]},"185":{"position":[[104,8],[502,7],[1131,7]]},"189":{"position":[[48,7]]},"191":{"position":[[48,7],[465,7],[502,7]]},"193":{"position":[[211,7]]},"198":{"position":[[187,7]]},"211":{"position":[[597,7],[769,8]]},"213":{"position":[[725,8],[837,8],[1234,7]]},"231":{"position":[[23,8],[153,9]]},"242":{"position":[[408,8]]},"248":{"position":[[635,8]]},"256":{"position":[[318,8]]},"260":{"position":[[202,8],[218,7]]},"288":{"position":[[841,9],[867,8]]},"290":{"position":[[647,9]]}}}],["exceed",{"_index":1109,"t":{"183":{"position":[[826,9]]}}}],["execut",{"_index":84,"t":{"4":{"position":[[414,7]]}}}],["exhaust",{"_index":357,"t":{"51":{"position":[[154,10]]}}}],["exist",{"_index":327,"t":{"45":{"position":[[31,8]]},"152":{"position":[[187,6]]}}}],["expand",{"_index":1239,"t":{"198":{"position":[[858,9]]},"288":{"position":[[783,8]]}}}],["experi",{"_index":1493,"t":{"248":{"position":[[357,11]]}}}],["experiment",{"_index":1365,"t":{"217":{"position":[[39,12]]},"280":{"position":[[336,15]]},"288":{"position":[[1026,15]]}}}],["experimental.mapcontrol",{"_index":1391,"t":{"221":{"position":[[104,24]]}}}],["explicitli",{"_index":1294,"t":{"205":{"position":[[1035,10]]},"213":{"position":[[254,10]]},"223":{"position":[[295,10]]}}}],["export",{"_index":345,"t":{"49":{"position":[[102,6]]},"217":{"position":[[64,6]]},"221":{"position":[[97,6]]},"229":{"position":[[140,7]]},"239":{"position":[[130,8]]},"242":{"position":[[170,7]]},"256":{"position":[[120,7],[154,8]]}}}],["expos",{"_index":717,"t":{"65":{"position":[[828,7]]},"207":{"position":[[119,6]]},"213":{"position":[[924,7]]},"217":{"position":[[475,6]]},"242":{"position":[[467,6]]}}}],["extend",{"_index":944,"t":{"138":{"position":[[13,7],[149,7],[338,7]]}}}],["extern",{"_index":681,"t":{"63":{"position":[[2683,8]]},"200":{"position":[[25,10]]},"213":{"position":[[660,10]]}}}],["extrus",{"_index":850,"t":{"126":{"position":[[586,9]]}}}],["facilit",{"_index":729,"t":{"69":{"position":[[24,11]]}}}],["fade/transit",{"_index":523,"t":{"61":{"position":[[517,15]]}}}],["fall",{"_index":791,"t":{"98":{"position":[[320,5]]}}}],["fals",{"_index":408,"t":{"55":{"position":[[1194,6]]},"63":{"position":[[1514,5]]},"76":{"position":[[29,5]]},"213":{"position":[[183,6]]},"235":{"position":[[471,6]]}}}],["fast",{"_index":1304,"t":{"207":{"position":[[64,5]]},"244":{"position":[[268,4]]}}}],["faster",{"_index":1527,"t":{"264":{"position":[[606,6]]}}}],["favor",{"_index":1322,"t":{"211":{"position":[[246,5]]}}}],["featur",{"_index":495,"t":{"59":{"position":[[1517,7],[1568,8],[1622,9],[1778,8]]},"61":{"position":[[942,8],[971,8],[1221,8],[1250,8],[2110,8],[2139,8],[2756,8],[2785,8],[3088,8],[3117,8],[3399,8],[3428,8],[3749,8],[3778,8],[4005,8],[4034,8],[4263,8],[4292,8],[4525,8],[4554,8]]},"117":{"position":[[364,9],[383,10],[1107,9],[1126,10]]},"130":{"position":[[536,7]]},"134":{"position":[[337,10],[789,10]]},"152":{"position":[[154,7]]},"154":{"position":[[288,8]]},"177":{"position":[[324,9],[343,10]]},"179":{"position":[[200,8]]},"181":{"position":[[9,7]]},"185":{"position":[[393,8]]},"200":{"position":[[1728,9]]},"207":{"position":[[267,9]]},"215":{"position":[[385,7]]},"225":{"position":[[103,9]]},"264":{"position":[[277,8]]},"280":{"position":[[21,7]]},"288":{"position":[[918,9]]}}}],["featurecollect",{"_index":826,"t":{"117":{"position":[[264,19],[315,17],[343,20],[1007,19],[1058,17],[1086,20]]},"177":{"position":[[224,19],[275,17],[303,20]]},"200":{"position":[[1707,20]]}}}],["feb",{"_index":1466,"t":{"244":{"position":[[14,3]]}}}],["few",{"_index":1397,"t":{"225":{"position":[[115,3]]},"235":{"position":[[31,3]]},"244":{"position":[[737,4]]}}}],["field",{"_index":536,"t":{"61":{"position":[[951,5],[1230,5],[2119,5],[2765,5],[3097,5],[3408,5],[3758,5],[4014,5],[4272,5],[4534,5]]},"128":{"position":[[128,7]]},"130":{"position":[[594,7],[720,7]]},"134":{"position":[[39,7],[176,7],[412,7],[594,7],[871,7],[1096,7],[1252,7],[1372,7],[1626,7],[1738,7],[1887,7],[2124,7],[2484,7],[2586,7],[2731,7]]},"144":{"position":[[301,5]]},"200":{"position":[[2061,7]]},"239":{"position":[[465,6],[932,6]]}}}],["file",{"_index":1089,"t":{"181":{"position":[[341,4]]},"196":{"position":[[566,5]]}}}],["file(",{"_index":1417,"t":{"231":{"position":[[395,7]]}}}],["fill",{"_index":290,"t":{"39":{"position":[[253,7],[348,5],[790,7],[885,5]]},"126":{"position":[[581,4],[687,4]]}}}],["fillextrusionlay",{"_index":849,"t":{"126":{"position":[[532,19]]}}}],["filllay",{"_index":287,"t":{"39":{"position":[[163,11],[213,9],[691,11],[750,9]]},"126":{"position":[[647,10]]}}}],["filter",{"_index":292,"t":{"39":{"position":[[306,7],[843,7]]}}}],["final",{"_index":627,"t":{"63":{"position":[[549,5]]}}}],["find",{"_index":1044,"t":{"166":{"position":[[8,4]]},"172":{"position":[[366,4],[566,4]]},"219":{"position":[[285,4]]}}}],["fine",{"_index":1491,"t":{"248":{"position":[[329,4]]}}}],["finger",{"_index":1486,"t":{"248":{"position":[[132,6]]}}}],["fire",{"_index":542,"t":{"61":{"position":[[1499,4],[1976,4]]},"272":{"position":[[143,5]]}}}],["first",{"_index":58,"t":{"4":{"position":[[17,5]]},"13":{"position":[[87,5]]},"24":{"position":[[87,5]]},"35":{"position":[[87,5]]},"61":{"position":[[176,5]]},"80":{"position":[[87,5]]},"91":{"position":[[87,5]]},"102":{"position":[[87,5]]},"113":{"position":[[87,5]]},"237":{"position":[[100,5]]},"244":{"position":[[647,5]]}}}],["fitbound",{"_index":1419,"t":{"233":{"position":[[4,9]]},"244":{"position":[[553,9]]},"294":{"position":[[0,10],[11,9]]}}}],["fitboundsopt",{"_index":257,"t":{"24":{"position":[[198,16]]},"57":{"position":[[411,16]]}}}],["fitboundsoptions.maxzoom",{"_index":430,"t":{"57":{"position":[[566,25]]}}}],["fitboundsoptions.minzoom",{"_index":428,"t":{"57":{"position":[[533,25]]}}}],["fitboundsoptions.offset",{"_index":426,"t":{"57":{"position":[[498,24]]}}}],["fitboundsoptions.pad",{"_index":431,"t":{"57":{"position":[[599,25]]}}}],["flat/ortograph",{"_index":1590,"t":{"300":{"position":[[168,16]]}}}],["flow",{"_index":128,"t":{"4":{"position":[[1155,5]]},"191":{"position":[[421,6]]},"248":{"position":[[15,4]]}}}],["flyto",{"_index":582,"t":{"61":{"position":[[5033,6],[6058,6],[6740,6],[7419,6]]},"244":{"position":[[545,7]]},"280":{"position":[[52,5]]}}}],["flytointerpol",{"_index":1333,"t":{"211":{"position":[[687,17]]},"260":{"position":[[179,18]]}}}],["focus",{"_index":1090,"t":{"181":{"position":[[354,7]]}}}],["focusafteropen",{"_index":809,"t":{"102":{"position":[[208,14]]}}}],["fog",{"_index":366,"t":{"55":{"position":[[0,4],[5,4],[14,3],[61,3],[124,3]]},"126":{"position":[[66,4],[99,3]]}}}],["folder",{"_index":1112,"t":{"183":{"position":[[927,8]]}}}],["follow",{"_index":229,"t":{"13":{"position":[[219,10]]},"24":{"position":[[278,10]]},"43":{"position":[[31,9]]},"63":{"position":[[4,9]]},"91":{"position":[[228,10]]},"119":{"position":[[282,9]]},"122":{"position":[[4,9]]},"128":{"position":[[118,9]]},"130":{"position":[[567,9],[710,9]]},"132":{"position":[[4,9]]},"134":{"position":[[29,9],[166,9],[402,9],[584,9],[861,9],[1086,9],[1242,9],[1362,9],[1616,9],[1728,9],[1877,9],[2114,9],[2474,9],[2576,9],[2721,9]]},"156":{"position":[[13,7]]},"193":{"position":[[201,9]]},"196":{"position":[[680,6],[1089,9]]},"198":{"position":[[165,9]]},"200":{"position":[[178,9]]},"213":{"position":[[368,9],[1222,6]]},"233":{"position":[[95,8]]}}}],["forc",{"_index":409,"t":{"55":{"position":[[1201,5]]}}}],["forese",{"_index":1123,"t":{"185":{"position":[[316,11]]}}}],["fork",{"_index":16,"t":{"2":{"position":[[166,4],[606,5],[669,6],[740,5]]},"174":{"position":[[42,4],[284,7]]},"183":{"position":[[152,5]]},"185":{"position":[[479,4]]},"209":{"position":[[31,5]]}}}],["fork/path/to/styl",{"_index":1070,"t":{"174":{"position":[[198,18]]}}}],["forlook",{"_index":1,"t":{"2":{"position":[[15,10]]}}}],["format",{"_index":902,"t":{"132":{"position":[[527,7]]},"181":{"position":[[346,7],[450,7]]}}}],["found",{"_index":1012,"t":{"156":{"position":[[94,5]]}}}],["foundat",{"_index":1016,"t":{"158":{"position":[[38,11]]}}}],["foundation'",{"_index":1042,"t":{"164":{"position":[[45,12]]}}}],["frame",{"_index":516,"t":{"61":{"position":[[379,5]]},"200":{"position":[[887,5]]}}}],["framework",{"_index":1085,"t":{"181":{"position":[[265,9]]},"288":{"position":[[829,11]]}}}],["free",{"_index":22,"t":{"2":{"position":[[299,4],[460,4]]},"183":{"position":[[39,5],[785,4]]},"209":{"position":[[144,4]]}}}],["frequent",{"_index":660,"t":{"63":{"position":[[1958,10]]},"231":{"position":[[44,10]]}}}],["full",{"_index":282,"t":{"35":{"position":[[165,4],[229,4]]},"55":{"position":[[1209,6]]},"136":{"position":[[610,4]]},"142":{"position":[[1644,4]]},"179":{"position":[[248,4]]},"189":{"position":[[16,4]]},"191":{"position":[[16,4]]},"288":{"position":[[70,4],[989,4]]}}}],["fulli",{"_index":73,"t":{"4":{"position":[[243,5],[1306,5],[1369,5]]},"6":{"position":[[26,5]]},"207":{"position":[[83,5]]}}}],["fullscreen",{"_index":284,"t":{"37":{"position":[[0,10]]}}}],["fullscreencontrol",{"_index":275,"t":{"30":{"position":[[46,17],[151,19],[374,18],[450,19],[676,18]]},"268":{"position":[[16,18]]}}}],["function",{"_index":195,"t":{"8":{"position":[[194,8],[603,8]]},"17":{"position":[[190,8],[496,8]]},"26":{"position":[[311,8],[754,8]]},"30":{"position":[[192,8],[500,8]]},"39":{"position":[[377,8],[914,8]]},"49":{"position":[[216,8],[524,8]]},"63":{"position":[[662,8],[829,8],[1106,8]]},"65":{"position":[[235,8],[606,8]]},"69":{"position":[[225,8]]},"73":{"position":[[170,8],[536,8]]},"82":{"position":[[297,8],[870,8]]},"86":{"position":[[192,8],[500,8]]},"95":{"position":[[200,8],[696,8]]},"104":{"position":[[284,8],[679,8]]},"108":{"position":[[182,8],[480,8]]},"117":{"position":[[579,8],[1322,8]]},"136":{"position":[[173,8],[307,8]]},"142":{"position":[[139,8],[210,8],[434,8],[505,8],[888,8],[1016,8],[1295,8],[1423,8]]},"170":{"position":[[88,8],[466,8]]},"174":{"position":[[229,8]]},"177":{"position":[[539,8]]},"185":{"position":[[1071,8],[1139,9]]},"189":{"position":[[126,8]]},"191":{"position":[[126,8]]},"193":{"position":[[533,8]]},"200":{"position":[[291,8]]},"205":{"position":[[352,8],[606,8]]},"217":{"position":[[537,10]]},"233":{"position":[[65,8]]},"248":{"position":[[667,10]]}}}],["further",{"_index":1296,"t":{"205":{"position":[[1218,7]]}}}],["futur",{"_index":1124,"t":{"185":{"position":[[328,7],[435,6]]},"205":{"position":[[1270,6]]},"217":{"position":[[92,6]]},"239":{"position":[[728,6]]},"256":{"position":[[288,6]]}}}],["gener",{"_index":33,"t":{"2":{"position":[[533,9]]},"6":{"position":[[537,9]]},"152":{"position":[[79,9]]},"183":{"position":[[339,9]]},"198":{"position":[[727,9]]},"205":{"position":[[445,8]]}}}],["gentli",{"_index":1396,"t":{"225":{"position":[[62,6]]}}}],["geocod",{"_index":1478,"t":{"244":{"position":[[717,9]]}}}],["geocontrolref",{"_index":267,"t":{"26":{"position":[[334,13],[777,13]]}}}],["geocontrolref.curr",{"_index":271,"t":{"26":{"position":[[487,25],[932,25]]}}}],["geocontrolref.current?.trigg",{"_index":270,"t":{"26":{"position":[[450,33],[895,33]]}}}],["geofenc",{"_index":1157,"t":{"193":{"position":[[261,9],[461,8],[817,8],[868,10]]}}}],["geojson",{"_index":827,"t":{"117":{"position":[[289,10],[306,8],[1032,10],[1049,8]]},"126":{"position":[[1388,7]]},"130":{"position":[[528,7]]},"132":{"position":[[149,8]]},"177":{"position":[[249,10],[266,8],[902,7],[914,7]]},"181":{"position":[[506,7]]},"193":{"position":[[253,7]]}}}],["geojsonsourc",{"_index":895,"t":{"132":{"position":[[114,14],[162,13]]}}}],["geojsonsourceraw",{"_index":862,"t":{"126":{"position":[[1341,17]]}}}],["geoloc",{"_index":242,"t":{"22":{"position":[[65,11],[183,11],[312,11]]},"28":{"position":[[0,9]]}}}],["geolocatecontrol",{"_index":237,"t":{"17":{"position":[[46,16],[150,18],[372,17],[447,18],[672,17]]},"22":{"position":[[485,16],[607,16]]},"24":{"position":[[130,16]]},"26":{"position":[[22,16],[232,18],[526,17],[662,18],[971,17]]},"134":{"position":[[1799,16],[1916,16],[2153,16]]},"242":{"position":[[435,16]]},"248":{"position":[[503,16]]},"256":{"position":[[63,17]]},"268":{"position":[[35,16]]}}}],["geolocateerrorev",{"_index":245,"t":{"22":{"position":[[138,20]]},"134":{"position":[[2074,20]]}}}],["geolocateev",{"_index":250,"t":{"22":{"position":[[444,15],[566,15]]},"134":{"position":[[1693,15]]}}}],["geolocateresultev",{"_index":240,"t":{"22":{"position":[[19,21],[266,21]]},"134":{"position":[[1836,21]]}}}],["geolocationcoordin",{"_index":918,"t":{"134":{"position":[[1961,22]]}}}],["geolocationpositionerror",{"_index":923,"t":{"134":{"position":[[2253,24]]}}}],["geometri",{"_index":828,"t":{"117":{"position":[[394,9],[1137,9]]},"177":{"position":[[354,9]]},"181":{"position":[[419,11]]}}}],["geospati",{"_index":66,"t":{"4":{"position":[[134,10]]},"181":{"position":[[439,10]]},"288":{"position":[[818,10]]}}}],["gestur",{"_index":1487,"t":{"248":{"position":[[139,7]]},"288":{"position":[[99,8]]}}}],["get",{"_index":653,"t":{"63":{"position":[[1665,4],[1865,4]]}}}],["getcursor",{"_index":1347,"t":{"213":{"position":[[1087,9]]}}}],["getmap",{"_index":166,"t":{"6":{"position":[[322,7]]},"65":{"position":[[1231,9],[1241,9]]}}}],["gist",{"_index":1195,"t":{"196":{"position":[[838,6]]}}}],["git",{"_index":976,"t":{"150":{"position":[[160,3]]}}}],["github",{"_index":998,"t":{"154":{"position":[[350,6]]},"162":{"position":[[79,6]]},"196":{"position":[[336,6]]}}}],["gitignor",{"_index":1188,"t":{"196":{"position":[[584,10]]}}}],["give",{"_index":321,"t":{"43":{"position":[[155,4]]},"119":{"position":[[403,4]]}}}],["given",{"_index":410,"t":{"55":{"position":[[1268,5]]},"57":{"position":[[1772,5]]}}}],["gl",{"_index":6,"t":{"2":{"position":[[56,2],[101,2],[181,2],[236,2],[276,2],[388,2],[426,2],[603,2],[648,2],[937,3]]},"4":{"position":[[10,2],[306,2],[1219,2],[1293,2],[1340,3]]},"6":{"position":[[19,2],[93,2]]},"8":{"position":[[189,4]]},"17":{"position":[[185,4]]},"26":{"position":[[267,4],[306,4],[749,4]]},"30":{"position":[[187,4]]},"39":{"position":[[146,4],[191,4]]},"49":{"position":[[124,3],[211,4]]},"63":{"position":[[303,4],[335,2],[355,4],[623,4],[657,4],[824,4],[881,5],[996,2],[1101,4],[2346,2],[2367,2],[2393,2],[2950,2]]},"65":{"position":[[188,4],[230,4]]},"69":{"position":[[220,4]]},"73":{"position":[[165,4]]},"82":{"position":[[258,4],[292,4],[865,4]]},"86":{"position":[[187,4]]},"95":{"position":[[195,4]]},"104":{"position":[[245,4],[279,4],[674,4]]},"108":{"position":[[177,4]]},"117":{"position":[[200,4],[247,4],[631,5]]},"122":{"position":[[51,2]]},"136":{"position":[[117,2],[168,4],[361,5]]},"142":{"position":[[134,4],[883,4]]},"150":{"position":[[71,2]]},"156":{"position":[[10,2]]},"160":{"position":[[10,2]]},"162":{"position":[[49,2]]},"164":{"position":[[105,3]]},"168":{"position":[[16,2],[103,2],[113,2],[130,2],[162,2],[174,2]]},"170":{"position":[[83,4]]},"172":{"position":[[128,2],[302,2],[423,2],[443,3],[627,2],[649,3]]},"174":{"position":[[29,2],[152,4]]},"177":{"position":[[160,4],[207,4]]},"181":{"position":[[139,2]]},"183":{"position":[[10,2],[84,2],[134,2],[448,2]]},"185":{"position":[[195,2],[264,2],[494,3],[519,3],[633,2]]},"187":{"position":[[255,2]]},"189":{"position":[[121,4]]},"191":{"position":[[121,4]]},"193":{"position":[[330,4]]},"196":{"position":[[1720,2]]},"198":{"position":[[724,2]]},"200":{"position":[[286,4]]},"205":{"position":[[9,2],[51,2],[265,3],[309,4],[347,4],[677,5],[743,2],[919,2],[987,2],[1065,2],[1128,2]]},"207":{"position":[[363,2],[404,2]]},"209":{"position":[[11,2],[69,2]]},"215":{"position":[[144,2]]},"219":{"position":[[133,2]]},"223":{"position":[[18,2]]},"225":{"position":[[35,3]]},"227":{"position":[[52,2],[97,2],[159,2]]},"231":{"position":[[282,2],[529,2]]},"235":{"position":[[212,2]]},"237":{"position":[[77,3],[206,2]]},"239":{"position":[[258,4],[300,4],[679,2]]},"242":{"position":[[212,3],[239,2],[298,2],[340,2]]},"244":{"position":[[698,2],[714,2]]},"252":{"position":[[36,2]]},"256":{"position":[[268,2]]},"260":{"position":[[96,2],[257,2]]},"264":{"position":[[77,2],[440,2],[490,2],[662,3]]},"268":{"position":[[115,2]]},"280":{"position":[[465,2],[551,2]]},"284":{"position":[[153,2],[266,2],[305,2]]},"288":{"position":[[14,2],[34,2],[344,2]]},"290":{"position":[[323,2]]},"298":{"position":[[14,3],[30,2]]},"300":{"position":[[73,2],[449,4]]}}}],["gl'",{"_index":686,"t":{"63":{"position":[[2752,4],[3019,4]]},"252":{"position":[[100,4]]}}}],["gl.css",{"_index":1058,"t":{"172":{"position":[[338,7],[538,7],[788,8],[839,8]]}}}],["gl.j",{"_index":638,"t":{"63":{"position":[[1016,6]]}}}],["gl/dist/mapbox",{"_index":1067,"t":{"172":{"position":[[773,14]]}}}],["gl/dist/maplibr",{"_index":1068,"t":{"172":{"position":[[822,16]]}}}],["gl/maplibr",{"_index":214,"t":{"8":{"position":[[589,13]]},"17":{"position":[[482,13]]},"26":{"position":[[697,13]]},"30":{"position":[[486,13]]},"39":{"position":[[665,13],[719,13]]},"49":{"position":[[510,13]]},"63":{"position":[[387,11]]},"65":{"position":[[541,13],[592,13]]},"73":{"position":[[522,13]]},"82":{"position":[[818,13]]},"86":{"position":[[486,13]]},"95":{"position":[[682,13]]},"104":{"position":[[627,13]]},"108":{"position":[[466,13]]},"117":{"position":[[925,13],[981,13]]},"142":{"position":[[420,13],[1281,13]]},"170":{"position":[[452,13]]},"205":{"position":[[144,12],[562,13]]},"242":{"position":[[140,12]]}}}],["gl/src/api",{"_index":1449,"t":{"239":{"position":[[339,10]]}}}],["gl@1.x",{"_index":1103,"t":{"183":{"position":[[429,6]]},"185":{"position":[[246,7]]}}}],["gl@/dist/maplibr",{"_index":1063,"t":{"172":{"position":[[497,40]]}}}],["gl@>=2.0.0",{"_index":1099,"t":{"183":{"position":[[244,10]]}}}],["glyph",{"_index":643,"t":{"63":{"position":[[1350,7]]}}}],["go",{"_index":132,"t":{"4":{"position":[[1264,5]]}}}],["good",{"_index":1409,"t":{"229":{"position":[[681,5]]}}}],["govern",{"_index":1020,"t":{"160":{"position":[[28,8]]},"162":{"position":[[201,10]]}}}],["granular",{"_index":1573,"t":{"288":{"position":[[715,8]]}}}],["graphic",{"_index":106,"t":{"4":{"position":[[740,7]]}}}],["guid",{"_index":57,"t":{"2":{"position":[[991,5]]},"242":{"position":[[395,5]]},"244":{"position":[[866,5]]},"252":{"position":[[317,5]]},"272":{"position":[[1168,5]]},"294":{"position":[[156,6]]}}}],["guide.md",{"_index":994,"t":{"154":{"position":[[263,9]]}}}],["guidelin",{"_index":1009,"t":{"156":{"position":[[45,11]]},"162":{"position":[[212,11]]}}}],["handl",{"_index":1144,"t":{"187":{"position":[[641,8]]},"211":{"position":[[234,8]]},"284":{"position":[[6,8]]},"288":{"position":[[934,9],[954,8],[1017,8]]}}}],["handler",{"_index":1323,"t":{"211":{"position":[[266,9],[355,8]]},"298":{"position":[[134,7],[178,7]]}}}],["happen",{"_index":498,"t":{"59":{"position":[[1717,9]]}}}],["hard",{"_index":1393,"t":{"223":{"position":[[153,4]]},"237":{"position":[[229,4]]}}}],["head",{"_index":1055,"t":{"172":{"position":[[208,4]]},"215":{"position":[[164,7]]}}}],["header",{"_index":1130,"t":{"185":{"position":[[1012,6],[1284,8]]}}}],["heatmap",{"_index":852,"t":{"126":{"position":[[786,7]]}}}],["heatmaplay",{"_index":851,"t":{"126":{"position":[[743,13]]}}}],["hebrew",{"_index":675,"t":{"63":{"position":[[2481,6]]}}}],["height",{"_index":349,"t":{"49":{"position":[[376,7],[642,7]]},"53":{"position":[[99,7]]},"170":{"position":[[248,7],[584,7]]},"213":{"position":[[437,6]]},"229":{"position":[[273,8],[368,7],[435,6],[555,8],[699,8]]},"233":{"position":[[219,7]]},"272":{"position":[[104,6]]},"288":{"position":[[416,6]]},"290":{"position":[[377,7]]}}}],["height={400",{"_index":1408,"t":{"229":{"position":[[648,12],[791,12]]}}}],["help",{"_index":311,"t":{"41":{"position":[[234,4]]},"196":{"position":[[246,4]]},"280":{"position":[[439,4]]}}}],["here",{"_index":786,"t":{"95":{"position":[[556,4],[1046,4]]},"136":{"position":[[623,5]]},"142":{"position":[[1657,5]]},"156":{"position":[[100,5]]},"179":{"position":[[261,5]]},"189":{"position":[[56,5]]},"191":{"position":[[56,5]]},"205":{"position":[[182,4]]},"290":{"position":[[449,5]]}}}],["hidden",{"_index":722,"t":{"65":{"position":[[954,6],[1212,6]]}}}],["high",{"_index":1084,"t":{"181":{"position":[[186,4]]},"200":{"position":[[117,4]]}}}],["higher",{"_index":1443,"t":{"237":{"position":[[142,6],[179,7]]}}}],["hillshad",{"_index":854,"t":{"126":{"position":[[890,9]]}}}],["hillshadelay",{"_index":853,"t":{"126":{"position":[[845,15]]}}}],["hit",{"_index":839,"t":{"119":{"position":[[245,4]]}}}],["hook",{"_index":119,"t":{"4":{"position":[[1013,6]]},"26":{"position":[[78,5]]},"65":{"position":[[64,5]]},"82":{"position":[[68,5]]},"104":{"position":[[67,5]]},"136":{"position":[[15,4]]},"138":{"position":[[568,4]]},"142":{"position":[[11,4],[715,4]]},"144":{"position":[[55,4],[205,4]]}}}],["host",{"_index":35,"t":{"2":{"position":[[573,6],[856,4]]},"63":{"position":[[3053,6]]},"185":{"position":[[120,4]]},"252":{"position":[[199,7]]}}}],["hover",{"_index":1349,"t":{"213":{"position":[[1262,6]]}}}],["href='https://api.tiles.mapbox.com/mapbox",{"_index":1056,"t":{"172":{"position":[[260,41]]}}}],["href='https://unpkg.com/maplibr",{"_index":1062,"t":{"172":{"position":[[464,32]]}}}],["html",{"_index":899,"t":{"132":{"position":[[404,4]]},"179":{"position":[[27,4]]},"284":{"position":[[323,4]]}}}],["htmloverlay",{"_index":1328,"t":{"211":{"position":[[525,13]]},"239":{"position":[[71,13]]},"288":{"position":[[518,11]]},"300":{"position":[[270,13]]}}}],["http://localhost",{"_index":1193,"t":{"196":{"position":[[799,18]]}}}],["https://api.mapbox.com/mapbox",{"_index":668,"t":{"63":{"position":[[2315,30]]}}}],["https://mycompany.com",{"_index":1198,"t":{"196":{"position":[[887,23]]}}}],["hundr",{"_index":1261,"t":{"200":{"position":[[953,8]]}}}],["icon",{"_index":648,"t":{"63":{"position":[[1457,6]]},"200":{"position":[[801,4],[1236,4],[2009,5],[2032,6],[2039,5]]}}}],["icontrol",{"_index":842,"t":{"124":{"position":[[0,9]]},"138":{"position":[[21,10],[79,9],[157,10],[215,9],[346,10],[404,9],[584,8],[731,8],[1136,8]]}}}],["id",{"_index":278,"t":{"35":{"position":[[122,2]]},"39":{"position":[[227,3],[764,3]]},"43":{"position":[[192,3],[263,2]]},"45":{"position":[[22,2],[639,2]]},"53":{"position":[[0,3],[26,3]]},"117":{"position":[[489,3],[1232,3]]},"119":{"position":[[440,3],[512,2]]},"144":{"position":[[29,4],[164,2]]},"177":{"position":[[449,3]]},"200":{"position":[[2077,5]]}}}],["id(",{"_index":486,"t":{"59":{"position":[[1371,5]]}}}],["id=\"mi",{"_index":834,"t":{"117":{"position":[[759,6],[1509,6]]},"177":{"position":[[648,6]]}}}],["id=\"mymapa",{"_index":955,"t":{"142":{"position":[[934,11],[1341,11]]}}}],["id=\"mymapb",{"_index":956,"t":{"142":{"position":[[958,11],[1365,11]]}}}],["id=\"vehicl",{"_index":1270,"t":{"200":{"position":[[1925,13]]}}}],["ideal",{"_index":1237,"t":{"198":{"position":[[814,5]]}}}],["ident",{"_index":323,"t":{"43":{"position":[[182,9]]},"119":{"position":[[430,9]]},"242":{"position":[[178,9]]},"264":{"position":[[267,9]]}}}],["identifi",{"_index":325,"t":{"43":{"position":[[211,10]]},"119":{"position":[[459,10]]},"183":{"position":[[725,8]]}}}],["idl",{"_index":518,"t":{"61":{"position":[[419,6]]}}}],["ignor",{"_index":419,"t":{"57":{"position":[[119,7]]}}}],["imag",{"_index":646,"t":{"63":{"position":[[1426,6]]},"126":{"position":[[1596,5]]},"132":{"position":[[307,6]]},"181":{"position":[[431,7]]},"200":{"position":[[2015,7]]}}}],["imagesourc",{"_index":897,"t":{"132":{"position":[[274,12],[318,11]]}}}],["imagesourceraw",{"_index":865,"t":{"126":{"position":[[1551,15]]}}}],["img",{"_index":738,"t":{"73":{"position":[[409,4],[769,4]]}}}],["immut",{"_index":372,"t":{"55":{"position":[[267,10]]},"223":{"position":[[237,9]]},"272":{"position":[[353,9]]}}}],["immutable.j",{"_index":1390,"t":{"221":{"position":[[58,12]]},"223":{"position":[[125,12]]}}}],["imper",{"_index":79,"t":{"4":{"position":[[318,11]]},"26":{"position":[[111,10]]},"65":{"position":[[0,10]]},"82":{"position":[[101,10]]},"104":{"position":[[100,10]]},"217":{"position":[[482,10]]},"244":{"position":[[529,10]]}}}],["imperi",{"_index":821,"t":{"111":{"position":[[170,10]]}}}],["implement",{"_index":844,"t":{"124":{"position":[[27,15],[80,15]]},"132":{"position":[[18,15]]},"179":{"position":[[8,9]]},"187":{"position":[[602,10]]},"211":{"position":[[205,14],[302,14],[609,12]]}}}],["import",{"_index":194,"t":{"8":{"position":[[108,6],[140,6],[508,6],[540,6]]},"17":{"position":[[106,6],[138,6],[403,6],[435,6]]},"26":{"position":[[147,6],[179,6],[220,6],[272,6],[577,6],[609,6],[650,6],[711,6]]},"30":{"position":[[107,6],[139,6],[406,6],[438,6]]},"39":{"position":[[78,6],[110,6],[151,6],[597,6],[629,6],[679,6]]},"49":{"position":[[152,6],[184,6],[451,6],[483,6]]},"63":{"position":[[311,8],[363,8],[520,6],[564,6],[596,6],[628,6],[726,6],[765,6],[797,6],[1042,6],[1074,6]]},"65":{"position":[[86,6],[118,6],[161,6],[193,6],[439,6],[471,6],[514,6],[555,6]]},"69":{"position":[[183,6]]},"73":{"position":[[96,6],[128,6],[453,6],[485,6]]},"82":{"position":[[137,6],[169,6],[221,6],[263,6],[697,6],[729,6],[781,6],[832,6]]},"86":{"position":[[107,6],[139,6],[406,6],[438,6]]},"95":{"position":[[95,6],[127,6],[159,6],[582,6],[614,6],[646,6]]},"104":{"position":[[136,6],[168,6],[209,6],[250,6],[518,6],[550,6],[591,6],[641,6]]},"108":{"position":[[102,6],[134,6],[391,6],[423,6]]},"117":{"position":[[124,6],[156,6],[205,6],[252,6],[849,6],[881,6],[939,6],[995,6]]},"122":{"position":[[27,8]]},"136":{"position":[[78,6],[127,6]]},"142":{"position":[[97,6],[383,6],[833,6],[1231,6]]},"170":{"position":[[24,6],[56,6],[393,6],[425,6]]},"172":{"position":[[758,6],[805,6]]},"174":{"position":[[93,6],[125,6],[180,6]]},"177":{"position":[[84,6],[116,6],[165,6],[212,6]]},"189":{"position":[[62,6],[94,6]]},"191":{"position":[[62,6],[94,6]]},"193":{"position":[[271,6],[303,6],[361,6]]},"200":{"position":[[195,6],[249,6]]},"205":{"position":[[106,7],[168,8],[282,6],[314,6],[535,6],[599,6]]},"211":{"position":[[51,6]]},"223":{"position":[[227,9]]},"233":{"position":[[104,6]]},"239":{"position":[[23,9],[165,8],[215,6],[271,6],[305,6]]},"244":{"position":[[838,9]]},"252":{"position":[[72,9]]},"256":{"position":[[243,6]]},"300":{"position":[[233,7],[336,8],[388,8],[412,7]]}}}],["import('mapbox",{"_index":622,"t":{"63":{"position":[[288,14]]}}}],["import('maplibr",{"_index":623,"t":{"63":{"position":[[338,16]]},"205":{"position":[[659,17]]}}}],["improv",{"_index":1264,"t":{"200":{"position":[[1032,7]]},"288":{"position":[[355,8]]}}}],["includ",{"_index":617,"t":{"61":{"position":[[8387,9]]},"172":{"position":[[48,8]]},"174":{"position":[[160,7]]},"181":{"position":[[392,9]]},"185":{"position":[[367,7],[816,8]]},"223":{"position":[[55,8]]},"229":{"position":[[254,8],[349,8]]},"272":{"position":[[748,9]]},"280":{"position":[[260,9]]}}}],["index.html",{"_index":634,"t":{"63":{"position":[[942,10]]},"172":{"position":[[243,10],[447,10]]}}}],["indic",{"_index":745,"t":{"76":{"position":[[368,8]]},"98":{"position":[[137,10],[781,8]]}}}],["individu",{"_index":1458,"t":{"239":{"position":[[921,10]]}}}],["inertia",{"_index":1369,"t":{"217":{"position":[[164,7],[335,9],[361,9],[386,9]]},"248":{"position":[[164,7]]}}}],["inform",{"_index":614,"t":{"61":{"position":[[8134,12],[8268,12],[8473,12]]},"69":{"position":[[387,12]]},"223":{"position":[[98,11]]},"239":{"position":[[557,11],[630,11]]},"290":{"position":[[253,12],[480,12]]},"294":{"position":[[127,12]]}}}],["initi",{"_index":415,"t":{"57":{"position":[[30,7],[301,7],[664,7],[735,7],[801,7],[852,7],[918,7],[1130,7],[1246,7]]},"63":{"position":[[2093,15],[2167,15]]},"187":{"position":[[72,7]]},"198":{"position":[[781,12],[1105,14]]},"302":{"position":[[0,7]]}}}],["initialviewst",{"_index":200,"t":{"8":{"position":[[265,19],[632,19]]},"17":{"position":[[261,19],[525,19]]},"30":{"position":[[263,19],[529,19]]},"39":{"position":[[448,19],[943,19]]},"49":{"position":[[289,19],[555,19]]},"57":{"position":[[0,17],[167,16]]},"63":{"position":[[2230,16]]},"73":{"position":[[241,19],[565,19]]},"86":{"position":[[263,19],[529,19]]},"95":{"position":[[330,19],[784,19]]},"108":{"position":[[253,19],[509,19]]},"117":{"position":[[637,19],[1351,19]]},"136":{"position":[[367,19]]},"170":{"position":[[161,19],[497,19]]},"177":{"position":[[570,19]]},"189":{"position":[[155,19]]},"213":{"position":[[595,16]]}}}],["inject",{"_index":1073,"t":{"177":{"position":[[8,6]]}}}],["inlin",{"_index":310,"t":{"41":{"position":[[223,6]]},"119":{"position":[[224,6]]},"248":{"position":[[583,6]]}}}],["input",{"_index":910,"t":{"134":{"position":[[1029,5]]},"187":{"position":[[626,5]]},"211":{"position":[[228,5]]}}}],["insert",{"_index":328,"t":{"45":{"position":[[49,6]]}}}],["insid",{"_index":548,"t":{"61":{"position":[[1906,6]]},"144":{"position":[[218,6]]},"193":{"position":[[244,6],[806,6]]}}}],["instal",{"_index":1049,"t":{"168":{"position":[[78,7],[137,7]]},"174":{"position":[[4,7]]},"193":{"position":[[342,7]]},"205":{"position":[[36,7],[726,9]]},"209":{"position":[[294,7]]},"242":{"position":[[325,7]]}}}],["instanc",{"_index":163,"t":{"6":{"position":[[300,8]]},"26":{"position":[[39,8]]},"63":{"position":[[148,9],[241,8],[1631,8],[1695,8],[1803,8],[1889,8]]},"65":{"position":[[1294,8]]},"76":{"position":[[638,8],[763,8]]},"82":{"position":[[29,8]]},"104":{"position":[[28,8]]},"124":{"position":[[104,8]]},"138":{"position":[[593,9],[762,8],[1159,8]]},"233":{"position":[[361,8]]},"242":{"position":[[485,8]]}}}],["instanti",{"_index":696,"t":{"63":{"position":[[2915,12]]}}}],["instantli",{"_index":1576,"t":{"288":{"position":[[895,9]]}}}],["instead",{"_index":411,"t":{"55":{"position":[[1278,7]]},"211":{"position":[[42,8],[751,8]]},"213":{"position":[[422,8],[712,8],[819,8]]},"221":{"position":[[50,7],[159,7]]},"242":{"position":[[242,8]]},"256":{"position":[[271,7]]},"264":{"position":[[178,7]]}}}],["instruct",{"_index":80,"t":{"4":{"position":[[343,8]]}}}],["integr",{"_index":689,"t":{"63":{"position":[[2793,9]]},"196":{"position":[[658,11]]}}}],["intend",{"_index":926,"t":{"134":{"position":[[2365,8]]},"152":{"position":[[4,8]]},"154":{"position":[[479,8]]}}}],["interact",{"_index":96,"t":{"4":{"position":[[603,9]]},"59":{"position":[[56,11],[195,11],[332,11],[467,11],[779,11],[977,11],[1191,11]]},"61":{"position":[[5002,11],[5401,11],[5509,12],[5600,11],[6027,11],[6709,11],[7388,11],[7717,11],[7810,11],[7920,12]]},"187":{"position":[[416,11],[576,8]]},"200":{"position":[[139,11]]},"213":{"position":[[1033,11]]},"217":{"position":[[279,11]]},"221":{"position":[[261,11]]},"244":{"position":[[284,11]]},"248":{"position":[[249,11],[345,11]]},"272":{"position":[[649,11],[735,12],[795,11],[857,11]]},"280":{"position":[[169,12],[646,12]]},"284":{"position":[[119,12]]},"288":{"position":[[739,14]]},"290":{"position":[[202,13]]}}}],["interactivelayerid",{"_index":485,"t":{"59":{"position":[[1322,20]]},"61":{"position":[[871,19],[1150,19],[1708,19],[2039,19],[2344,19],[2685,19],[3017,19],[3328,19],[3678,19],[3934,19],[4192,19],[4454,19]]},"221":{"position":[[311,19]]},"272":{"position":[[907,19]]}}}],["interactivemap",{"_index":1318,"t":{"211":{"position":[[0,14]]},"229":{"position":[[94,15],[110,14]]},"268":{"position":[[145,14]]},"272":{"position":[[25,14],[990,14]]},"280":{"position":[[578,14]]},"288":{"position":[[212,14]]},"290":{"position":[[0,14]]}}}],["interactivemap'",{"_index":1381,"t":{"219":{"position":[[69,16]]},"221":{"position":[[167,16]]}}}],["interest",{"_index":1032,"t":{"162":{"position":[[155,10]]}}}],["interfac",{"_index":182,"t":{"6":{"position":[[650,10]]},"63":{"position":[[2669,9],[2990,9]]},"134":{"position":[[2431,10]]},"294":{"position":[[107,10]]}}}],["intern",{"_index":651,"t":{"63":{"position":[[1577,8]]},"292":{"position":[[108,8]]}}}],["introduc",{"_index":1382,"t":{"219":{"position":[[139,10]]},"227":{"position":[[138,10]]},"237":{"position":[[216,10]]}}}],["invok",{"_index":1142,"t":{"187":{"position":[[363,7]]}}}],["isdrag",{"_index":1580,"t":{"292":{"position":[[148,11]]}}}],["ishov",{"_index":1579,"t":{"292":{"position":[[136,11]]}}}],["ispan",{"_index":1543,"t":{"272":{"position":[[758,10]]}}}],["isrot",{"_index":1545,"t":{"272":{"position":[[783,11]]}}}],["issourceload",{"_index":913,"t":{"134":{"position":[[1444,15]]}}}],["issu",{"_index":1001,"t":{"154":{"position":[[374,6]]},"244":{"position":[[99,6]]},"280":{"position":[[482,5]]}}}],["iszoom",{"_index":1544,"t":{"272":{"position":[[769,9]]}}}],["it'",{"_index":141,"t":{"4":{"position":[[1453,4]]},"138":{"position":[[627,4]]},"196":{"position":[[598,4]]},"200":{"position":[[931,4]]},"205":{"position":[[481,4],[1015,4]]},"209":{"position":[[370,4]]},"256":{"position":[[223,4]]}}}],["items.map(rendermark",{"_index":1233,"t":{"198":{"position":[[446,25],[1042,25]]}}}],["items.map(renderrow",{"_index":1235,"t":{"198":{"position":[[524,22]]}}}],["itself",{"_index":1097,"t":{"183":{"position":[[13,6]]}}}],["jan",{"_index":1481,"t":{"246":{"position":[[14,3]]},"254":{"position":[[14,3]]},"296":{"position":[[6,3]]}}}],["januari",{"_index":1549,"t":{"278":{"position":[[15,8]]}}}],["javascript",{"_index":706,"t":{"63":{"position":[[3200,10]]}}}],["js",{"_index":10,"t":{"2":{"position":[[104,2],[239,2],[279,3],[391,2],[429,3]]},"6":{"position":[[96,2]]},"183":{"position":[[137,2]]},"227":{"position":[[162,2]]},"252":{"position":[[39,2]]},"260":{"position":[[99,2]]},"264":{"position":[[80,2]]},"268":{"position":[[118,2]]},"288":{"position":[[17,3],[37,2],[347,2]]},"290":{"position":[[326,2]]}}}],["js'",{"_index":1524,"t":{"264":{"position":[[443,4]]}}}],["js/plugins/mapbox",{"_index":669,"t":{"63":{"position":[[2349,17]]}}}],["js/v2.4.0/mapbox",{"_index":637,"t":{"63":{"position":[[999,16]]}}}],["js/v/mapbox",{"_index":1057,"t":{"172":{"position":[[305,32]]}}}],["json",{"_index":374,"t":{"55":{"position":[[343,4],[442,5]]},"126":{"position":[[343,4],[447,4],[554,4],[660,4],[759,4],[863,4],[964,4],[1062,4],[1162,4],[1259,4],[1361,4],[1466,4],[1569,4],[1673,4],[1775,4],[1880,4],[1989,4]]}}}],["json.stringify(process.env.node_env",{"_index":1208,"t":{"196":{"position":[[1289,35],[1578,35]]}}}],["jsx",{"_index":315,"t":{"43":{"position":[[93,3]]},"45":{"position":[[350,3]]},"119":{"position":[[340,3]]}}}],["juli",{"_index":1547,"t":{"274":{"position":[[14,5]]},"286":{"position":[[14,4]]}}}],["june",{"_index":1460,"t":{"242":{"position":[[14,4]]}}}],["keep",{"_index":1457,"t":{"239":{"position":[[907,4]]}}}],["key",{"_index":320,"t":{"43":{"position":[[143,3]]},"61":{"position":[[3294,3]]},"119":{"position":[[391,3]]},"130":{"position":[[659,5]]},"144":{"position":[[144,4]]}}}],["key={vehicle.id",{"_index":1257,"t":{"200":{"position":[[697,16],[1132,16]]}}}],["keyboard",{"_index":474,"t":{"59":{"position":[[590,9],[632,8]]},"248":{"position":[[206,8]]},"280":{"position":[[99,8],[199,8]]},"284":{"position":[[58,8]]}}}],["keyboardhandl",{"_index":476,"t":{"59":{"position":[[668,15]]}}}],["know",{"_index":1275,"t":{"202":{"position":[[44,4]]}}}],["label",{"_index":1002,"t":{"154":{"position":[[381,5]]},"215":{"position":[[28,6]]},"256":{"position":[[52,5],[85,6]]}}}],["label=\"list",{"_index":1230,"t":{"198":{"position":[[330,12]]}}}],["label=\"map",{"_index":1228,"t":{"198":{"position":[[298,11]]}}}],["lag",{"_index":1262,"t":{"200":{"position":[[990,3]]}}}],["lambert",{"_index":388,"t":{"55":{"position":[[676,7],[839,7]]}}}],["lambertconformalcon",{"_index":389,"t":{"55":{"position":[[684,26]]}}}],["landus",{"_index":291,"t":{"39":{"position":[[295,10],[832,10]]}}}],["landuse_park",{"_index":289,"t":{"39":{"position":[[231,15],[768,15]]}}}],["languag",{"_index":676,"t":{"63":{"position":[[2488,10]]}}}],["larg",{"_index":1086,"t":{"181":{"position":[[300,5]]}}}],["last",{"_index":515,"t":{"61":{"position":[[374,4]]}}}],["lat",{"_index":878,"t":{"130":{"position":[[150,3],[165,3]]},"202":{"position":[[209,5],[297,6]]}}}],["later",{"_index":337,"t":{"45":{"position":[[309,5]]}}}],["latest",{"_index":27,"t":{"2":{"position":[[401,6]]},"154":{"position":[[404,7]]},"185":{"position":[[386,6]]},"217":{"position":[[614,6]]},"223":{"position":[[4,6]]},"264":{"position":[[48,6]]},"288":{"position":[[0,6]]},"298":{"position":[[0,6]]}}}],["latitud",{"_index":203,"t":{"8":{"position":[[302,9],[669,9]]},"17":{"position":[[298,9],[562,9]]},"30":{"position":[[300,9],[566,9]]},"39":{"position":[[487,9],[982,9]]},"49":{"position":[[328,9],[594,9]]},"57":{"position":[[86,9],[370,8],[712,9],[743,8],[1020,9],[1042,8]]},"61":{"position":[[5139,9]]},"73":{"position":[[278,9],[602,9]]},"76":{"position":[[107,9],[139,8]]},"86":{"position":[[300,9],[566,9]]},"95":{"position":[[367,9],[821,9]]},"98":{"position":[[245,9]]},"108":{"position":[[290,9],[546,9]]},"117":{"position":[[676,9],[1390,9]]},"130":{"position":[[114,9],[781,9],[804,8]]},"136":{"position":[[406,9]]},"170":{"position":[[200,9],[536,9]]},"177":{"position":[[610,9]]},"189":{"position":[[192,9]]},"191":{"position":[[211,9]]},"193":{"position":[[618,9]]},"233":{"position":[[428,9]]},"239":{"position":[[956,8]]},"276":{"position":[[90,9]]},"288":{"position":[[442,9]]},"290":{"position":[[385,9]]}}}],["latitude={37.8",{"_index":766,"t":{"82":{"position":[[570,15],[1147,15]]},"104":{"position":[[458,15],[855,15]]}}}],["latitude={40",{"_index":736,"t":{"73":{"position":[[377,13],[737,13]]},"95":{"position":[[481,13],[971,13]]}}}],["latitude={vehicle.coordinates[1",{"_index":1259,"t":{"200":{"position":[[749,34],[1184,34]]}}}],["layer",{"_index":286,"t":{"39":{"position":[[43,5],[122,7],[287,7],[562,6],[641,7],[824,7],[1093,6]]},"41":{"position":[[72,5],[177,6]]},"43":{"position":[[7,7],[97,6],[229,6],[320,6]]},"45":{"position":[[40,5],[61,5],[104,5],[145,6],[193,6],[239,6],[500,5],[550,7]]},"59":{"position":[[1534,7]]},"61":{"position":[[1016,6],[1295,6],[1746,5],[2184,6],[2382,5],[2830,6],[3162,6],[3473,6],[3823,6],[4079,6],[4337,6],[4599,6]]},"117":{"position":[[78,5],[177,6],[803,6],[902,6],[1553,6]]},"124":{"position":[[74,5]]},"126":{"position":[[381,5],[481,5],[596,5],[692,5],[794,5],[900,5],[996,5],[1096,5],[1196,5],[1290,5]]},"130":{"position":[[602,6],[609,5]]},"177":{"position":[[38,6],[66,5],[137,6],[692,6],[775,5],[880,7]]},"200":{"position":[[1573,6],[1580,6],[1978,6]]},"217":{"position":[[448,5]]},"221":{"position":[[289,5],[353,6]]},"231":{"position":[[213,6]]},"260":{"position":[[16,5]]},"272":{"position":[[807,6],[885,5],[949,6]]}}}],["layer(",{"_index":487,"t":{"59":{"position":[[1386,9]]},"61":{"position":[[1686,8],[2322,8]]}}}],["layer.t",{"_index":344,"t":{"47":{"position":[[0,8]]}}}],["layerref.getlay",{"_index":1378,"t":{"217":{"position":[[754,20]]}}}],["layerstyl",{"_index":829,"t":{"117":{"position":[[461,11],[810,15],[1204,11],[1560,15]]},"177":{"position":[[421,11],[699,15]]}}}],["layout",{"_index":1222,"t":{"198":{"position":[[175,7]]},"200":{"position":[[1999,9]]}}}],["lazi",{"_index":679,"t":{"63":{"position":[[2610,5]]}}}],["lead",{"_index":186,"t":{"6":{"position":[[706,4]]},"65":{"position":[[1157,4]]},"280":{"position":[[497,4]]}}}],["leak",{"_index":1118,"t":{"183":{"position":[[1212,7]]},"280":{"position":[[477,4]]}}}],["leav",{"_index":550,"t":{"61":{"position":[[2290,6],[2509,6]]}}}],["left",{"_index":232,"t":{"13":{"position":[[259,5],[292,6]]},"24":{"position":[[318,5],[351,6]]},"35":{"position":[[271,5],[304,6]]},"63":{"position":[[2526,5]]},"76":{"position":[[377,4]]},"91":{"position":[[268,5],[301,6]]},"98":{"position":[[19,6],[62,5],[92,5],[790,4]]},"113":{"position":[[130,5],[163,6]]},"128":{"position":[[42,6],[76,6],[136,5]]},"136":{"position":[[510,5]]},"138":{"position":[[1035,5],[1065,5]]}}}],["legaci",{"_index":1470,"t":{"244":{"position":[[130,6]]}}}],["length",{"_index":819,"t":{"111":{"position":[[43,6]]}}}],["less",{"_index":1410,"t":{"231":{"position":[[39,4]]}}}],["level",{"_index":434,"t":{"57":{"position":[[814,6],[1093,5],[1462,5],[1533,5]]},"61":{"position":[[5731,5],[5858,5],[6259,5]]},"130":{"position":[[856,6]]},"183":{"position":[[806,5]]}}}],["librari",{"_index":12,"t":{"2":{"position":[[118,10],[129,7]]},"6":{"position":[[99,8]]},"51":{"position":[[203,9]]},"63":{"position":[[431,7],[933,8],[2815,8]]},"130":{"position":[[577,7]]},"172":{"position":[[13,7]]},"181":{"position":[[118,10]]},"205":{"position":[[1006,8]]},"207":{"position":[[32,8],[159,8]]},"209":{"position":[[306,7]]},"213":{"position":[[68,8]]},"215":{"position":[[335,8]]},"231":{"position":[[285,7]]},"233":{"position":[[52,8]]},"244":{"position":[[58,8],[310,7]]},"248":{"position":[[55,7]]},"256":{"position":[[198,7]]},"260":{"position":[[239,7]]},"290":{"position":[[610,7]]}}}],["library'",{"_index":190,"t":{"8":{"position":[[36,9]]},"17":{"position":[[36,9]]},"30":{"position":[[36,9]]},"49":{"position":[[36,9]]},"51":{"position":[[299,9]]},"73":{"position":[[36,9]]},"86":{"position":[[36,9]]},"95":{"position":[[36,9]]},"108":{"position":[[36,9]]}}}],["licens",{"_index":1498,"t":{"252":{"position":[[105,7]]}}}],["light",{"_index":369,"t":{"55":{"position":[[142,6],[149,6],[156,5],[207,5]]},"126":{"position":[[124,6],[159,5]]}}}],["lightweight",{"_index":1305,"t":{"207":{"position":[[70,12]]},"244":{"position":[[318,12]]}}}],["limit",{"_index":1400,"t":{"227":{"position":[[118,11]]},"244":{"position":[[119,7]]}}}],["line",{"_index":856,"t":{"126":{"position":[[991,4]]},"196":{"position":[[488,5]]}}}],["linearinterpol",{"_index":1332,"t":{"211":{"position":[[664,18]]}}}],["linelay",{"_index":855,"t":{"126":{"position":[[951,10]]}}}],["link",{"_index":999,"t":{"154":{"position":[[357,4]]},"172":{"position":[[254,5],[458,5]]},"288":{"position":[[796,6]]}}}],["linux",{"_index":1041,"t":{"164":{"position":[[39,5]]}}}],["list",{"_index":352,"t":{"51":{"position":[[21,6],[165,4]]},"63":{"position":[[85,6]]},"162":{"position":[[295,5],[314,4]]},"172":{"position":[[411,4],[613,4]]},"205":{"position":[[1046,4]]},"209":{"position":[[82,5]]},"223":{"position":[[306,4]]},"252":{"position":[[338,4]]}}}],["listen",{"_index":490,"t":{"59":{"position":[[1448,9],[1664,9]]}}}],["live",{"_index":1577,"t":{"290":{"position":[[444,4]]}}}],["lng",{"_index":877,"t":{"130":{"position":[[142,3]]},"202":{"position":[[215,4]]}}}],["lnglat",{"_index":873,"t":{"130":{"position":[[0,7],[48,6]]},"134":{"position":[[269,7],[277,6],[687,7],[695,6],[718,8],[727,8],[2642,7],[2650,6]]}}}],["lnglatbound",{"_index":880,"t":{"130":{"position":[[181,13],[247,12]]},"134":{"position":[[1191,12]]}}}],["lnglatboundslik",{"_index":424,"t":{"57":{"position":[[278,16],[1702,17]]},"130":{"position":[[227,17]]}}}],["lnglatlik",{"_index":875,"t":{"130":{"position":[[34,11],[280,10]]}}}],["load",{"_index":43,"t":{"2":{"position":[[796,4]]},"26":{"position":[[443,6],[888,6]]},"61":{"position":[[506,6],[8090,5],[8224,5],[8369,5],[8429,5]]},"63":{"position":[[899,4],[1467,4],[3004,7],[3195,4]]},"183":{"position":[[490,4]]},"264":{"position":[[173,4]]}}}],["loader",{"_index":1065,"t":{"172":{"position":[[690,6]]},"181":{"position":[[329,7]]}}}],["loaders.gl",{"_index":1088,"t":{"181":{"position":[[316,10]]}}}],["local",{"_index":971,"t":{"150":{"position":[[74,7]]},"196":{"position":[[376,5]]},"215":{"position":[[64,6]]}}}],["locat",{"_index":492,"t":{"59":{"position":[[1488,8]]},"73":{"position":[[908,9]]},"76":{"position":[[162,9],[229,9]]},"98":{"position":[[570,8],[648,8]]},"134":{"position":[[1998,9],[2050,8],[2667,8]]}}}],["lock",{"_index":253,"t":{"22":{"position":[[524,4]]},"264":{"position":[[509,7]]}}}],["logic",{"_index":1145,"t":{"187":{"position":[[650,6]]},"193":{"position":[[124,5]]},"290":{"position":[[433,5]]},"294":{"position":[[99,7]]}}}],["lon",{"_index":879,"t":{"130":{"position":[[157,3]]}}}],["long",{"_index":129,"t":{"4":{"position":[[1170,4]]},"244":{"position":[[85,4]]}}}],["longer",{"_index":987,"t":{"152":{"position":[[180,6]]},"185":{"position":[[167,6]]},"205":{"position":[[21,6],[1162,6]]},"207":{"position":[[540,6]]},"209":{"position":[[75,6],[259,6],[378,6]]},"215":{"position":[[404,6]]},"217":{"position":[[143,6],[468,6]]},"221":{"position":[[77,6]]},"223":{"position":[[144,6]]},"242":{"position":[[310,6]]},"272":{"position":[[369,6]]},"288":{"position":[[459,6]]}}}],["longitud",{"_index":201,"t":{"8":{"position":[[285,10],[652,10]]},"17":{"position":[[281,10],[545,10]]},"30":{"position":[[283,10],[549,10]]},"39":{"position":[[468,10],[963,10]]},"49":{"position":[[309,10],[575,10]]},"57":{"position":[[75,10],[359,10],[640,10],[672,9],[968,10],[991,9]]},"61":{"position":[[5127,11]]},"73":{"position":[[261,10],[360,11],[585,10],[720,11]]},"76":{"position":[[172,10],[205,9]]},"82":{"position":[[551,11],[1128,11]]},"86":{"position":[[283,10],[549,10]]},"95":{"position":[[350,10],[464,11],[804,10],[954,11]]},"98":{"position":[[231,9]]},"104":{"position":[[439,11],[836,11]]},"108":{"position":[[273,10],[529,10]]},"117":{"position":[[657,10],[1371,10]]},"130":{"position":[[100,9],[728,10],[752,9]]},"136":{"position":[[387,10]]},"170":{"position":[[181,10],[517,10]]},"177":{"position":[[590,10]]},"189":{"position":[[175,10]]},"191":{"position":[[194,10]]},"193":{"position":[[601,10]]},"233":{"position":[[396,11]]},"239":{"position":[[945,10]]},"276":{"position":[[78,11]]},"288":{"position":[[428,9]]},"290":{"position":[[395,10]]}}}],["longitude={vehicle.coordinates[0",{"_index":1258,"t":{"200":{"position":[[714,34],[1149,34]]}}}],["look",{"_index":968,"t":{"148":{"position":[[95,7]]}}}],["ls",{"_index":1061,"t":{"172":{"position":[[433,2],[637,2]]}}}],["m",{"_index":1386,"t":{"219":{"position":[[267,1]]}}}],["made",{"_index":281,"t":{"35":{"position":[[160,4],[224,4]]}}}],["mail",{"_index":1035,"t":{"162":{"position":[[287,7],[306,7]]}}}],["main",{"_index":1418,"t":{"231":{"position":[[514,4]]}}}],["maintain",{"_index":755,"t":{"76":{"position":[[1068,11]]},"148":{"position":[[111,12]]},"162":{"position":[[24,11],[180,11]]}}}],["major",{"_index":1394,"t":{"223":{"position":[[201,5]]},"225":{"position":[[8,5]]},"231":{"position":[[301,8]]},"235":{"position":[[185,5]]},"264":{"position":[[544,5]]}}}],["make",{"_index":317,"t":{"43":{"position":[[117,4]]},"119":{"position":[[365,4]]},"162":{"position":[[128,6]]},"187":{"position":[[165,5]]},"196":{"position":[[65,4]]},"207":{"position":[[289,4]]},"237":{"position":[[81,4]]},"276":{"position":[[24,5]]}}}],["manag",{"_index":70,"t":{"4":{"position":[[195,6],[912,7],[1186,7],[1512,11]]},"57":{"position":[[245,10]]},"61":{"position":[[5171,10]]},"150":{"position":[[135,6]]},"187":{"position":[[297,7]]},"200":{"position":[[36,7]]},"213":{"position":[[636,6],[743,11]]}}}],["mani",{"_index":49,"t":{"2":{"position":[[896,4]]},"4":{"position":[[484,4]]},"198":{"position":[[123,4]]},"244":{"position":[[80,4]]}}}],["manipul",{"_index":340,"t":{"45":{"position":[[412,10]]}}}],["manual",{"_index":1218,"t":{"196":{"position":[[1937,8]]}}}],["map",{"_index":5,"t":{"2":{"position":[[52,3],[644,3],[801,3],[870,3],[933,3]]},"4":{"position":[[6,3],[356,3],[566,4],[676,3],[771,4],[1053,3],[1182,3],[1289,3],[1348,3]]},"6":{"position":[[15,3],[194,8],[296,3]]},"8":{"position":[[147,4],[185,3],[218,4],[498,7],[547,4],[585,3],[627,4],[901,7]]},"13":{"position":[[364,4]]},"17":{"position":[[145,4],[181,3],[214,4],[393,7],[442,4],[478,3],[520,4],[693,7]]},"22":{"position":[[397,3]]},"24":{"position":[[423,4]]},"26":{"position":[[227,4],[263,3],[520,5],[567,7],[657,4],[693,3],[965,5],[1012,7]]},"30":{"position":[[146,4],[183,3],[216,4],[396,7],[445,4],[482,3],[524,4],[698,7]]},"35":{"position":[[194,3],[373,4]]},"39":{"position":[[39,3],[117,4],[142,3],[187,3],[401,4],[587,7],[636,4],[661,3],[715,3],[938,4],[1118,7]]},"45":{"position":[[207,3]]},"49":{"position":[[46,3],[120,3],[191,3],[207,3],[242,4],[490,3],[506,3],[550,4]]},"51":{"position":[[39,3],[84,3],[199,3],[295,3]]},"53":{"position":[[12,3],[115,3]]},"55":{"position":[[137,4],[520,3],[1470,4]]},"57":{"position":[[56,4],[149,4],[187,3],[323,4],[689,3],[759,3],[880,4],[952,4],[1008,3],[1058,3],[1106,4],[1158,4],[1280,4],[1475,3],[1546,3],[1612,3],[1679,3],[1746,3]]},"59":{"position":[[1743,4]]},"61":{"position":[[53,3],[217,3],[293,3],[405,3],[613,3],[863,4],[1142,4],[1420,4],[1479,4],[1528,3],[1767,3],[1917,4],[1956,4],[2031,4],[2403,3],[2677,4],[2989,3],[3320,4],[3565,4],[3670,4],[3926,4],[4184,4],[4446,4],[4681,3],[4857,3],[5268,3],[5693,3],[5881,3],[6218,3],[6354,3],[6560,3],[6905,3],[7048,3],[7241,3],[7581,3],[8081,3]]},"63":{"position":[[51,3],[144,3],[237,3],[331,3],[383,3],[427,3],[447,3],[603,3],[619,3],[686,4],[804,3],[820,3],[853,4],[1081,3],[1097,3],[1130,4],[1249,3],[1545,3],[1627,3],[1661,3],[1691,3],[1756,3],[1799,3],[1851,3],[2130,3],[2196,5],[2953,5]]},"65":{"position":[[168,3],[184,3],[226,3],[392,4],[521,3],[537,3],[588,3],[763,4],[836,3],[1270,3]]},"69":{"position":[[36,3],[100,4],[177,5],[216,3],[311,4]]},"73":{"position":[[135,4],[161,3],[194,4],[443,7],[492,4],[518,3],[560,4],[803,7]]},"76":{"position":[[102,4],[406,5],[451,3],[493,4],[969,5],[1014,3],[1063,4],[1097,3],[1186,3]]},"82":{"position":[[228,4],[254,3],[537,5],[631,6],[788,4],[814,3],[1114,5],[1208,6]]},"86":{"position":[[146,4],[183,3],[216,4],[396,7],[445,4],[482,3],[524,4],[698,7]]},"91":{"position":[[370,4]]},"95":{"position":[[166,4],[191,3],[283,4],[572,7],[653,4],[678,3],[779,4],[1062,7]]},"98":{"position":[[337,3]]},"104":{"position":[[216,4],[241,3],[426,5],[508,7],[598,4],[623,3],[823,5],[905,7]]},"108":{"position":[[141,4],[173,3],[206,4],[381,7],[430,4],[462,3],[504,4],[673,7]]},"113":{"position":[[232,4]]},"117":{"position":[[39,3],[163,4],[196,3],[243,3],[603,4],[839,7],[888,4],[921,3],[977,3],[1346,4],[1589,7]]},"122":{"position":[[47,3]]},"124":{"position":[[122,3],[141,3]]},"130":{"position":[[769,3],[820,3],[903,4],[968,4]]},"134":{"position":[[81,3],[205,3],[441,3],[623,3],[913,3],[1125,3],[1281,3],[1401,3],[1656,3],[1767,3]]},"136":{"position":[[64,3],[134,4],[164,3],[333,4],[592,6]]},"138":{"position":[[42,6],[178,6],[235,6],[367,6],[421,6],[474,6],[618,3],[694,6],[794,6],[884,4],[899,6],[999,4],[1123,3]]},"142":{"position":[[59,3],[104,5],[130,3],[166,4],[198,6],[254,4],[390,5],[416,3],[461,4],[493,6],[549,4],[739,4],[854,4],[879,3],[929,4],[953,4],[1252,4],[1277,3],[1336,4],[1360,4]]},"144":{"position":[[104,4],[242,3],[338,4]]},"150":{"position":[[67,3]]},"156":{"position":[[6,3]]},"160":{"position":[[6,3]]},"162":{"position":[[45,3]]},"164":{"position":[[101,3]]},"168":{"position":[[12,3],[99,3],[158,3]]},"170":{"position":[[63,3],[79,3],[114,4],[432,3],[448,3],[492,4]]},"172":{"position":[[9,3],[124,3]]},"174":{"position":[[25,3],[80,4],[132,3],[148,3],[253,4]]},"177":{"position":[[123,4],[156,3],[203,3],[565,4],[728,6]]},"179":{"position":[[61,3],[237,4]]},"181":{"position":[[135,3]]},"183":{"position":[[6,3],[321,3],[416,5],[499,3],[561,4],[759,3],[976,3]]},"185":{"position":[[26,3],[134,3],[260,3],[409,3],[590,3],[701,3],[904,3],[1091,3]]},"187":{"position":[[28,4],[117,3],[258,3],[340,3],[359,3],[594,4]]},"189":{"position":[[101,3],[117,3],[150,4]]},"191":{"position":[[101,3],[117,3],[246,4],[434,3],[479,3]]},"193":{"position":[[0,3],[233,3],[310,3],[326,3],[922,4]]},"196":{"position":[[1716,3]]},"198":{"position":[[81,3],[394,4],[472,6],[630,3],[668,5],[683,3],[767,3],[980,4],[1068,6],[1127,3]]},"200":{"position":[[160,4],[256,4],[282,3],[577,4],[827,6],[923,4],[1284,4],[1379,6],[1832,4],[2099,6]]},"202":{"position":[[88,4],[313,4]]},"205":{"position":[[140,3],[269,3],[289,3],[305,3],[376,4],[522,3],[542,3],[558,3],[630,4],[1002,3],[1301,3]]},"207":{"position":[[155,3],[359,3],[400,3]]},"209":{"position":[[65,3],[99,3]]},"211":{"position":[[58,4],[100,3]]},"213":{"position":[[549,3],[910,3],[1137,3]]},"215":{"position":[[81,3]]},"217":{"position":[[207,3]]},"225":{"position":[[31,3]]},"227":{"position":[[48,3],[93,3]]},"229":{"position":[[4,3],[39,3]]},"231":{"position":[[278,3],[459,3],[525,3],[573,3]]},"235":{"position":[[208,3]]},"237":{"position":[[73,3]]},"239":{"position":[[48,3],[254,3],[296,3],[335,3],[375,3],[391,3],[675,3]]},"242":{"position":[[136,3],[208,3]]},"244":{"position":[[461,6]]},"252":{"position":[[207,3]]},"256":{"position":[[264,3]]},"260":{"position":[[253,3]]},"264":{"position":[[169,3],[189,3],[658,3]]},"272":{"position":[[90,3],[158,3],[644,4]]},"276":{"position":[[57,3]]},"280":{"position":[[326,3],[430,5],[604,3]]},"284":{"position":[[115,3],[149,3],[301,3]]},"288":{"position":[[548,4],[735,3]]},"290":{"position":[[223,4]]},"300":{"position":[[137,4],[247,3],[445,3]]}}}],["map'",{"_index":137,"t":{"4":{"position":[[1400,5]]},"6":{"position":[[366,5],[465,5]]},"55":{"position":[[305,5]]},"61":{"position":[[2520,5],[8212,5],[8355,5]]},"63":{"position":[[1285,5],[2418,5]]},"144":{"position":[[158,5]]},"215":{"position":[[58,5]]}}}],["map(",{"_index":662,"t":{"63":{"position":[[1985,7]]}}}],["map.easeto",{"_index":1334,"t":{"211":{"position":[[722,12]]},"213":{"position":[[790,12]]}}}],["map.flyto",{"_index":83,"t":{"4":{"position":[[390,11]]},"211":{"position":[[739,11]]},"213":{"position":[[807,11]]}}}],["map.flyto({cent",{"_index":951,"t":{"142":{"position":[[295,18],[590,18]]}}}],["map.getsourc",{"_index":894,"t":{"132":{"position":[[79,13]]}}}],["map.project",{"_index":1079,"t":{"179":{"position":[[118,13]]}}}],["map.setmaxzoom",{"_index":169,"t":{"6":{"position":[[426,14]]}}}],["map.tsx",{"_index":727,"t":{"67":{"position":[[0,7]]},"71":{"position":[[4,7]]},"146":{"position":[[4,7]]}}}],["mapbox",{"_index":9,"t":{"2":{"position":[[94,6],[174,6],[215,6],[229,6],[269,6],[341,6],[367,6],[381,6],[419,6],[484,6],[566,6],[596,6],[662,6]]},"4":{"position":[[67,6],[299,6],[1212,6],[1333,6]]},"6":{"position":[[86,6]]},"8":{"position":[[71,7],[92,6]]},"13":{"position":[[155,7]]},"17":{"position":[[69,7],[90,6]]},"24":{"position":[[153,7]]},"26":{"position":[[131,6],[298,7]]},"30":{"position":[[70,7],[91,6]]},"39":{"position":[[62,6],[269,9],[806,9]]},"41":{"position":[[65,6]]},"45":{"position":[[519,6]]},"49":{"position":[[56,7],[128,6]]},"51":{"position":[[106,7]]},"55":{"position":[[311,6],[397,6]]},"59":{"position":[[99,7],[246,7],[378,7],[569,7],[684,7],[884,7],[1301,7]]},"63":{"position":[[61,7],[649,7],[1218,6],[2745,6],[2943,6],[3012,6]]},"65":{"position":[[70,6],[848,7],[1274,7]]},"73":{"position":[[59,7],[80,6]]},"76":{"position":[[666,7]]},"80":{"position":[[143,7]]},"82":{"position":[[121,6],[284,7]]},"86":{"position":[[70,7],[91,6]]},"91":{"position":[[154,7]]},"95":{"position":[[58,7],[79,6]]},"102":{"position":[[142,7]]},"104":{"position":[[120,6],[271,7]]},"108":{"position":[[65,7],[86,6]]},"117":{"position":[[108,6]]},"119":{"position":[[65,6]]},"126":{"position":[[38,6],[404,6],[504,6],[619,6],[715,6],[817,6],[923,6],[1019,6],[1119,6],[1219,6],[1313,6],[1420,6],[1523,6],[1626,6],[1731,6],[1833,6],[1942,6]]},"132":{"position":[[93,7],[176,7],[253,7],[330,7],[508,6],[556,7]]},"134":{"position":[[85,7],[209,7],[445,7],[627,7],[917,7],[1129,7],[1285,7],[1405,7],[1660,7],[1771,7],[1816,7],[1933,7],[2170,7],[2520,7],[2622,7],[2766,7]]},"142":{"position":[[81,6],[817,6]]},"168":{"position":[[58,6],[106,6]]},"170":{"position":[[0,6],[325,6],[371,6]]},"172":{"position":[[227,6],[380,6],[416,6],[436,6],[734,6],[765,7]]},"174":{"position":[[35,6],[191,6],[277,6]]},"177":{"position":[[24,6],[810,6]]},"183":{"position":[[77,6],[127,6],[182,6],[212,6],[237,6],[278,6],[422,6],[576,6],[618,6],[641,6],[1240,6]]},"185":{"position":[[52,6],[188,6],[239,6],[455,7],[487,6],[626,6],[917,6]]},"187":{"position":[[248,6]]},"196":{"position":[[8,6],[82,6]]},"198":{"position":[[717,6]]},"205":{"position":[[44,6],[501,6],[736,6],[980,6],[1121,6],[1189,6]]},"207":{"position":[[647,7]]},"209":{"position":[[4,6],[164,6]]},"215":{"position":[[137,6]]},"219":{"position":[[8,6],[126,6]]},"223":{"position":[[11,6]]},"227":{"position":[[152,6]]},"231":{"position":[[188,6]]},"237":{"position":[[199,6]]},"242":{"position":[[76,6],[333,6]]},"244":{"position":[[430,6],[691,6],[707,6]]},"252":{"position":[[29,6],[93,6],[173,6]]},"260":{"position":[[89,6]]},"264":{"position":[[70,6],[311,6],[433,6],[483,6]]},"268":{"position":[[108,6]]},"280":{"position":[[162,6],[243,6],[458,6],[544,6]]},"284":{"position":[[259,6],[342,6]]},"288":{"position":[[7,6],[27,6],[337,6]]},"290":{"position":[[316,6]]},"298":{"position":[[7,6],[23,6]]},"300":{"position":[[66,6]]}}}],["mapbox'",{"_index":45,"t":{"2":{"position":[[815,8]]},"63":{"position":[[2055,8]]},"183":{"position":[[525,8]]},"264":{"position":[[125,8],[389,8]]},"272":{"position":[[322,8]]},"280":{"position":[[43,8]]}}}],["mapbox/mapbox",{"_index":932,"t":{"136":{"position":[[101,15]]}}}],["mapbox://styles/mapbox/light",{"_index":1340,"t":{"213":{"position":[[311,29]]}}}],["mapboxaccesstoken",{"_index":640,"t":{"63":{"position":[[1166,18]]},"183":{"position":[[946,17],[998,17]]},"213":{"position":[[105,17]]}}}],["mapboxaccesstoken=\"gotoggl",{"_index":770,"t":{"82":{"position":[[646,28],[1223,28]]}}}],["onclickfeatures((tru",{"_index":783,"t":{"95":{"position":[[251,24],[747,24]]}}}],["usual",{"_index":532,"t":{"61":{"position":[[823,8],[1101,8],[1382,8],[1636,8],[1859,8],[2272,8],[2491,8],[2610,8],[2916,8]]}}}],["util",{"_index":1036,"t":{"162":{"position":[[331,8]]},"209":{"position":[[331,7]]},"233":{"position":[[14,7]]}}}],["v0.31.0",{"_index":1587,"t":{"298":{"position":[[36,7]]}}}],["v0.38.0",{"_index":1401,"t":{"227":{"position":[[165,7]]}}}],["v0.40.1",{"_index":1567,"t":{"284":{"position":[[269,7]]}}}],["v0.6",{"_index":1448,"t":{"239":{"position":[[266,4]]}}}],["v1",{"_index":17,"t":{"2":{"position":[[184,3],[242,2]]},"205":{"position":[[1131,3]]},"209":{"position":[[171,3]]},"237":{"position":[[26,3],[61,2]]}}}],["v1.0",{"_index":1447,"t":{"239":{"position":[[210,4]]},"264":{"position":[[83,5]]}}}],["v2",{"_index":26,"t":{"2":{"position":[[394,2]]},"205":{"position":[[1138,4]]},"209":{"position":[[175,2]]},"219":{"position":[[136,2]]},"229":{"position":[[202,2]]},"237":{"position":[[0,2]]}}}],["v2.0",{"_index":1119,"t":{"185":{"position":[[198,4]]},"198":{"position":[[711,5]]},"252":{"position":[[56,5]]}}}],["v3",{"_index":1395,"t":{"225":{"position":[[0,2]]},"229":{"position":[[21,2]]}}}],["v4",{"_index":1442,"t":{"237":{"position":[[136,2],[256,3]]}}}],["v5",{"_index":1309,"t":{"207":{"position":[[366,2]]},"244":{"position":[[109,2],[906,2]]}}}],["v6",{"_index":1310,"t":{"207":{"position":[[373,3]]},"244":{"position":[[116,2],[913,3]]}}}],["v6.4.0",{"_index":1398,"t":{"227":{"position":[[62,9]]}}}],["v7",{"_index":1301,"t":{"207":{"position":[[0,2],[558,3]]},"244":{"position":[[26,2]]}}}],["v7.0",{"_index":147,"t":{"6":{"position":[[3,5]]},"211":{"position":[[180,4]]}}}],["v7.0.tsx",{"_index":1283,"t":{"205":{"position":[[273,8]]}}}],["v7.1.tsx",{"_index":1287,"t":{"205":{"position":[[526,8]]}}}],["v9",{"_index":208,"t":{"8":{"position":[[370,3]]},"17":{"position":[[366,3]]},"30":{"position":[[368,3]]},"39":{"position":[[556,3]]},"49":{"position":[[431,3]]},"73":{"position":[[346,3]]},"86":{"position":[[368,3]]},"95":{"position":[[435,3]]},"108":{"position":[[358,3]]},"117":{"position":[[745,3]]},"136":{"position":[[477,3]]},"170":{"position":[[303,3]]},"189":{"position":[[260,3]]},"191":{"position":[[351,3]]},"193":{"position":[[999,3]]},"198":{"position":[[440,3],[1036,3]]},"200":{"position":[[654,3],[1361,3],[1909,3]]},"213":{"position":[[341,3]]}}}],["valid",{"_index":1380,"t":{"219":{"position":[[2,5]]}}}],["valu",{"_index":174,"t":{"6":{"position":[[510,5]]},"51":{"position":[[253,7]]},"59":{"position":[[518,5],[830,5],[1028,5],[1242,5]]},"63":{"position":[[466,5]]},"76":{"position":[[586,5],[910,5]]},"144":{"position":[[175,6]]},"213":{"position":[[288,5]]},"219":{"position":[[60,5]]},"229":{"position":[[732,6]]}}}],["value=\"map",{"_index":1229,"t":{"198":{"position":[[310,11],[381,12],[967,12]]}}}],["value=\"t",{"_index":1231,"t":{"198":{"position":[[343,13],[501,14]]}}}],["value={selectedtab",{"_index":1225,"t":{"198":{"position":[[235,20]]}}}],["variabl",{"_index":1113,"t":{"183":{"position":[[1028,8],[1191,8]]},"196":{"position":[[434,8],[734,9],[1878,8]]}}}],["vector",{"_index":867,"t":{"126":{"position":[[1700,6]]},"132":{"position":[[492,6],[515,6]]},"185":{"position":[[666,6],[924,6]]}}}],["vectorsourceraw",{"_index":866,"t":{"126":{"position":[[1654,16]]}}}],["vectortilesourc",{"_index":901,"t":{"132":{"position":[[454,17],[539,16]]}}}],["vehicl",{"_index":1249,"t":{"200":{"position":[[380,8],[793,7],[1228,7],[1262,12],[1794,9],[1810,12],[2023,8]]}}}],["vehicles.map(vehicl",{"_index":1256,"t":{"200":{"position":[[662,21],[1098,20],[1738,20]]}}}],["vehiclesgeojson",{"_index":1268,"t":{"200":{"position":[[1658,15]]}}}],["veri",{"_index":1140,"t":{"187":{"position":[[226,4]]},"200":{"position":[[112,4]]}}}],["version",{"_index":3,"t":{"2":{"position":[[37,8],[258,7],[288,7],[408,7],[443,7]]},"63":{"position":[[918,7]]},"156":{"position":[[34,10]]},"172":{"position":[[387,7],[589,7]]},"183":{"position":[[140,7]]},"185":{"position":[[350,7]]},"205":{"position":[[949,7],[1096,7]]},"207":{"position":[[511,8]]},"217":{"position":[[261,9]]},"227":{"position":[[9,7]]},"235":{"position":[[191,7]]},"237":{"position":[[125,7],[160,7]]},"242":{"position":[[102,7]]},"252":{"position":[[242,8]]},"264":{"position":[[103,8]]},"302":{"position":[[15,7]]}}}],["version'",{"_index":1291,"t":{"205":{"position":[[831,9]]}}}],["via",{"_index":165,"t":{"6":{"position":[[318,3]]},"26":{"position":[[62,3]]},"65":{"position":[[34,3],[1227,3]]},"82":{"position":[[52,3]]},"98":{"position":[[227,3]]},"104":{"position":[[51,3]]},"162":{"position":[[281,3]]},"187":{"position":[[344,3]]},"217":{"position":[[501,3]]},"239":{"position":[[174,3]]},"242":{"position":[[494,3]]},"300":{"position":[[345,3]]}}}],["video",{"_index":864,"t":{"126":{"position":[[1493,5]]},"132":{"position":[[230,6]]}}}],["videosourc",{"_index":896,"t":{"132":{"position":[[197,12],[241,11]]}}}],["videosourceraw",{"_index":863,"t":{"126":{"position":[[1448,15]]}}}],["view",{"_index":416,"t":{"57":{"position":[[38,4]]},"61":{"position":[[4714,4],[4835,4],[4925,4],[5110,4],[5304,4]]},"134":{"position":[[969,4]]},"187":{"position":[[80,4],[186,4],[309,4],[393,4]]},"193":{"position":[[778,4]]},"264":{"position":[[193,6]]}}}],["viewport",{"_index":450,"t":{"57":{"position":[[1407,9]]},"76":{"position":[[414,10],[498,8],[545,9],[977,10],[1110,8],[1164,9],[1223,9]]},"209":{"position":[[191,8],[343,8]]},"229":{"position":[[286,8],[411,8],[606,10],[661,13],[742,10],[765,13]]},"231":{"position":[[577,9]]},"233":{"position":[[136,9],[171,8]]},"256":{"position":[[172,8]]},"260":{"position":[[107,8]]},"280":{"position":[[0,8]]},"288":{"position":[[394,8]]},"290":{"position":[[342,8]]}}}],["viewport.fitbound",{"_index":1423,"t":{"233":{"position":[[248,19]]}}}],["viewstat",{"_index":892,"t":{"130":{"position":[[680,10]]},"134":{"position":[[937,10],[948,9]]},"191":{"position":[[149,11],[251,14]]},"193":{"position":[[556,11],[927,14]]},"200":{"position":[[318,9],[582,14],[1289,14],[1837,14]]},"276":{"position":[[4,9],[224,9]]}}}],["viewstate.latitud",{"_index":1169,"t":{"193":{"position":[[738,20]]}}}],["viewstate.longitud",{"_index":1168,"t":{"193":{"position":[[716,21]]}}}],["viewstatechangeev",{"_index":573,"t":{"61":{"position":[[4627,21],[4747,21],[5215,21],[5342,21],[5437,21],[5541,21],[5639,21],[5765,21],[6165,21],[6300,21],[6436,21],[6852,21],[6994,21],[7123,21],[7528,21]]},"134":{"position":[[820,21]]}}}],["virtual",{"_index":1367,"t":{"217":{"position":[[114,11]]}}}],["vis.gl",{"_index":1013,"t":{"158":{"position":[[0,6]]},"160":{"position":[[44,6]]},"162":{"position":[[228,6]]},"181":{"position":[[157,6]]}}}],["visibl",{"_index":494,"t":{"59":{"position":[[1509,7]]},"61":{"position":[[1663,7],[2299,7]]},"200":{"position":[[1012,8]]},"202":{"position":[[73,7]]},"213":{"position":[[444,7]]}}}],["visit",{"_index":1480,"t":{"244":{"position":[[848,5]]}}}],["visitor",{"_index":1177,"t":{"196":{"position":[[168,7]]}}}],["visual",{"_index":60,"t":{"4":{"position":[[41,13],[177,14]]},"61":{"position":[[182,8]]},"181":{"position":[[42,13],[104,13],[208,13],[283,13],[365,13]]}}}],["visual/interact",{"_index":1005,"t":{"154":{"position":[[501,18]]}}}],["visualizepitch",{"_index":778,"t":{"91":{"position":[[204,14]]}}}],["vnext",{"_index":1004,"t":{"154":{"position":[[423,7]]}}}],["void",{"_index":241,"t":{"22":{"position":[[44,5],[162,5],[291,5],[463,5],[585,5]]},"61":{"position":[[31,5],[104,5],[267,5],[351,5],[591,5],[667,5],[787,5],[1065,5],[1346,5],[1600,5],[1823,5],[2236,5],[2458,5],[2574,5],[2880,5],[3215,5],[3515,5],[3615,5],[3873,5],[4130,5],[4390,5],[4652,5],[4772,5],[5240,5],[5367,5],[5462,5],[5566,5],[5664,5],[5790,5],[6190,5],[6325,5],[6461,5],[6877,5],[7019,5],[7148,5],[7553,5],[7686,5],[7779,5],[7872,5],[8059,5],[8190,5],[8326,5]]},"78":{"position":[[28,5],[111,5],[202,5],[290,5]]},"100":{"position":[[29,5],[98,5]]},"134":{"position":[[306,4],[514,4],[758,4]]},"138":{"position":[[272,5],[458,5],[511,5],[831,4],[936,4]]}}}],["wait",{"_index":1528,"t":{"264":{"position":[[621,7]]}}}],["want",{"_index":53,"t":{"2":{"position":[[953,4]]},"69":{"position":[[158,4]]},"202":{"position":[[36,4]]}}}],["warn",{"_index":1433,"t":{"235":{"position":[[116,7]]},"284":{"position":[[286,8]]},"292":{"position":[[99,8]]}}}],["way",{"_index":1110,"t":{"183":{"position":[[854,4]]},"187":{"position":[[14,4]]},"200":{"position":[[1025,3]]}}}],["web",{"_index":64,"t":{"4":{"position":[[116,3]]},"61":{"position":[[1457,3]]},"63":{"position":[[2903,3]]},"181":{"position":[[236,4]]}}}],["webgl",{"_index":105,"t":{"4":{"position":[[734,5]]},"181":{"position":[[251,5]]},"200":{"position":[[1603,5]]}}}],["webmercatorviewport",{"_index":1421,"t":{"233":{"position":[[111,19],[373,19]]},"256":{"position":[[128,19]]}}}],["webmercatorviewport({width",{"_index":1422,"t":{"233":{"position":[[186,27]]}}}],["webpack",{"_index":683,"t":{"63":{"position":[[2716,7]]},"172":{"position":[[702,7]]},"196":{"position":[[1123,7]]}}}],["webpack.config.j",{"_index":1203,"t":{"196":{"position":[[1142,17]]}}}],["websit",{"_index":1105,"t":{"183":{"position":[[690,8]]}}}],["webwork",{"_index":687,"t":{"63":{"position":[[2757,9],[3024,9]]}}}],["welcom",{"_index":967,"t":{"148":{"position":[[66,8]]}}}],["well",{"_index":122,"t":{"4":{"position":[[1060,4]]},"181":{"position":[[461,4]]}}}],["west",{"_index":884,"t":{"130":{"position":[[344,6]]}}}],["what'",{"_index":1405,"t":{"229":{"position":[[592,6]]}}}],["wheel",{"_index":562,"t":{"61":{"position":[[3535,5]]},"248":{"position":[[112,5]]}}}],["wheelev",{"_index":908,"t":{"134":{"position":[[481,10]]}}}],["whenev",{"_index":512,"t":{"61":{"position":[[280,8]]},"154":{"position":[[77,8]]},"179":{"position":[[78,8]]},"239":{"position":[[826,8]]}}}],["wherein",{"_index":705,"t":{"63":{"position":[[3164,7]]}}}],["wherev",{"_index":152,"t":{"6":{"position":[[108,8]]},"244":{"position":[[496,8]]}}}],["whether",{"_index":1101,"t":{"183":{"position":[[380,7]]}}}],["width",{"_index":362,"t":{"53":{"position":[[84,6]]},"98":{"position":[[895,6]]},"213":{"position":[[431,5]]},"229":{"position":[[263,5],[358,5],[425,5],[543,7],[687,7]]},"272":{"position":[[94,5]]},"288":{"position":[[409,6]]},"290":{"position":[[370,6]]}}}],["width={500",{"_index":1407,"t":{"229":{"position":[[636,11],[779,11]]}}}],["winkel",{"_index":392,"t":{"55":{"position":[[770,6]]}}}],["winkeltripel",{"_index":394,"t":{"55":{"position":[[784,17]]}}}],["within",{"_index":493,"t":{"59":{"position":[[1500,6]]},"61":{"position":[[852,6],[1131,6],[1409,6],[2020,6],[3309,6],[3554,6],[3659,6],[3915,6],[4173,6],[4435,6]]},"98":{"position":[[326,6]]}}}],["without",{"_index":19,"t":{"2":{"position":[[205,7],[357,7]]},"65":{"position":[[890,7]]},"183":{"position":[[566,7]]},"185":{"position":[[40,7]]},"200":{"position":[[1493,7]]},"244":{"position":[[596,7]]},"264":{"position":[[613,7]]}}}],["work",{"_index":1053,"t":{"172":{"position":[[159,4]]},"187":{"position":[[220,5]]},"207":{"position":[[547,5]]},"235":{"position":[[97,4]]},"280":{"position":[[444,4]]},"292":{"position":[[79,4]]}}}],["worker",{"_index":695,"t":{"63":{"position":[[2907,7]]}}}],["workerclass",{"_index":680,"t":{"63":{"position":[[2622,12]]}}}],["workercount",{"_index":694,"t":{"63":{"position":[[2857,12]]}}}],["workerurl",{"_index":693,"t":{"63":{"position":[[2846,10],[2959,10]]}}}],["world",{"_index":406,"t":{"55":{"position":[[1075,5]]},"82":{"position":[[428,9],[1005,9]]},"191":{"position":[[368,5]]}}}],["wrap",{"_index":188,"t":{"8":{"position":[[21,5]]},"17":{"position":[[21,5]]},"30":{"position":[[21,5]]},"49":{"position":[[21,5]]},"69":{"position":[[126,4]]},"73":{"position":[[21,5]]},"86":{"position":[[21,5]]},"95":{"position":[[21,5]]},"108":{"position":[[21,5]]},"207":{"position":[[147,7]]},"213":{"position":[[60,7]]}}}],["wrapper",{"_index":135,"t":{"4":{"position":[[1321,7]]},"136":{"position":[[44,8]]},"183":{"position":[[65,7]]},"290":{"position":[[51,7],[301,7]]}}}],["wrapper'",{"_index":156,"t":{"6":{"position":[[158,9]]}}}],["written",{"_index":677,"t":{"63":{"position":[[2509,7]]},"244":{"position":[[794,7]]}}}],["x",{"_index":888,"t":{"130":{"position":[[469,1]]}}}],["xia",{"_index":1027,"t":{"162":{"position":[[20,3]]}}}],["xiaoji",{"_index":1024,"t":{"162":{"position":[[0,6]]}}}],["xintong",{"_index":1026,"t":{"162":{"position":[[12,7]]}}}],["y",{"_index":889,"t":{"130":{"position":[[475,1]]}}}],["yarn",{"_index":974,"t":{"150":{"position":[[127,4],[180,4],[195,4],[213,4],[239,4],[314,4]]},"154":{"position":[[6,4]]},"172":{"position":[[406,4],[608,4]]}}}],["you'll",{"_index":1432,"t":{"235":{"position":[[102,7]]}}}],["yourauthtoken",{"_index":1137,"t":{"185":{"position":[[1324,13]]}}}],["zoom",{"_index":205,"t":{"8":{"position":[[316,5],[683,5]]},"17":{"position":[[312,5],[576,5]]},"30":{"position":[[314,5],[580,5]]},"39":{"position":[[503,5],[998,5]]},"49":{"position":[[344,5],[610,5]]},"55":{"position":[[1104,6]]},"57":{"position":[[96,4],[383,4],[782,5],[809,4],[1070,5],[1088,4],[1457,4],[1528,4]]},"59":{"position":[[50,5],[189,5],[773,5],[1185,5]]},"61":{"position":[[5149,4],[5726,4],[5853,4],[5954,4],[6135,4],[6254,4],[6636,4],[7315,4],[7711,5],[7804,5],[7914,5]]},"73":{"position":[[292,5],[616,5]]},"86":{"position":[[314,5],[580,5]]},"95":{"position":[[381,5],[835,5]]},"108":{"position":[[304,5],[560,5]]},"117":{"position":[[692,5],[1406,5]]},"130":{"position":[[832,5],[851,4]]},"136":{"position":[[422,5]]},"170":{"position":[[216,5],[552,5]]},"177":{"position":[[627,5]]},"189":{"position":[[206,5]]},"191":{"position":[[225,5]]},"193":{"position":[[632,5]]},"233":{"position":[[458,5]]},"239":{"position":[[969,6]]},"276":{"position":[[100,5]]},"280":{"position":[[293,7]]},"288":{"position":[[125,4],[423,4]]}}}]],"pipeline":["stemmer"]}}] \ No newline at end of file diff --git a/search.html b/search.html index 3d46abaf..2ba4cfbe 100644 --- a/search.html +++ b/search.html @@ -4,13 +4,13 @@ Search the documentation - +

Search the documentation

- + \ No newline at end of file