{"componentChunkName":"component---node-modules-gatsby-theme-ocular-src-react-templates-documentation-jsx","path":"/docs/api-reference/interactive-map","result":{"data":{"docBySlug":{"body":"function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\n/* @jsxRuntime classic */\n\n/* @jsx mdx */\nvar _frontmatter = {};\nvar layoutProps = {\n  _frontmatter: _frontmatter\n};\nvar MDXLayout = \"wrapper\";\nreturn function MDXContent(_ref) {\n  var components = _ref.components,\n      props = _objectWithoutProperties(_ref, [\"components\"]);\n\n  return mdx(MDXLayout, _extends({}, layoutProps, props, {\n    components: components,\n    mdxType: \"MDXLayout\"\n  }), mdx(\"h1\", {\n    \"id\": \"interactivemap\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h1\",\n    \"href\": \"#interactivemap\",\n    \"aria-label\": \"interactivemap permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"InteractiveMap\"), mdx(\"p\", null, mdx(\"img\", {\n    parentName: \"p\",\n    \"src\": \"https://img.shields.io/badge/since-v3.0-green\",\n    \"alt\": \"Since v3.0\"\n  })), mdx(\"p\", null, \"This component renders \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"MapboxGL\"), \" and provides full interactivity support.\\nIt uses \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"StaticMap\"), \" underneath to render the final map component.\\nThis is the \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"default\"), \" exported component from \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"react-map-gl\"), \".\"), mdx(\"div\", {\n    \"className\": \"gatsby-highlight\",\n    \"data-language\": \"js\"\n  }, mdx(\"pre\", {\n    parentName: \"div\",\n    \"className\": \"language-js\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-js\"\n  }, mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token keyword\"\n  }, \"import\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \"*\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token keyword\"\n  }, \"as\"), \" React \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token keyword\"\n  }, \"from\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token string\"\n  }, \"'react'\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \";\"), \"\\n\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token keyword\"\n  }, \"import\"), \" ReactMapGL \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token keyword\"\n  }, \"from\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token string\"\n  }, \"'react-map-gl'\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \";\"), \"\\n\\n\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token keyword\"\n  }, \"function\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token function\"\n  }, \"App\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"(\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \")\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"{\"), \"\\n  \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token keyword\"\n  }, \"const\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"[\"), \"viewport\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \",\"), \" setViewport\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"]\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \"=\"), \" React\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \".\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token function\"\n  }, \"useState\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"(\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"{\"), \"\\n    longitude\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \":\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \"-\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token number\"\n  }, \"122.45\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \",\"), \"\\n    latitude\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \":\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token number\"\n  }, \"37.78\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \",\"), \"\\n    zoom\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \":\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token number\"\n  }, \"14\"), \"\\n  \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"}\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \")\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \";\"), \"\\n  \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token keyword\"\n  }, \"return\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"(\"), \"\\n    \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \"<\"), \"ReactMapGL \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"{\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \"...\"), \"viewport\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"}\"), \" width\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \"=\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token string\"\n  }, \"\\\"100vw\\\"\"), \" height\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \"=\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token string\"\n  }, \"\\\"100vh\\\"\"), \" onViewportChange\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \"=\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"{\"), \"setViewport\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"}\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \"/\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \">\"), \"\\n  \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \")\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \";\"), \"\\n\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"}\")))), mdx(\"h2\", {\n    \"id\": \"properties\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h2\",\n    \"href\": \"#properties\",\n    \"aria-label\": \"properties permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"Properties\"), mdx(\"h3\", {\n    \"id\": \"initialization\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h3\",\n    \"href\": \"#initialization\",\n    \"aria-label\": \"initialization permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"Initialization\"), mdx(\"p\", null, \"Inherit the following props from \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/static-map.md\"\n  }, \"StaticMap\"), \":\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"attributionControl\"), \" (Boolean)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"disableTokenWarning\"), \" (Boolean)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"gl\"), \" (WebGLContext)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"mapboxApiAccessToken\"), \" (String)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"mapboxApiUrl\"), \" (String)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"mapOptions\"), \" (Object)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"preserveDrawingBuffer\"), \" (Boolean)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"preventStyleDiffing\"), \" (Boolean)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"reuseMaps\"), \" (Boolean)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"transformRequest\"), \" (Function)\")), mdx(\"h3\", {\n    \"id\": \"map-state\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h3\",\n    \"href\": \"#map-state\",\n    \"aria-label\": \"map state permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"Map State\"), mdx(\"p\", null, \"Inherit the following props from \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/static-map.md\"\n  }, \"StaticMap\"), \":\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"mapStyle\"), \" (String | Object | Immutable.Map)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"width\"), \" (Number | String)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"height\"), \" (Number | String)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"latitude\"), \" (Number)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"longitude\"), \" (Number)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"zoom\"), \" (Number)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"bearing\"), \" (Number)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"pitch\"), \" (Number)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"altitude\"), \" (Number)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"viewState\"), \" (Object)\")), mdx(\"h3\", {\n    \"id\": \"render-options\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h3\",\n    \"href\": \"#render-options\",\n    \"aria-label\": \"render options permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"Render Options\"), mdx(\"p\", null, \"Inherit the following props from \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/static-map.md\"\n  }, \"StaticMap\"), \":\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"style\"), \" (Object)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"visible\"), \" (Boolean)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"visibilityConstraints\"), \" (Object)\")), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textgetcursorcode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textgetcursorcode-function\",\n    \"aria-label\": \"code classlanguage textgetcursorcode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"getCursor\"), \" (Function)\"), mdx(\"p\", null, \"Accessor that returns a cursor style to show interactive state. Called when the component is being rendered.\"), mdx(\"p\", null, \"Parameters\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"state\"), \" - The current state of the component.\", mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"state.isDragging\"), \" - If the map is being dragged.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"state.isHovering\"), \" - If the pointer is over an interactive feature. See \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"interactiveLayerIds\"), \" prop.\")))), mdx(\"p\", null, \"The default implementation of \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"getCursor\"), \" returns \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"'pointer'\"), \" if \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"isHovering\"), \", \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"'grabbing'\"), \" if \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"isDragging\"), \" and \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"'grab'\"), \" otherwise.\"), mdx(\"h3\", {\n    \"id\": \"interaction-options\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h3\",\n    \"href\": \"#interaction-options\",\n    \"aria-label\": \"interaction options permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"Interaction Options\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textmaxzoomcode-number\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textmaxzoomcode-number\",\n    \"aria-label\": \"code classlanguage textmaxzoomcode number permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"maxZoom\"), \" (Number)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"20\"))), mdx(\"p\", null, \"Max zoom level.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textminzoomcode-number\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textminzoomcode-number\",\n    \"aria-label\": \"code classlanguage textminzoomcode number permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"minZoom\"), \" (Number)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"0\"))), mdx(\"p\", null, \"Min zoom level.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textmaxpitchcode-number\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textmaxpitchcode-number\",\n    \"aria-label\": \"code classlanguage textmaxpitchcode number permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"maxPitch\"), \" (Number)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"85\"))), mdx(\"p\", null, \"Max pitch in degrees.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textminpitchcode-number\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textminpitchcode-number\",\n    \"aria-label\": \"code classlanguage textminpitchcode number permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"minPitch\"), \" (Number)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"0\"))), mdx(\"p\", null, \"Min pitch in degrees.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textscrollzoomcode-booleanobject\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textscrollzoomcode-booleanobject\",\n    \"aria-label\": \"code classlanguage textscrollzoomcode booleanobject permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"scrollZoom\"), \" (Boolean|Object)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"true\"))), mdx(\"p\", null, \"Enable scroll to zoom. If an object is provided, may contain the following options to customize the scroll zoom behavior:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"speed\"), \" (Number) - Multiplier for the wheel delta. Default \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"0.01\"), \".\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"smooth\"), \" (Boolean) - Smoothly transition to the new zoom. If enabled, will provide a slightly lagged but smoother experience. Default \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"false\"), \".\")), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textdragpancode-booleanobject\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textdragpancode-booleanobject\",\n    \"aria-label\": \"code classlanguage textdragpancode booleanobject permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"dragPan\"), \" (Boolean|Object)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"true\"))), mdx(\"p\", null, \"Enable drag to pan. If an object is provided, may contain the following options to customize its behavior:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"inertia\"), \" (Number) - Enable momentum/inertia when the gesture ends. The value specifies after how long the panning comes to a stop, in milliseconds. Default \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"300\"), \".\")), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textdragrotatecode-boolean\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textdragrotatecode-boolean\",\n    \"aria-label\": \"code classlanguage textdragrotatecode boolean permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"dragRotate\"), \" (Boolean)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"true\"))), mdx(\"p\", null, \"Enable drag to rotate. If an object is provided, may contain the following options to customize its behavior:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"inertia\"), \" (Number) - Enable momentum/inertia when the gesture ends. The value specifies after how long the rotation comes to a stop, in milliseconds. Default \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"300\"), \".\")), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textdoubleclickzoomcode-boolean\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textdoubleclickzoomcode-boolean\",\n    \"aria-label\": \"code classlanguage textdoubleclickzoomcode boolean permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"doubleClickZoom\"), \" (Boolean)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"true\"))), mdx(\"p\", null, \"Enable double click to zoom.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-texttouchzoomcode-booleanobject\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-texttouchzoomcode-booleanobject\",\n    \"aria-label\": \"code classlanguage texttouchzoomcode booleanobject permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"touchZoom\"), \" (Boolean|Object)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"true\"))), mdx(\"p\", null, \"Enable multitouch zoom. If an object is provided, may contain the following options to customize its behavior:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"inertia\"), \" (Number) - Enable momentum/inertia when the gesture ends. The value specifies after how long the zooming comes to a stop, in milliseconds. Default \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"300\"), \".\")), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-texttouchrotatecode-booleanobject\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-texttouchrotatecode-booleanobject\",\n    \"aria-label\": \"code classlanguage texttouchrotatecode booleanobject permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"touchRotate\"), \" (Boolean|Object)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"false\"))), mdx(\"p\", null, \"Enable multitouch rotate, including two-finger rotation to change bearing and three-finger swipe to change pitch. If an object is provided, may contain the following options to customize its behavior:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"inertia\"), \" (Number) - Enable momentum/inertia when the gesture ends. The value specifies after how long the rotation comes to a stop, in milliseconds. Default \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"300\"), \".\")), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textkeyboardcode-booleanobject\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textkeyboardcode-booleanobject\",\n    \"aria-label\": \"code classlanguage textkeyboardcode booleanobject permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"keyboard\"), \" (Boolean|Object)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"true\"))), mdx(\"p\", null, \"Enable keyboard navigation. If an object is provided, may contain the following options to customize its behavior:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"zoomSpeed\"), \" (Number) - speed of zoom using +/- keys. Default \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"2\"), \".\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"moveSpeed\"), \" (Number) - speed of movement using arrow keys, in pixels.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"rotateSpeedX\"), \" (Number) - speed of rotation using shift + left/right arrow keys, in degrees. Default \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"15\"), \".\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"rotateSpeedY\"), \" (Number) - speed of rotation using shift + up/down arrow keys, in degrees. Default \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"10\"), \".\")), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-texttouchactioncode-string\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-texttouchactioncode-string\",\n    \"aria-label\": \"code classlanguage texttouchactioncode string permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"touchAction\"), \" (String)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"'none'\"))), mdx(\"p\", null, \"Allow browser default touch actions. Default \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"none\"), \". See \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"http://hammerjs.github.io/touch-action/\"\n  }, \"hammer.js doc\"), \".\"), mdx(\"p\", null, \"By default, the map captures all touch interactions. This prop is useful for mobile applications to unblock default scrolling behavior. For example, use the combination \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"dragPan: false\"), \" and \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"touchAction: 'pan-y'\"), \" to allow vertical page scroll when dragging over the map.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-texteventrecognizeroptionscode-object\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-texteventrecognizeroptionscode-object\",\n    \"aria-label\": \"code classlanguage texteventrecognizeroptionscode object permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"eventRecognizerOptions\"), \" (Object)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"{}\"))), mdx(\"p\", null, \"Set options for gesture recognition. My contain the following fields:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"pan\"), \" - an object that is \", mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"http://hammerjs.github.io/recognizer-pan/\"\n  }, \"Hammer.Pan\"), \" options. This gesture is used for drag events.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"pinch\"), \" - an object that is \", mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"http://hammerjs.github.io/recognizer-pinch/\"\n  }, \"Hammer.Pinch\"), \" options This gesture is used for two-finger touch events.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"tripan\"), \" - an object that is \", mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"http://hammerjs.github.io/recognizer-pan/\"\n  }, \"Hammer.Pan\"), \" options.  This gesture is used for three-finger touch events.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"tap\"), \" - an object that is \", mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"http://hammerjs.github.io/recognizer-tap/\"\n  }, \"Hammer.Tap\"), \" options. This gesture is used for the \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"onClick\"), \" callback.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"anytap\"), \" - an object that is \", mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"http://hammerjs.github.io/recognizer-tap/\"\n  }, \"Hammer.Tap\"), \" options. This gesture is used for the \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"onNativeClick\"), \" callback.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"doubletap\"), \" - an object that is \", mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"http://hammerjs.github.io/recognizer-tap/\"\n  }, \"Hammer.Tap\"), \" options. This gesture is used for double click events.\")), mdx(\"p\", null, \"For example, the following setting makes panning less sensitive and clicking easier on mobile:\"), mdx(\"div\", {\n    \"className\": \"gatsby-highlight\",\n    \"data-language\": \"jsx\"\n  }, mdx(\"pre\", {\n    parentName: \"div\",\n    \"className\": \"language-jsx\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\"\n  }, mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token keyword\"\n  }, \"const\"), \" eventRecognizerOptions \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \"=\"), \" isMobile \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \"?\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"{\"), \"\\n  pan\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \":\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"{\"), \"threshold\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \":\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token number\"\n  }, \"10\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"}\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \",\"), \"\\n  tap\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \":\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"{\"), \"threshold\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \":\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token number\"\n  }, \"5\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"}\"), \"\\n\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"}\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token operator\"\n  }, \":\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"{\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"}\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \";\"), \"\\n\\n\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token tag\"\n  }, mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token tag\"\n  }, mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token punctuation\"\n  }, \"<\"), mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token class-name\"\n  }, \"MapGL\")), \"\\n  \", mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token attr-name\"\n  }, \"eventRecognizerOptions\"), mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token script language-javascript\"\n  }, mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token script-punctuation punctuation\"\n  }, \"=\"), mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token punctuation\"\n  }, \"{\"), \"eventRecognizerOptions\", mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token punctuation\"\n  }, \"}\")), \"\\n\", mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token punctuation\"\n  }, \"/>\"))))), mdx(\"p\", null, \"Note that the value of this prop is used once when the component mounts. Subsequent changes will be ignored.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textclickradiuscode-number\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textclickradiuscode-number\",\n    \"aria-label\": \"code classlanguage textclickradiuscode number permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"clickRadius\"), \" (Number)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"0\"))), mdx(\"p\", null, \"Radius to detect features around a clicked point.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textcontrollercode-object\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textcontrollercode-object\",\n    \"aria-label\": \"code classlanguage textcontrollercode object permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"controller\"), \" (Object)\"), mdx(\"p\", null, \"A map controller instance to replace the default map controller.\"), mdx(\"p\", null, \"This object must implement the following interface:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"events\"), \" - An array of subscribed events\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"handleEvent(event, context)\"), \" - A method that handles interactive events\")), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textinteractivelayeridscode-array\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textinteractivelayeridscode-array\",\n    \"aria-label\": \"code classlanguage textinteractivelayeridscode array permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"interactiveLayerIds\"), \" (Array)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"null\"))), mdx(\"p\", null, \"A list of layer ids that are interactive. If specified:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Pointer event callbacks will only query the features under the pointer of these layers.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"The \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"getCursor\"), \" callback will receive \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"isHovering: true\"), \" when hover over features of these layers.\")), mdx(\"p\", null, \"If not specified:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Pointer event callbacks will query the features under the pointer of all layers.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"The \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"getCursor\"), \" callback will always receive \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"isHovering: false\"), \".\")), mdx(\"h3\", {\n    \"id\": \"transitions\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h3\",\n    \"href\": \"#transitions\",\n    \"aria-label\": \"transitions permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"Transitions\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-texttransitiondurationcode-number\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-texttransitiondurationcode-number\",\n    \"aria-label\": \"code classlanguage texttransitiondurationcode number permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"transitionDuration\"), \" (Number)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"0\"))), mdx(\"p\", null, \"Duration of transition in milliseconds. If specified, the map's viewport will smoothly move from the previous props to the current one.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-texttransitioninterpolatorcode-object\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-texttransitioninterpolatorcode-object\",\n    \"aria-label\": \"code classlanguage texttransitioninterpolatorcode object permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"transitionInterpolator\"), \" (Object)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"new LinearInterpolator()\"))), mdx(\"p\", null, \"An interpolator object that defines the transition behavior between two map states. \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"react-map-gl\"), \" offers two interpolators:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"LinearInterpolator\"), \" - similar to Mapbox's \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"easeTo\"), \" behavior.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"FlyToInterpolator\"), \" - similar to Mapbox's \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"flyTo\"), \" behavior.\")), mdx(\"p\", null, \"You may import them as follows:\"), mdx(\"div\", {\n    \"className\": \"gatsby-highlight\",\n    \"data-language\": \"jsx\"\n  }, mdx(\"pre\", {\n    parentName: \"div\",\n    \"className\": \"language-jsx\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\"\n  }, mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token keyword\"\n  }, \"import\"), \" ReactMapGL\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \",\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"{\"), \"LinearInterpolator\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \",\"), \" FlyToInterpolator\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"}\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token keyword\"\n  }, \"from\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token string\"\n  }, \"'react-map-gl'\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \";\"), \"\\n\\n\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token tag\"\n  }, mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token tag\"\n  }, mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token punctuation\"\n  }, \"<\"), mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token class-name\"\n  }, \"ReactMapGL\")), \" \", mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token attr-name\"\n  }, \"transitionDuration\"), mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token script language-javascript\"\n  }, mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token script-punctuation punctuation\"\n  }, \"=\"), mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token punctuation\"\n  }, \"{\"), mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token number\"\n  }, \"1000\"), mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token punctuation\"\n  }, \"}\")), \" \", mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token attr-name\"\n  }, \"transitionInterpolator\"), mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token script language-javascript\"\n  }, mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token script-punctuation punctuation\"\n  }, \"=\"), mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token punctuation\"\n  }, \"{\"), mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token keyword\"\n  }, \"new\"), \" \", mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token class-name\"\n  }, \"FlyToInterpolator\"), mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token punctuation\"\n  }, \"(\"), mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token punctuation\"\n  }, \")\"), mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token punctuation\"\n  }, \"}\")), mdx(\"span\", {\n    parentName: \"span\",\n    \"className\": \"token punctuation\"\n  }, \">\"))))), mdx(\"p\", null, \"For details about using transition interpolators, see \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/advanced/viewport-transitions.md\"\n  }, \"transitions\"), \".\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-texttransitioneasingcode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-texttransitioneasingcode-function\",\n    \"aria-label\": \"code classlanguage texttransitioneasingcode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"transitionEasing\"), \" (Function)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"t => t\"))), mdx(\"p\", null, \"Easing function that maps a value from \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"[0, 1]\"), \" to \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"[0, 1]\"), \". Check out \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"http://easings.net/\"\n  }, \"http://easings.net/\"), \" for common easing curves.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-texttransitioninterruptioncode-number\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-texttransitioninterruptioncode-number\",\n    \"aria-label\": \"code classlanguage texttransitioninterruptioncode number permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"transitionInterruption\"), \" (Number)\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"default: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"TRANSITION_EVENTS.BREAK\"))), mdx(\"p\", null, \"What to do if an ongoing transition is interrupted by another transition. There are 4 options:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"TRANSITION_EVENTS.BREAK\"), \" - Start new transition from the current view.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"TRANSITION_EVENTS.SNAP_TO_END\"), \" - Jump to the end of the previous transition before starting the new transition.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"TRANSITION_EVENTS.IGNORE\"), \" - Complete the previous transition and ignore the new viewport change.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"TRANSITION_EVENTS.UPDATE\"), \" - Continue the ongoing transition but change its destination to the new viewport.\")), mdx(\"p\", null, \"You may import the constants as follows:\"), mdx(\"div\", {\n    \"className\": \"gatsby-highlight\",\n    \"data-language\": \"js\"\n  }, mdx(\"pre\", {\n    parentName: \"div\",\n    \"className\": \"language-js\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-js\"\n  }, mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token keyword\"\n  }, \"import\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"{\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token constant\"\n  }, \"TRANSITION_EVENTS\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"}\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token keyword\"\n  }, \"from\"), \" \", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token string\"\n  }, \"'react-map-gl'\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \";\")))), mdx(\"h3\", {\n    \"id\": \"callbacks\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h3\",\n    \"href\": \"#callbacks\",\n    \"aria-label\": \"callbacks permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"Callbacks\"), mdx(\"p\", null, \"Inherit the following props from \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/static-map.md\"\n  }, \"StaticMap\"), \":\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"onLoad\"), \" (Function)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"onResize\"), \" (Function)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"onError\"), \" (Function)\")), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textonviewportchangecode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textonviewportchangecode-function\",\n    \"aria-label\": \"code classlanguage textonviewportchangecode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onViewportChange\"), \" (Function)\"), mdx(\"p\", null, \"Callback that is fired when the map's viewport properties should be updated. If not supplied, the map is not interactive.\"), mdx(\"div\", {\n    \"className\": \"gatsby-highlight\",\n    \"data-language\": \"js\"\n  }, mdx(\"pre\", {\n    parentName: \"div\",\n    \"className\": \"language-js\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-js\"\n  }, mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token function\"\n  }, \"onViewportChange\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"(\"), \"viewState\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \",\"), \" interactionState\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \",\"), \" oldViewState\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \")\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \";\")))), mdx(\"p\", null, \"Arguments:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"viewState\"), \" (Object) The next viewport properties, including: \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"width\"), \", \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"height\"), \", \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"latitude\"), \", \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"longitude\"), \", \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"zoom\"), \", \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"bearing\"), \", \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"pitch\"), \", \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"altitude\"), \", \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"maxZoom\"), \", \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"minZoom\"), \", \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"maxPitch\"), \", \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"minPitch\"), \", \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"transitionDuration\"), \", \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"transitionEasing\"), \", \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"transitionInterpolator\"), \", \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"transitionInterruption\"), \".\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"interactionState\"), \" (Object) The current interaction that caused this viewport change. See \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"onInteractionStateChange\"), \" for possible fields.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"oldViewState\"), \" (Object) The current viewport properties.\")), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textonviewstatechangecode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textonviewstatechangecode-function\",\n    \"aria-label\": \"code classlanguage textonviewstatechangecode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onViewStateChange\"), \" (Function)\"), mdx(\"p\", null, \"A newer version of the \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"onViewportChange\"), \" callback. Both are supported and provide equivalent functionality.\"), mdx(\"div\", {\n    \"className\": \"gatsby-highlight\",\n    \"data-language\": \"js\"\n  }, mdx(\"pre\", {\n    parentName: \"div\",\n    \"className\": \"language-js\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-js\"\n  }, mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token function\"\n  }, \"onViewStateChange\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"(\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"{\"), \"viewState\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \",\"), \" interactionState\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \",\"), \" oldViewState\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"}\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \")\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \";\")))), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textoninteractionstatechangecode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textoninteractionstatechangecode-function\",\n    \"aria-label\": \"code classlanguage textoninteractionstatechangecode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onInteractionStateChange\"), \" (Function)\"), mdx(\"p\", null, \"Callback that is fired when the user interacted with the map.\"), mdx(\"div\", {\n    \"className\": \"gatsby-highlight\",\n    \"data-language\": \"js\"\n  }, mdx(\"pre\", {\n    parentName: \"div\",\n    \"className\": \"language-js\"\n  }, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-js\"\n  }, mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token function\"\n  }, \"onInteractionStateChange\"), mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \"(\"), \"interactionState\", mdx(\"span\", {\n    parentName: \"code\",\n    \"className\": \"token punctuation\"\n  }, \")\")))), mdx(\"p\", null, \"Possible fields include:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"interactionState.inTransition\"), \" (Boolean)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"interactionState.isDragging\"), \" (Boolean)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"interactionState.isPanning\"), \" (Boolean)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"interactionState.isRotating\"), \" (Boolean)\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"interactionState.isZooming\"), \" (Boolean)\")), mdx(\"p\", null, \"Note:\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"onInteractionStateChange\"), \" may be fired without \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"onViewportChange\"), \". For example, when the pointer is released at the end of a drag-pan, \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"isDragging\"), \" are reset to \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"false\"), \", without the viewport's \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"longitude\"), \" and \", mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"latitude\"), \" changing.\")), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textonhovercode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textonhovercode-function\",\n    \"aria-label\": \"code classlanguage textonhovercode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onHover\"), \" (Function)\"), mdx(\"p\", null, \"Called when the mouse moves over the map (without button pressed). Receives a \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/pointer-event.md\"\n  }, \"PointerEvent\"), \" object.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textonclickcode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textonclickcode-function\",\n    \"aria-label\": \"code classlanguage textonclickcode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onClick\"), \" (Function)\"), mdx(\"p\", null, \"Called when the map is single clicked. Receives a \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/pointer-event.md\"\n  }, \"PointerEvent\"), \" object. This event is not fired on double click therefore there may be a delay between pointer up and the event.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textonnativeclickcode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textonnativeclickcode-function\",\n    \"aria-label\": \"code classlanguage textonnativeclickcode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onNativeClick\"), \" (Function)\"), mdx(\"p\", null, \"Called when the map is clicked. Receives a \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/pointer-event.md\"\n  }, \"PointerEvent\"), \" object. This event is fired twice on double click.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textondblclickcode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textondblclickcode-function\",\n    \"aria-label\": \"code classlanguage textondblclickcode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onDblClick\"), \" (Function)\"), mdx(\"p\", null, \"Called when the map is double clicked. Receives a \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/pointer-event.md\"\n  }, \"PointerEvent\"), \" object.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textonmousedowncode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textonmousedowncode-function\",\n    \"aria-label\": \"code classlanguage textonmousedowncode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onMouseDown\"), \" (Function)\"), mdx(\"p\", null, \"Called when a pointing device (usually a mouse) is pressed within the map. Receives a \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/pointer-event.md\"\n  }, \"PointerEvent\"), \" object.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textonmousemovecode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textonmousemovecode-function\",\n    \"aria-label\": \"code classlanguage textonmousemovecode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onMouseMove\"), \" (Function)\"), mdx(\"p\", null, \"Called when a pointing device (usually a mouse) is moved within the map. Receives a \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/pointer-event.md\"\n  }, \"PointerEvent\"), \" object.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textonmouseupcode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textonmouseupcode-function\",\n    \"aria-label\": \"code classlanguage textonmouseupcode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onMouseUp\"), \" (Function)\"), mdx(\"p\", null, \"Called when a pointing device (usually a mouse) is released within the map. Receives a \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/pointer-event.md\"\n  }, \"PointerEvent\"), \" object.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textontouchstartcode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textontouchstartcode-function\",\n    \"aria-label\": \"code classlanguage textontouchstartcode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onTouchStart\"), \" (Function)\"), mdx(\"p\", null, \"Called when a \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"touchstart\"), \" event occurs within the map. Receives a \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/pointer-event.md\"\n  }, \"PointerEvent\"), \" object.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textontouchmovecode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textontouchmovecode-function\",\n    \"aria-label\": \"code classlanguage textontouchmovecode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onTouchMove\"), \" (Function)\"), mdx(\"p\", null, \"Called when a \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"touchmove\"), \" event occurs within the map. Receives a \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/pointer-event.md\"\n  }, \"PointerEvent\"), \" object.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textontouchendcode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textontouchendcode-function\",\n    \"aria-label\": \"code classlanguage textontouchendcode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onTouchEnd\"), \" (Function)\"), mdx(\"p\", null, \"Called when a \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"touchend\"), \" event occurs within the map. Receives a \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/pointer-event.md\"\n  }, \"PointerEvent\"), \" object.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textonmouseentercode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textonmouseentercode-function\",\n    \"aria-label\": \"code classlanguage textonmouseentercode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onMouseEnter\"), \" (Function)\"), mdx(\"p\", null, \"Called when a pointing device (usually a mouse) enters a visible portion of one of the interactive layers, defined by the \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"interactiveLayerIds\"), \" prop. Receives a \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/pointer-event.md\"\n  }, \"PointerEvent\"), \" object.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textonmouseleavecode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textonmouseleavecode-function\",\n    \"aria-label\": \"code classlanguage textonmouseleavecode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onMouseLeave\"), \" (Function)\"), mdx(\"p\", null, \"Called when a pointing device (usually a mouse) leaves a visible portion of one of the interactive layers, defined by the \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"interactiveLayerIds\"), \" prop. Receives a \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/pointer-event.md\"\n  }, \"PointerEvent\"), \" object.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textonwheelcode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textonwheelcode-function\",\n    \"aria-label\": \"code classlanguage textonwheelcode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onWheel\"), \" (Function)\"), mdx(\"p\", null, \"Called when a \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"wheel\"), \" event occurs within the map. Receives a \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/pointer-event.md\"\n  }, \"PointerEvent\"), \" object.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textonmouseoutcode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textonmouseoutcode-function\",\n    \"aria-label\": \"code classlanguage textonmouseoutcode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onMouseOut\"), \" (Function)\"), mdx(\"p\", null, \"Called when a point device (usually a mouse) leaves the map's canvas. Receives a \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/pointer-event.md\"\n  }, \"PointerEvent\"), \" object.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textoncontextmenucode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textoncontextmenucode-function\",\n    \"aria-label\": \"code classlanguage textoncontextmenucode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onContextMenu\"), \" (Function)\"), mdx(\"p\", null, \"Called when the context menu is activated. Prevent default here to enable right button interaction.\"), mdx(\"p\", null, \"Default: \", mdx(\"code\", {\n    parentName: \"p\",\n    \"className\": \"language-text\"\n  }, \"event => event.preventDefault()\")), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textontransitionstartcode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textontransitionstartcode-function\",\n    \"aria-label\": \"code classlanguage textontransitionstartcode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onTransitionStart\"), \" (Function)\"), mdx(\"p\", null, \"Callback that is fired when a transition is triggered.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textontransitioninterruptcode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textontransitioninterruptcode-function\",\n    \"aria-label\": \"code classlanguage textontransitioninterruptcode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onTransitionInterrupt\"), \" (Function)\"), mdx(\"p\", null, \"Callback that is fired when an ongoing transition is interrupted by another transition.\"), mdx(\"h5\", {\n    \"id\": \"code-classlanguage-textontransitionendcode-function\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h5\",\n    \"href\": \"#code-classlanguage-textontransitionendcode-function\",\n    \"aria-label\": \"code classlanguage textontransitionendcode function permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), mdx(\"code\", {\n    parentName: \"h5\",\n    \"className\": \"language-text\"\n  }, \"onTransitionEnd\"), \" (Function)\"), mdx(\"p\", null, \"Callback that is fired when a transition is complete.\"), mdx(\"h2\", {\n    \"id\": \"methods\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h2\",\n    \"href\": \"#methods\",\n    \"aria-label\": \"methods permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"Methods\"), mdx(\"p\", null, \"Inherit the following methods from \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"/react-map-gl/docs/api-reference/static-map.md\"\n  }, \"StaticMap\"), \":\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"getMap()\")), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"code\", {\n    parentName: \"li\",\n    \"className\": \"language-text\"\n  }, \"queryRenderedFeatures(geometry, parameters)\"))), mdx(\"h2\", {\n    \"id\": \"source\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h2\",\n    \"href\": \"#source\",\n    \"aria-label\": \"source permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"Source\"), mdx(\"p\", null, mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://github.com/visgl/react-map-gl/tree/6.1-release/src/components/interactive-map.js\"\n  }, \"interactive-map.js\")));\n}\n;\nMDXContent.isMDXComponent = true;","timeToRead":5,"excerpt":"InteractiveMap This component renders  MapboxGL  and provides full interactivity support.\nIt uses  StaticMap  underneath to render the final…","frontmatter":{"title":"InteractiveMap"}}},"pageContext":{"relativeLinks":{"docs":"/docs","../../../docs":"/docs","docs/advanced/custom-components":"/docs/advanced/custom-components","../../advanced/custom-components":"/docs/advanced/custom-components","docs/advanced/custom-map-controller":"/docs/advanced/custom-map-controller","../../advanced/custom-map-controller":"/docs/advanced/custom-map-controller","docs/advanced/viewport-transition":"/docs/advanced/viewport-transition","../../advanced/viewport-transition":"/docs/advanced/viewport-transition","docs/api-reference/attribution-control":"/docs/api-reference/attribution-control","../attribution-control":"/docs/api-reference/attribution-control","docs/api-reference/canvas-overlay":"/docs/api-reference/canvas-overlay","../canvas-overlay":"/docs/api-reference/canvas-overlay","docs/api-reference/fly-to-interpolator":"/docs/api-reference/fly-to-interpolator","../fly-to-interpolator":"/docs/api-reference/fly-to-interpolator","docs/api-reference/fullscreen-control":"/docs/api-reference/fullscreen-control","../fullscreen-control":"/docs/api-reference/fullscreen-control","docs/api-reference/geolocate-control":"/docs/api-reference/geolocate-control","../geolocate-control":"/docs/api-reference/geolocate-control","docs/api-reference/html-overlay":"/docs/api-reference/html-overlay","../html-overlay":"/docs/api-reference/html-overlay","docs/api-reference/interactive-map":"/docs/api-reference/interactive-map","../interactive-map":"/docs/api-reference/interactive-map","docs/api-reference/layer":"/docs/api-reference/layer","../layer":"/docs/api-reference/layer","docs/api-reference/linear-interpolator":"/docs/api-reference/linear-interpolator","../linear-interpolator":"/docs/api-reference/linear-interpolator","docs/api-reference/map-context":"/docs/api-reference/map-context","../map-context":"/docs/api-reference/map-context","docs/api-reference/map-controller":"/docs/api-reference/map-controller","../map-controller":"/docs/api-reference/map-controller","docs/api-reference/marker":"/docs/api-reference/marker","../marker":"/docs/api-reference/marker","docs/api-reference/navigation-control":"/docs/api-reference/navigation-control","../navigation-control":"/docs/api-reference/navigation-control","docs/api-reference/pointer-event":"/docs/api-reference/pointer-event","../pointer-event":"/docs/api-reference/pointer-event","docs/api-reference/popup":"/docs/api-reference/popup","../popup":"/docs/api-reference/popup","docs/api-reference/scale-control":"/docs/api-reference/scale-control","../scale-control":"/docs/api-reference/scale-control","docs/api-reference/source":"/docs/api-reference/source","../source":"/docs/api-reference/source","docs/api-reference/static-map":"/docs/api-reference/static-map","../static-map":"/docs/api-reference/static-map","docs/api-reference/svg-overlay":"/docs/api-reference/svg-overlay","../svg-overlay":"/docs/api-reference/svg-overlay","docs/api-reference/web-mercator-viewport":"/docs/api-reference/web-mercator-viewport","../web-mercator-viewport":"/docs/api-reference/web-mercator-viewport","docs/contributing":"/docs/contributing","../../contributing":"/docs/contributing","docs/upgrade-guide":"/docs/upgrade-guide","../../upgrade-guide":"/docs/upgrade-guide","docs/whats-new":"/docs/whats-new","../../whats-new":"/docs/whats-new","docs/get-started/adding-custom-data":"/docs/get-started/adding-custom-data","../../get-started/adding-custom-data":"/docs/get-started/adding-custom-data","docs/get-started/faq":"/docs/get-started/faq","../../get-started/faq":"/docs/get-started/faq","docs/get-started/get-started":"/docs/get-started/get-started","../../get-started/get-started":"/docs/get-started/get-started","docs/get-started/mapbox-tokens":"/docs/get-started/mapbox-tokens","../../get-started/mapbox-tokens":"/docs/get-started/mapbox-tokens","docs/get-started/state-management":"/docs/get-started/state-management","../../get-started/state-management":"/docs/get-started/state-management"},"title":"InteractiveMap","slug":"docs/api-reference/interactive-map","toc":"docs"}},"staticQueryHashes":["484347790"]}