UNPKG

vue-mapbox

Version:

> Combine powers of [Vue.js](https://vuejs.org/) and [Mapbox Gl JS](https://mapbox.com/mapbox-gl-js)

867 lines (866 loc) 30.7 kB
(window.webpackJsonp = window.webpackJsonp || []).push([ [15], { 144: function(t, o, e) { "use strict"; e.r(o); var r = e(17), a = Object(r.a)( {}, function() { var t = this, o = t.$createElement, e = t._self._c || o; return e( "ContentSlotsDistributor", { attrs: { "slot-key": t.$parent.slotKey } }, [ e("h1", { attrs: { id: "map-control-components" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#map-control-components", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" Map control components") ]), t._v(" "), e("h2", { attrs: { id: "attributioncontrol" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#attributioncontrol", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" AttributionControl") ]), t._v(" "), e("p", [ t._v( "An AttributionControl control presents the map's attribution information." ) ]), t._v(" "), e("h3", { attrs: { id: "props" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#props", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" Props") ]), t._v(" "), e("h3", { attrs: { id: "compact" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#compact", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" "), e("code", [t._v("compact")]) ]), t._v(" "), e("ul", [ e("li", [ e("strong", [t._v("Type:")]), t._v(" "), e("code", [t._v("Boolean")]) ]), t._v(" "), e("li", [ e("strong", [t._v("Default:")]), t._v(" "), e("code", [t._v("true")]) ]), t._v(" "), e("li", [e("strong", [t._v("Non-Synced")])]), t._v(" "), e("li", [ e("strong", [t._v("Description:")]), t._v(" If true force a compact attribution") ]), t._v(" "), e("li", [ e("strong", [t._v("See:")]), t._v(" "), e("code", [t._v("options.compact")]), t._v(" in "), e( "a", { attrs: { href: "https://docs.mapbox.com/mapbox-gl-js/api/#attributioncontrol", target: "_blank", rel: "noopener noreferrer" } }, [t._v("AttributionControl"), e("OutboundLink")], 1 ) ]) ]), t._v(" "), e("h3", { attrs: { id: "customattribution" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#customattribution", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" "), e("code", [t._v("customAttribution")]) ]), t._v(" "), e("ul", [ e("li", [ e("strong", [t._v("Type:")]), t._v(" "), e("code", [t._v("string, Array<string>?")]) ]), t._v(" "), e("li", [ e("strong", [t._v("Default:")]), t._v(" "), e("code", [t._v("true")]) ]), t._v(" "), e("li", [e("strong", [t._v("Non-Synced")])]), t._v(" "), e("li", [ e("strong", [t._v("Description:")]), t._v( " String or strings to show in addition to any other attributions." ) ]), t._v(" "), e("li", [ e("strong", [t._v("See:")]), t._v(" "), e("code", [t._v("options.customAttribution")]), t._v(" in "), e( "a", { attrs: { href: "https://docs.mapbox.com/mapbox-gl-js/api/#attributioncontrol", target: "_blank", rel: "noopener noreferrer" } }, [t._v("AttributionControl"), e("OutboundLink")], 1 ) ]) ]), t._v(" "), e("h2", { attrs: { id: "fullscreencontrol" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#fullscreencontrol", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" FullscreenControl") ]), t._v(" "), e("p", [ t._v("Creates a button on the map to toggle fulscreen mode.") ]), t._v(" "), e("h3", { attrs: { id: "props-2" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#props-2", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" Props") ]), t._v(" "), e("h3", { attrs: { id: "container" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#container", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" "), e("code", [t._v("container")]) ]), t._v(" "), e("ul", [ e("li", [ e("strong", [t._v("Type:")]), t._v(" "), e("code", [t._v("HTMLElement")]) ]), t._v(" "), e("li", [e("strong", [t._v("Non-Synced")])]), t._v(" "), e("li", [ e("strong", [t._v("Description:")]), t._v( " DOM element which should be made full screen. By default, the map container element will be made full screen." ) ]), t._v(" "), e("li", [ e("strong", [t._v("See:")]), t._v(" "), e("code", [t._v("options.container")]), t._v(" in "), e( "a", { attrs: { href: "https://docs.mapbox.com/mapbox-gl-js/api/#fullscreencontrol", target: "_blank", rel: "noopener noreferrer" } }, [t._v("FullscreenControl"), e("OutboundLink")], 1 ) ]) ]), t._v(" "), e("h2", { attrs: { id: "geolocatecontrol" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#geolocatecontrol", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" GeolocateControl") ]), t._v(" "), e("p", [ t._v( "Provides a button that uses the browser's geolocation API to locate the user on the map." ) ]), t._v(" "), e("h3", { attrs: { id: "props-3" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#props-3", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" Props") ]), t._v(" "), e("h3", { attrs: { id: "positionoptions" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#positionoptions", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" "), e("code", [t._v("positionOptions")]) ]), t._v(" "), e("ul", [ e("li", [ e("strong", [t._v("Type:")]), t._v(" "), e("code", [t._v("Object")]) ]), t._v(" "), e("li", [ e("strong", [t._v("Default:")]), t._v(" "), e("code", [ t._v("{ enableHighAccuracy: false, timeout: 6000}") ]) ]), t._v(" "), e("li", [e("strong", [t._v("Non-Synced")])]), t._v(" "), e("li", [ e("strong", [t._v("Description:")]), t._v(" A Geolocation API PositionOptions object.") ]), t._v(" "), e("li", [ e("strong", [t._v("See:")]), t._v(" "), e("code", [t._v("options.positionOptions")]), t._v(" in "), e( "a", { attrs: { href: "https://docs.mapbox.com/mapbox-gl-js/api/#geolocatecontrol", target: "_blank", rel: "noopener noreferrer" } }, [t._v("GeolocateControl"), e("OutboundLink")], 1 ) ]) ]), t._v(" "), e("h3", { attrs: { id: "fitboundsoptions" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#fitboundsoptions", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" "), e("code", [t._v("fitBoundsOptions")]) ]), t._v(" "), e("ul", [ e("li", [ e("strong", [t._v("Type:")]), t._v(" "), e("code", [t._v("Object")]) ]), t._v(" "), e("li", [ e("strong", [t._v("Default:")]), t._v(" "), e("code", [t._v("{ maxZoom:15 }")]) ]), t._v(" "), e("li", [e("strong", [t._v("Non-Synced")])]), t._v(" "), e("li", [ e("strong", [t._v("Description:")]), t._v( " A fitBounds options object to use when the map is panned and zoomed to the user's location." ) ]), t._v(" "), e("li", [ e("strong", [t._v("See:")]), t._v(" "), e("code", [t._v("options.fitBoundsOptions")]), t._v(" in "), e( "a", { attrs: { href: "https://docs.mapbox.com/mapbox-gl-js/api/#geolocatecontrol", target: "_blank", rel: "noopener noreferrer" } }, [t._v("GeolocateControl"), e("OutboundLink")], 1 ) ]) ]), t._v(" "), e("h3", { attrs: { id: "trackuserlocation" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#trackuserlocation", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" "), e("code", [t._v("trackUserLocation")]) ]), t._v(" "), e("ul", [ e("li", [ e("strong", [t._v("Type:")]), t._v(" "), e("code", [t._v("Boolean")]) ]), t._v(" "), e("li", [ e("strong", [t._v("Default:")]), t._v(" "), e("code", [t._v("false")]) ]), t._v(" "), e("li", [e("strong", [t._v("Non-Synced")])]), t._v(" "), e("li", [ e("strong", [t._v("Description:")]), t._v( " If true the Geolocate Control becomes a toggle button and when active the map will receive updates to the user's location as it changes.to the user's location." ) ]), t._v(" "), e("li", [ e("strong", [t._v("See:")]), t._v(" "), e("code", [t._v("options.trackUserLocation")]), t._v(" in "), e( "a", { attrs: { href: "https://docs.mapbox.com/mapbox-gl-js/api/#geolocatecontrol", target: "_blank", rel: "noopener noreferrer" } }, [t._v("GeolocateControl"), e("OutboundLink")], 1 ) ]) ]), t._v(" "), e("h3", { attrs: { id: "showuserlocation" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#showuserlocation", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" "), e("code", [t._v("showUserLocation")]) ]), t._v(" "), e("ul", [ e("li", [ e("strong", [t._v("Type:")]), t._v(" "), e("code", [t._v("Boolean")]) ]), t._v(" "), e("li", [ e("strong", [t._v("Default:")]), t._v(" "), e("code", [t._v("true")]) ]), t._v(" "), e("li", [e("strong", [t._v("Non-Synced")])]), t._v(" "), e("li", [ e("strong", [t._v("Description:")]), t._v( " By default a dot will be shown on the map at the user's location. Set to false to disable." ) ]), t._v(" "), e("li", [ e("strong", [t._v("See:")]), t._v(" "), e("code", [t._v("options.showUserLocation")]), t._v(" in "), e( "a", { attrs: { href: "https://docs.mapbox.com/mapbox-gl-js/api/#geolocatecontrol", target: "_blank", rel: "noopener noreferrer" } }, [t._v("GeolocateControl"), e("OutboundLink")], 1 ) ]) ]), t._v(" "), e("h3", { attrs: { id: "methods" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#methods", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" Methods") ]), t._v(" "), e("h3", { attrs: { id: "trigger" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#trigger", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" "), e("code", [t._v(".trigger()")]) ]), t._v(" "), e("ul", [ e("li", [ e("strong", [t._v("Description:")]), t._v(" Trigger a geolocation") ]), t._v(" "), e("li", [ e("strong", [t._v("Returns:")]), t._v(" "), e("code", [t._v("boolean")]) ]), t._v(" "), e("li", [ e("strong", [t._v("See:")]), t._v(" "), e( "a", { attrs: { href: "https://docs.mapbox.com/mapbox-gl-js/api/#geolocatecontrol#trigger", target: "_blank", rel: "noopener noreferrer" } }, [t._v("trigger"), e("OutboundLink")], 1 ), t._v(" GeolocateControl method") ]) ]), t._v(" "), e("h2", { attrs: { id: "navigationcontrol" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#navigationcontrol", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" NavigationControl") ]), t._v(" "), e("h3", { attrs: { id: "props-4" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#props-4", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" Props") ]), t._v(" "), e("h3", { attrs: { id: "showcompass" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#showcompass", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" "), e("code", [t._v("showCompass")]) ]), t._v(" "), e("ul", [ e("li", [ e("strong", [t._v("Type:")]), t._v(" "), e("code", [t._v("Boolean")]) ]), t._v(" "), e("li", [ e("strong", [t._v("Default:")]), t._v(" "), e("code", [t._v("true")]) ]), t._v(" "), e("li", [e("strong", [t._v("Non-Synced")])]), t._v(" "), e("li", [ e("strong", [t._v("Description:")]), t._v(" If true the compass button is included.") ]), t._v(" "), e("li", [ e("strong", [t._v("See:")]), t._v(" "), e("code", [t._v("options.showCompass")]), t._v(" in "), e( "a", { attrs: { href: "https://docs.mapbox.com/mapbox-gl-js/api/#navigationcontrol", target: "_blank", rel: "noopener noreferrer" } }, [t._v("NavigationControl"), e("OutboundLink")], 1 ) ]) ]), t._v(" "), e("h3", { attrs: { id: "showzoom" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#showzoom", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" "), e("code", [t._v("showZoom")]) ]), t._v(" "), e("ul", [ e("li", [ e("strong", [t._v("Type:")]), t._v(" "), e("code", [t._v("Boolean")]) ]), t._v(" "), e("li", [ e("strong", [t._v("Default:")]), t._v(" "), e("code", [t._v("true")]) ]), t._v(" "), e("li", [e("strong", [t._v("Non-Synced")])]), t._v(" "), e("li", [ e("strong", [t._v("Description:")]), t._v( " If true the zoom-in and zoom-out buttons are included." ) ]), t._v(" "), e("li", [ e("strong", [t._v("See:")]), t._v(" "), e("code", [t._v("options.showZoom")]), t._v(" in "), e( "a", { attrs: { href: "https://docs.mapbox.com/mapbox-gl-js/api/#navigationcontrol", target: "_blank", rel: "noopener noreferrer" } }, [t._v("NavigationControl"), e("OutboundLink")], 1 ) ]) ]), t._v(" "), e("h2", { attrs: { id: "scalecontrol" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#scalecontrol", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" ScaleControl") ]), t._v(" "), e("h3", { attrs: { id: "props-5" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#props-5", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" Props") ]), t._v(" "), e("h3", { attrs: { id: "maxwidth" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#maxwidth", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" "), e("code", [t._v("maxWidth")]) ]), t._v(" "), e("ul", [ e("li", [ e("strong", [t._v("Type:")]), t._v(" "), e("code", [t._v("Number")]) ]), t._v(" "), e("li", [ e("strong", [t._v("Default:")]), t._v(" "), e("code", [t._v("100")]) ]), t._v(" "), e("li", [e("strong", [t._v("Non-Synced")])]), t._v(" "), e("li", [ e("strong", [t._v("Description:")]), t._v(" The maximum length of the scale control in pixels.") ]), t._v(" "), e("li", [ e("strong", [t._v("See:")]), t._v(" "), e("code", [t._v("options.maxWidth")]), t._v(" in "), e( "a", { attrs: { href: "https://docs.mapbox.com/mapbox-gl-js/api/#scalecontrol", target: "_blank", rel: "noopener noreferrer" } }, [t._v("ScaleControl"), e("OutboundLink")], 1 ) ]) ]), t._v(" "), e("h3", { attrs: { id: "unit" } }, [ e( "a", { staticClass: "header-anchor", attrs: { href: "#unit", "aria-hidden": "true" } }, [t._v("#")] ), t._v(" "), e("code", [t._v("unit")]) ]), t._v(" "), e("ul", [ e("li", [ e("strong", [t._v("Type:")]), t._v(" "), e("code", [ t._v('String, "imperial" | "metric" | "nautical"') ]) ]), t._v(" "), e("li", [ e("strong", [t._v("Default:")]), t._v(" "), e("code", [t._v("metric")]) ]), t._v(" "), e("li", [e("strong", [t._v("Non-Synced")])]), t._v(" "), e("li", [ e("strong", [t._v("Description:")]), t._v(" Unit of the distance") ]), t._v(" "), e("li", [ e("strong", [t._v("See:")]), t._v(" "), e("code", [t._v("options.unit")]), t._v(" in "), e( "a", { attrs: { href: "https://docs.mapbox.com/mapbox-gl-js/api/#scalecontrol", target: "_blank", rel: "noopener noreferrer" } }, [t._v("ScaleControl"), e("OutboundLink")], 1 ) ]) ]) ] ); }, [], !1, null, null, null ); a.options.__file = "controls.md"; o.default = a.exports; } } ]);