From 561e33f08a9f933cf9c16dfaea9ab6ce4b051e4a Mon Sep 17 00:00:00 2001 From: Kilian Finger Date: Fri, 9 Sep 2022 12:54:59 +0200 Subject: [PATCH] docs: improve markdown, and setup instructions * docs: improve markdown, and setup instructions Fixes #2168 --- README-v10.md | 2 +- README.md | 20 +- docs/Annotation.md | 16 +- docs/Annotations.md | 26 +- docs/Atmosphere.md | 152 ++-- docs/BackgroundLayer.md | 88 +-- docs/Callout.md | 8 +- docs/Camera.md | 22 +- docs/CircleLayer.md | 258 +++---- docs/CustomHttpHeaders.md | 26 +- docs/FillExtrusionLayer.md | 240 +++--- docs/FillLayer.md | 166 ++--- docs/HeadingIndicator.md | 6 +- docs/HeatmapLayer.md | 116 +-- docs/ImageSource.md | 7 +- docs/Images.md | 6 +- docs/Light.md | 90 +-- docs/LineLayer.md | 332 ++++----- docs/Logger.md | 17 +- docs/MapView.md | 62 +- docs/MapboxGL.md | 53 +- docs/MarkerView.md | 11 +- docs/NativeUserLocation.md | 6 +- docs/OfflineManager.md | 68 +- docs/PointAnnotation.md | 18 +- docs/RasterDemSource.md | 6 +- docs/RasterLayer.md | 198 ++--- docs/RasterSource.md | 8 +- docs/ShapeSource.md | 33 +- docs/SkyLayer.md | 138 ++-- docs/Style.md | 8 +- docs/StyleSheet.md | 352 ++------- docs/SymbolLayer.md | 908 +++++++++++------------ docs/Terrain.md | 12 +- docs/UserLocation.md | 16 +- docs/VectorSource.md | 17 +- docs/docs.json | 26 +- docs/snapshotManager.md | 12 +- javascript/components/Callout.js | 2 +- javascript/components/Camera.tsx | 2 +- javascript/components/Images.js | 2 +- javascript/components/MapView.js | 6 +- javascript/components/MarkerView.js | 6 +- javascript/components/RasterDemSource.js | 2 +- javascript/components/RasterSource.js | 2 +- javascript/components/ShapeSource.js | 8 +- javascript/components/Style.js | 2 +- plugin/install.md | 19 +- scripts/templates/component.md.ejs | 50 +- 49 files changed, 1749 insertions(+), 1902 deletions(-) diff --git a/README-v10.md b/README-v10.md index eec5f59c9..21c9167e4 100644 --- a/README-v10.md +++ b/README-v10.md @@ -80,7 +80,7 @@ code ios/Podfile pod 'React-Core', :path => '../node_modules/react-native/React', modular_headers: true ``` -IOS: +iOS: * Add `$(SDKROOT)/usr/lib/swift` to Library search paths. diff --git a/README.md b/README.md index 83119565c..1eb569b24 100644 --- a/README.md +++ b/README.md @@ -91,17 +91,25 @@ _See [iOS](ios/install.md) & [Android](android/install.md) setup guide for more ### Step 1 - Install Package: +#### Using `yarn` +Install the latest source from git: ```sh -# install with Yarn -# yarn add @rnmapbox/maps yarn add rnmapbox/maps#main +``` +#### Using `npm` +Install the latest source from git: +```sh +npm install --save rnmapbox/maps#main +``` -# or install with NPM -# npm install @rnmapbox/maps --save -npm install rnmapbox/maps#main --save +#### Installing other versions +Replace `rnmapbox/maps#main` with the following to install other versions: +- `@rnmapbox/maps` installs the latest release -``` + +#### Using `expo` +Please follow the [Expo Guide](/plugin/install.md). ### Step 2 - Installation Guides: diff --git a/docs/Annotation.md b/docs/Annotation.md index 1ec01e548..da8bf4140 100644 --- a/docs/Annotation.md +++ b/docs/Annotation.md @@ -1,8 +1,8 @@ -## -### +# -### props + +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | id | `string` | `none` | `true` | FIX ME NO DESCRIPTION | @@ -15,22 +15,22 @@ | style | `any` | `none` | `false` | FIX ME NO DESCRIPTION | | icon | `union` | `none` | `false` | FIX ME NO DESCRIPTION | -### methods -#### onPress() +## methods +### onPress() -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | -#### symbolStyle() +### symbolStyle() -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | diff --git a/docs/Annotations.md b/docs/Annotations.md index e0af35a04..bce0d3987 100644 --- a/docs/Annotations.md +++ b/docs/Annotations.md @@ -1,17 +1,19 @@ -Comparsion of various annotations available in React native mapbox: +# Annotations Comparison -|*Feature* | *SymbolLayer* |*PointAnnotation* |*MarkerView* |*CircleLayer* | -|-----------------------|--------------------|--------------------------------------|-------------------------|---------------------| -|Can use images | ✓ | | | | -|RN Views as childern | iOS: static |iOS: interactive
android: static|interactive | | -|Interactions | click |iOS: full
android: click & drag & callout | supports full interactivity in the sense that inside MarkerViews one can place any RN View, which can be interacted with. Not to be misunderstood with drag n drop interactivity. | click | -|Control Z-index | ✓ |iOS: always on top, android: n/a |always on top | ✓ | -|Clustering | ✓ | | | ✓ | -|Style with expressions | ✓ | | | ✓ | -|iOS implementation | [MGLStyleSymbolLayer](https://docs.mapbox.com/ios/api/maps/5.8.0/Classes/MGLSymbolStyleLayer.html) |[MGLAnnotationView](https://docs.mapbox.com/ios/api/maps/5.8.0/Classes/MGLAnnotationView.html) |[MGLAnnotationView](https://docs.mapbox.com/ios/api/maps/5.8.0/Classes/MGLAnnotationView.html) |[MGLCircleStyleLayer](https://docs.mapbox.com/ios/api/maps/5.8.0/Classes/MGLCircleStyleLayer.html) | -|android implementation | [SymbolLayer](https://docs.mapbox.com/android/api/map-sdk/9.0.0/com/mapbox/mapboxsdk/style/layers/SymbolLayer.html)|[annotation.Symbol](https://docs.mapbox.com/android/api/plugins/annotation/0.8.0/com/mapbox/mapboxsdk/plugins/annotation/Symbol.html)|[annotation.Marker](https://docs.mapbox.com/android/api/plugins/markerview/0.4.0/com/mapbox/mapboxsdk/plugins/markerview/MarkerView.html) |[CircleLayer](https://docs.mapbox.com/android/api/map-sdk/9.0.0/com/mapbox/mapboxsdk/style/layers/CircleLayer.html)| +Comparsion of various annotations available in React native mapbox: +| *Feature* | *SymbolLayer* | *PointAnnotation* |*MarkerView* |*CircleLayer* | +|------------------------|--------------------|---------------------------------------------------------------------------------------------------------------------------------------|-------------------------|---------------------| +| Can use images | ✓ | | | | +| RN Views as children | iOS: static | iOS: interactive
Android: static |interactive | | +| Interactions | click | iOS: full
Android: click & drag & callout | supports full interactivity in the sense that inside MarkerViews one can place any RN View, which can be interacted with. Not to be misunderstood with drag n drop interactivity. | click | +| Control Z-index | ✓ | iOS: always on top, Android: n/a |always on top | ✓ | +| Clustering | ✓ | | | ✓ | +| Style with expressions | ✓ | | | ✓ | +| iOS implementation | [MGLStyleSymbolLayer](https://docs.mapbox.com/ios/api/maps/5.8.0/Classes/MGLSymbolStyleLayer.html) | [MGLAnnotationView](https://docs.mapbox.com/ios/api/maps/5.8.0/Classes/MGLAnnotationView.html) |[MGLAnnotationView](https://docs.mapbox.com/ios/api/maps/5.8.0/Classes/MGLAnnotationView.html) |[MGLCircleStyleLayer](https://docs.mapbox.com/ios/api/maps/5.8.0/Classes/MGLCircleStyleLayer.html) | +| Android implementation | [SymbolLayer](https://docs.mapbox.com/android/api/map-sdk/9.0.0/com/mapbox/mapboxsdk/style/layers/SymbolLayer.html)| [annotation.Symbol](https://docs.mapbox.com/android/api/plugins/annotation/0.8.0/com/mapbox/mapboxsdk/plugins/annotation/Symbol.html) |[annotation.Marker](https://docs.mapbox.com/android/api/plugins/markerview/0.4.0/com/mapbox/mapboxsdk/plugins/markerview/MarkerView.html) |[CircleLayer](https://docs.mapbox.com/android/api/map-sdk/9.0.0/com/mapbox/mapboxsdk/style/layers/CircleLayer.html)| Related links: + * iOS [markers and annotations](https://docs.mapbox.com/ios/maps/overview/markers-and-annotations/) -* android [annotation plugin](https://docs.mapbox.com/android/plugins/overview/annotation/) +* Android [annotation plugin](https://docs.mapbox.com/android/plugins/overview/annotation/) diff --git a/docs/Atmosphere.md b/docs/Atmosphere.md index 706fb07db..addfc97f6 100644 --- a/docs/Atmosphere.md +++ b/docs/Atmosphere.md @@ -1,14 +1,14 @@ -## -### +# -### props + +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | style | `AtmosphereLayerStyleProps` | `none` | `true` | FIX ME NO DESCRIPTION | -### styles +## styles * range
* color
@@ -19,247 +19,247 @@ ___ -#### range +### range Name: `range` -#### Description +### Description The start and end distance range in which fog fades from fully transparent to fully opaque. The distance to the point at the center of the map is defined as zero, so that negative range values are closer to the camera, and positive values are farther away. -#### Type +### Type `array` -#### Default Value +### Default Value `[0.5,10]` -#### Minimum +### Minimum `-20` -#### Maximum +### Maximum `20` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `rangeTransition` -#### Description +### Description -The transition affecting any changes to this layer’s range propery. +The transition affecting any changes to this layer’s range property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### color +### color Name: `color` -#### Description +### Description The color of the atmosphere region immediately below the horizon and within the `range` and above the horizon and within `horizonBlend`. Using opacity is recommended only for smoothly transitioning fog on/off as anything less than 100% opacity results in more tiles loaded and drawn. -#### Type +### Type `color` -#### Default Value +### Default Value `#ffffff` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `colorTransition` -#### Description +### Description -The transition affecting any changes to this layer’s color propery. +The transition affecting any changes to this layer’s color property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### highColor +### highColor Name: `highColor` -#### Description +### Description The color of the atmosphere region above the horizon, `highColor` extends further above the horizon than the `color` property and its spread can be controlled with `horizonBlend`. The opacity can be set to `0` to remove the high atmosphere color contribution. -#### Type +### Type `color` -#### Default Value +### Default Value `#245cdf` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `highColorTransition` -#### Description +### Description -The transition affecting any changes to this layer’s highColor propery. +The transition affecting any changes to this layer’s highColor property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### spaceColor +### spaceColor Name: `spaceColor` -#### Description +### Description The color of the region above the horizon and after the end of the `horizonBlend` contribution. The opacity can be set to `0` to have a transparent background. -#### Type +### Type `color` -#### Default Value +### Default Value `interpolate,linear,zoom,4,#010b19,7,#367ab9` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `spaceColorTransition` -#### Description +### Description -The transition affecting any changes to this layer’s spaceColor propery. +The transition affecting any changes to this layer’s spaceColor property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### horizonBlend +### horizonBlend Name: `horizonBlend` -#### Description +### Description Horizon blend applies a smooth fade from the color of the atmosphere to the color of space. A value of zero leaves a sharp transition from atmosphere to space. Increasing the value blends the color of atmosphere into increasingly high angles of the sky. -#### Type +### Type `number` -#### Default Value +### Default Value `interpolate,linear,zoom,4,0.2,7,0.1` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `horizonBlendTransition` -#### Description +### Description -The transition affecting any changes to this layer’s horizonBlend propery. +The transition affecting any changes to this layer’s horizonBlend property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### starIntensity +### starIntensity Name: `starIntensity` -#### Description +### Description A value controlling the star intensity where `0` will show no stars and `1` will show stars at their maximum intensity. -#### Type +### Type `number` -#### Default Value +### Default Value `interpolate,linear,zoom,5,0.35,6,0` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `starIntensityTransition` -#### Description +### Description -The transition affecting any changes to this layer’s starIntensity propery. +The transition affecting any changes to this layer’s starIntensity property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` diff --git a/docs/BackgroundLayer.md b/docs/BackgroundLayer.md index 016214525..cbf66238c 100644 --- a/docs/BackgroundLayer.md +++ b/docs/BackgroundLayer.md @@ -1,8 +1,8 @@ -## -### +# -### props + +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | id | `string` | `none` | `true` | A string that uniquely identifies the source in the style to which it is added. | @@ -17,7 +17,7 @@ | style | `union` | `none` | `false` | Customizable style attributes | -### styles +## styles * visibility
* backgroundColor
@@ -26,18 +26,18 @@ ___ -#### visibility +### visibility Name: `visibility` -#### Description +### Description Whether this layer is displayed. -#### Type +### Type `enum` -#### Default Value +### Default Value `visible` -#### Supported Values +### Supported Values **visible** - The layer is shown.
**none** - The layer is not shown.
@@ -45,122 +45,122 @@ Whether this layer is displayed. ___ -#### backgroundColor +### backgroundColor Name: `backgroundColor` -#### Description +### Description The color with which the background will be drawn. -#### Type +### Type `color` -#### Default Value +### Default Value `#000000` -#### Disabled By +### Disabled By `backgroundPattern` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `backgroundColorTransition` -#### Description +### Description -The transition affecting any changes to this layer’s backgroundColor propery. +The transition affecting any changes to this layer’s backgroundColor property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### backgroundPattern +### backgroundPattern Name: `backgroundPattern` -#### Description +### Description Name of image in sprite to use for drawing an image background. For seamless patterns, image width and height must be a factor of two (2, 4, 8, ..., 512). Note that zoomDependent expressions will be evaluated only at integer zoom levels. -#### Type +### Type `resolvedImage` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `backgroundPatternTransition` -#### Description +### Description -The transition affecting any changes to this layer’s backgroundPattern propery. +The transition affecting any changes to this layer’s backgroundPattern property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### backgroundOpacity +### backgroundOpacity Name: `backgroundOpacity` -#### Description +### Description The opacity at which the background will be drawn. -#### Type +### Type `number` -#### Default Value +### Default Value `1` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `backgroundOpacityTransition` -#### Description +### Description -The transition affecting any changes to this layer’s backgroundOpacity propery. +The transition affecting any changes to this layer’s backgroundOpacity property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` diff --git a/docs/Callout.md b/docs/Callout.md index 7eb28e42a..55edbabf0 100644 --- a/docs/Callout.md +++ b/docs/Callout.md @@ -1,11 +1,11 @@ -## -### Callout that displays information about a selected annotation near the annotation. +# +Callout that displays information about a selected annotation near the annotation. -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | -| title | `string` | `none` | `false` | String that get's displayed in the default callout. | +| title | `string` | `none` | `false` | String that gets displayed in the default callout. | | style | `any` | `none` | `false` | Style property for the Animated.View wrapper, apply animations to this | | containerStyle | `any` | `none` | `false` | Style property for the native RCTMGLCallout container, set at your own risk. | | contentStyle | `any` | `none` | `false` | Style property for the content bubble. | diff --git a/docs/Camera.md b/docs/Camera.md index b4560d274..a10f14198 100644 --- a/docs/Camera.md +++ b/docs/Camera.md @@ -1,8 +1,24 @@ -## -### Controls the perspective from which the user sees the map.

To use imperative methods, pass in a ref object:

```
const camera = useRef(null);

useEffect(() => {
camera.current?.setCamera({
centerCoordinate: [lon, lat],
});
}, []);

return (

);
``` +# +Controls the perspective from which the user sees the map. -### props +To use imperative methods, pass in a ref object: + +```tsx +const camera = useRef(null); + +useEffect(() => { + camera.current?.setCamera({ + centerCoordinate: [lon, lat], + }); +}, []); + +return ( + +); +``` + +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | type | `literal` | `none` | `false` | Allows static check of the data type. For internal use only. | diff --git a/docs/CircleLayer.md b/docs/CircleLayer.md index 2ee395835..7bfe7f8ce 100644 --- a/docs/CircleLayer.md +++ b/docs/CircleLayer.md @@ -1,8 +1,8 @@ -## -### CircleLayer is a style layer that renders one or more filled circles on the map. +# +CircleLayer is a style layer that renders one or more filled circles on the map. -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | id | `string` | `none` | `true` | A string that uniquely identifies the source in the style to which it is added. | @@ -17,7 +17,7 @@ | style | `union` | `none` | `false` | Customizable style attributes | -### styles +## styles * circleSortKey
* visibility
@@ -35,34 +35,34 @@ ___ -#### circleSortKey +### circleSortKey Name: `circleSortKey` -#### Description +### Description Sorts features in ascending order based on this value. Features with a higher sort key will appear above features with a lower sort key. -#### Type +### Type `number` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### visibility +### visibility Name: `visibility` -#### Description +### Description Whether this layer is displayed. -#### Type +### Type `enum` -#### Default Value +### Default Value `visible` -#### Supported Values +### Supported Values **visible** - The layer is shown.
**none** - The layer is not shown.
@@ -70,401 +70,401 @@ Whether this layer is displayed. ___ -#### circleRadius +### circleRadius Name: `circleRadius` -#### Description +### Description Circle radius. -#### Type +### Type `number` -#### Default Value +### Default Value `5` -#### Units +### Units `pixels` -#### Minimum +### Minimum `0` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `circleRadiusTransition` -#### Description +### Description -The transition affecting any changes to this layer’s circleRadius propery. +The transition affecting any changes to this layer’s circleRadius property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### circleColor +### circleColor Name: `circleColor` -#### Description +### Description The fill color of the circle. -#### Type +### Type `color` -#### Default Value +### Default Value `#000000` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `circleColorTransition` -#### Description +### Description -The transition affecting any changes to this layer’s circleColor propery. +The transition affecting any changes to this layer’s circleColor property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### circleBlur +### circleBlur Name: `circleBlur` -#### Description +### Description Amount to blur the circle. 1 blurs the circle such that only the centerpoint is full opacity. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `circleBlurTransition` -#### Description +### Description -The transition affecting any changes to this layer’s circleBlur propery. +The transition affecting any changes to this layer’s circleBlur property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### circleOpacity +### circleOpacity Name: `circleOpacity` -#### Description +### Description The opacity at which the circle will be drawn. -#### Type +### Type `number` -#### Default Value +### Default Value `1` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `circleOpacityTransition` -#### Description +### Description -The transition affecting any changes to this layer’s circleOpacity propery. +The transition affecting any changes to this layer’s circleOpacity property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### circleTranslate +### circleTranslate Name: `circleTranslate` -#### Description +### Description The geometry's offset. Values are [x, y] where negatives indicate left and up, respectively. -#### Type +### Type `array` -#### Default Value +### Default Value `[0,0]` -#### Units +### Units `pixels` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `circleTranslateTransition` -#### Description +### Description -The transition affecting any changes to this layer’s circleTranslate propery. +The transition affecting any changes to this layer’s circleTranslate property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### circleTranslateAnchor +### circleTranslateAnchor Name: `circleTranslateAnchor` -#### Description +### Description Controls the frame of reference for `circleTranslate`. -#### Type +### Type `enum` -#### Default Value +### Default Value `map` -#### Supported Values +### Supported Values **map** - The circle is translated relative to the map.
**viewport** - The circle is translated relative to the viewport.
-#### Requires +### Requires `circleTranslate` -#### Expression +### Expression Parameters: `zoom` ___ -#### circlePitchScale +### circlePitchScale Name: `circlePitchScale` -#### Description +### Description Controls the scaling behavior of the circle when the map is pitched. -#### Type +### Type `enum` -#### Default Value +### Default Value `map` -#### Supported Values +### Supported Values **map** - Circles are scaled according to their apparent distance to the camera.
**viewport** - Circles are not scaled.
-#### Expression +### Expression Parameters: `zoom` ___ -#### circlePitchAlignment +### circlePitchAlignment Name: `circlePitchAlignment` -#### Description +### Description Orientation of circle when map is pitched. -#### Type +### Type `enum` -#### Default Value +### Default Value `viewport` -#### Supported Values +### Supported Values **map** - The circle is aligned to the plane of the map.
**viewport** - The circle is aligned to the plane of the viewport.
-#### Expression +### Expression Parameters: `zoom` ___ -#### circleStrokeWidth +### circleStrokeWidth Name: `circleStrokeWidth` -#### Description +### Description The width of the circle's stroke. Strokes are placed outside of the `circleRadius`. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Units +### Units `pixels` -#### Minimum +### Minimum `0` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `circleStrokeWidthTransition` -#### Description +### Description -The transition affecting any changes to this layer’s circleStrokeWidth propery. +The transition affecting any changes to this layer’s circleStrokeWidth property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### circleStrokeColor +### circleStrokeColor Name: `circleStrokeColor` -#### Description +### Description The stroke color of the circle. -#### Type +### Type `color` -#### Default Value +### Default Value `#000000` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `circleStrokeColorTransition` -#### Description +### Description -The transition affecting any changes to this layer’s circleStrokeColor propery. +The transition affecting any changes to this layer’s circleStrokeColor property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### circleStrokeOpacity +### circleStrokeOpacity Name: `circleStrokeOpacity` -#### Description +### Description The opacity of the circle's stroke. -#### Type +### Type `number` -#### Default Value +### Default Value `1` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `circleStrokeOpacityTransition` -#### Description +### Description -The transition affecting any changes to this layer’s circleStrokeOpacity propery. +The transition affecting any changes to this layer’s circleStrokeOpacity property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` diff --git a/docs/CustomHttpHeaders.md b/docs/CustomHttpHeaders.md index 18d57c9ea..4784d70f4 100644 --- a/docs/CustomHttpHeaders.md +++ b/docs/CustomHttpHeaders.md @@ -1,27 +1,25 @@ -## Custom http headers +# Custom http headers -### Intro - -Custom headers are implemented using OkHttp interseptor for android and method swizzling for iOS. +Custom headers are implemented using OkHttp interceptor for android and method swizzling for iOS. [Method swizzling](https://en.wikipedia.org/wiki/Monkey_patch) is done on the `[NSMutableURLRequest requestWithURL:]` to allow adding headers during runtime. -### Prerequisites +## Prerequisites -#### Android +### Android None -#### IOS with Mapbox-v10 +### iOS with Mapbox-v10 None -#### IOS with Mapbox GL or Mapblibre +### iOS with Mapbox GL or Mapblibre To enable this on iOS you need to call `[[MGLCustomHeaders sharedInstance] initHeaders]` pretty early in the lifecycle of the application. This will swizzle the custom method. Suggested location is `[AppDelegate application: didFinishLaunchingWithOptions:]` -#### Working example (AppDelegate.m) +### Working example (AppDelegate.m) ```obj-c // (1) Include the header file @@ -49,27 +47,27 @@ Suggested location is `[AppDelegate application: didFinishLaunchingWithOptions:] @end ``` -### Sending custom http headers with the tile requests +## Sending custom http headers with the tile requests You can configure sending of custom http headers to your tile server. This is to support custom authentication or custom metadata which can't be included in the url. You can add and remove headers at runtime. -#### To add a header +### To add a header ```javascript MapboxGL.addCustomHeader('Authorization', '{auth header}'); ``` -#### To remove a header +### To remove a header ```javascript MapboxGL.removeCustomHeader('Authorization'); ``` -#### Working example +### Working example -```javascript +```tsx export default class HelloWorldApp extends Component { componentDidMount() { MapboxGL.addCustomHeader('Authorization', '{auth header}'); diff --git a/docs/FillExtrusionLayer.md b/docs/FillExtrusionLayer.md index 163ad5772..1b0ca9e57 100644 --- a/docs/FillExtrusionLayer.md +++ b/docs/FillExtrusionLayer.md @@ -1,8 +1,8 @@ -## -### FillExtrusionLayer is a style layer that renders one or more 3D extruded polygons on the map. +# +FillExtrusionLayer is a style layer that renders one or more 3D extruded polygons on the map. -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | id | `string` | `none` | `true` | A string that uniquely identifies the source in the style to which it is added. | @@ -17,7 +17,7 @@ | style | `union` | `none` | `false` | Customizable style attributes | -### styles +## styles * visibility
* fillExtrusionOpacity
@@ -33,18 +33,18 @@ ___ -#### visibility +### visibility Name: `visibility` -#### Description +### Description Whether this layer is displayed. -#### Type +### Type `enum` -#### Default Value +### Default Value `visible` -#### Supported Values +### Supported Values **visible** - The layer is shown.
**none** - The layer is not shown.
@@ -52,382 +52,382 @@ Whether this layer is displayed. ___ -#### fillExtrusionOpacity +### fillExtrusionOpacity Name: `fillExtrusionOpacity` -#### Description +### Description The opacity of the entire fill extrusion layer. This is rendered on a perLayer, not perFeature, basis, and dataDriven styling is not available. -#### Type +### Type `number` -#### Default Value +### Default Value `1` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `fillExtrusionOpacityTransition` -#### Description +### Description -The transition affecting any changes to this layer’s fillExtrusionOpacity propery. +The transition affecting any changes to this layer’s fillExtrusionOpacity property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### fillExtrusionColor +### fillExtrusionColor Name: `fillExtrusionColor` -#### Description +### Description The base color of the extruded fill. The extrusion's surfaces will be shaded differently based on this color in combination with the root `light` settings. If this color is specified as `rgba` with an alpha component, the alpha component will be ignored; use `fillExtrusionOpacity` to set layer opacity. -#### Type +### Type `color` -#### Default Value +### Default Value `#000000` -#### Disabled By +### Disabled By `fillExtrusionPattern` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `fillExtrusionColorTransition` -#### Description +### Description -The transition affecting any changes to this layer’s fillExtrusionColor propery. +The transition affecting any changes to this layer’s fillExtrusionColor property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### fillExtrusionTranslate +### fillExtrusionTranslate Name: `fillExtrusionTranslate` -#### Description +### Description The geometry's offset. Values are [x, y] where negatives indicate left and up (on the flat plane), respectively. -#### Type +### Type `array` -#### Default Value +### Default Value `[0,0]` -#### Units +### Units `pixels` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `fillExtrusionTranslateTransition` -#### Description +### Description -The transition affecting any changes to this layer’s fillExtrusionTranslate propery. +The transition affecting any changes to this layer’s fillExtrusionTranslate property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### fillExtrusionTranslateAnchor +### fillExtrusionTranslateAnchor Name: `fillExtrusionTranslateAnchor` -#### Description +### Description Controls the frame of reference for `fillExtrusionTranslate`. -#### Type +### Type `enum` -#### Default Value +### Default Value `map` -#### Supported Values +### Supported Values **map** - The fill extrusion is translated relative to the map.
**viewport** - The fill extrusion is translated relative to the viewport.
-#### Requires +### Requires `fillExtrusionTranslate` -#### Expression +### Expression Parameters: `zoom` ___ -#### fillExtrusionPattern +### fillExtrusionPattern Name: `fillExtrusionPattern` -#### Description +### Description Name of image in sprite to use for drawing images on extruded fills. For seamless patterns, image width and height must be a factor of two (2, 4, 8, ..., 512). Note that zoomDependent expressions will be evaluated only at integer zoom levels. -#### Type +### Type `resolvedImage` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### Name +### Name `fillExtrusionPatternTransition` -#### Description +### Description -The transition affecting any changes to this layer’s fillExtrusionPattern propery. +The transition affecting any changes to this layer’s fillExtrusionPattern property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### fillExtrusionHeight +### fillExtrusionHeight Name: `fillExtrusionHeight` -#### Description +### Description The height with which to extrude this layer. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Units +### Units `meters` -#### Minimum +### Minimum `0` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `fillExtrusionHeightTransition` -#### Description +### Description -The transition affecting any changes to this layer’s fillExtrusionHeight propery. +The transition affecting any changes to this layer’s fillExtrusionHeight property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### fillExtrusionBase +### fillExtrusionBase Name: `fillExtrusionBase` -#### Description +### Description The height with which to extrude the base of this layer. Must be less than or equal to `fillExtrusionHeight`. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Units +### Units `meters` -#### Minimum +### Minimum `0` -#### Requires +### Requires `fillExtrusionHeight` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `fillExtrusionBaseTransition` -#### Description +### Description -The transition affecting any changes to this layer’s fillExtrusionBase propery. +The transition affecting any changes to this layer’s fillExtrusionBase property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### fillExtrusionVerticalGradient +### fillExtrusionVerticalGradient Name: `fillExtrusionVerticalGradient` -#### Description +### Description Whether to apply a vertical gradient to the sides of a fillExtrusion layer. If true, sides will be shaded slightly darker farther down. -#### Type +### Type `boolean` -#### Default Value +### Default Value `true` -#### Expression +### Expression Parameters: `zoom` ___ -#### fillExtrusionAmbientOcclusionIntensity +### fillExtrusionAmbientOcclusionIntensity Name: `fillExtrusionAmbientOcclusionIntensity` -#### Description +### Description Controls the intensity of ambient occlusion (AO) shading. Current AO implementation is a lowCost bestEffort approach that shades area near ground and concave angles between walls. Default value 0.0 disables ambient occlusion and values around 0.3 provide the most plausible results for buildings. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `fillExtrusionAmbientOcclusionIntensityTransition` -#### Description +### Description -The transition affecting any changes to this layer’s fillExtrusionAmbientOcclusionIntensity propery. +The transition affecting any changes to this layer’s fillExtrusionAmbientOcclusionIntensity property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### fillExtrusionAmbientOcclusionRadius +### fillExtrusionAmbientOcclusionRadius Name: `fillExtrusionAmbientOcclusionRadius` -#### Description +### Description The radius of ambient occlusion (AO) shading, in meters. Current AO implementation is a lowCost bestEffort approach that shades area near ground and concave angles between walls where the radius defines only vertical impact. Default value 3.0 corresponds to hight of one floor and brings the most plausible results for buildings. -#### Type +### Type `number` -#### Default Value +### Default Value `3` -#### Minimum +### Minimum `0` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `fillExtrusionAmbientOcclusionRadiusTransition` -#### Description +### Description -The transition affecting any changes to this layer’s fillExtrusionAmbientOcclusionRadius propery. +The transition affecting any changes to this layer’s fillExtrusionAmbientOcclusionRadius property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` diff --git a/docs/FillLayer.md b/docs/FillLayer.md index b0873407c..234048a44 100644 --- a/docs/FillLayer.md +++ b/docs/FillLayer.md @@ -1,8 +1,8 @@ -## -### FillLayer is a style layer that renders one or more filled (and optionally stroked) polygons on the map. +# +FillLayer is a style layer that renders one or more filled (and optionally stroked) polygons on the map. -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | id | `string` | `none` | `true` | A string that uniquely identifies the source in the style to which it is added. | @@ -17,7 +17,7 @@ | style | `union` | `none` | `false` | Customizable style attributes | -### styles +## styles * fillSortKey
* visibility
@@ -31,34 +31,34 @@ ___ -#### fillSortKey +### fillSortKey Name: `fillSortKey` -#### Description +### Description Sorts features in ascending order based on this value. Features with a higher sort key will appear above features with a lower sort key. -#### Type +### Type `number` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### visibility +### visibility Name: `visibility` -#### Description +### Description Whether this layer is displayed. -#### Type +### Type `enum` -#### Default Value +### Default Value `visible` -#### Supported Values +### Supported Values **visible** - The layer is shown.
**none** - The layer is not shown.
@@ -66,245 +66,245 @@ Whether this layer is displayed. ___ -#### fillAntialias +### fillAntialias Name: `fillAntialias` -#### Description +### Description Whether or not the fill should be antialiased. -#### Type +### Type `boolean` -#### Default Value +### Default Value `true` -#### Expression +### Expression Parameters: `zoom` ___ -#### fillOpacity +### fillOpacity Name: `fillOpacity` -#### Description +### Description The opacity of the entire fill layer. In contrast to the `fillColor`, this value will also affect the 1px stroke around the fill, if the stroke is used. -#### Type +### Type `number` -#### Default Value +### Default Value `1` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `fillOpacityTransition` -#### Description +### Description -The transition affecting any changes to this layer’s fillOpacity propery. +The transition affecting any changes to this layer’s fillOpacity property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### fillColor +### fillColor Name: `fillColor` -#### Description +### Description The color of the filled part of this layer. This color can be specified as `rgba` with an alpha component and the color's opacity will not affect the opacity of the 1px stroke, if it is used. -#### Type +### Type `color` -#### Default Value +### Default Value `#000000` -#### Disabled By +### Disabled By `fillPattern` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `fillColorTransition` -#### Description +### Description -The transition affecting any changes to this layer’s fillColor propery. +The transition affecting any changes to this layer’s fillColor property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### fillOutlineColor +### fillOutlineColor Name: `fillOutlineColor` -#### Description +### Description The outline color of the fill. Matches the value of `fillColor` if unspecified. -#### Type +### Type `color` -#### Disabled By +### Disabled By `fillPattern` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `fillOutlineColorTransition` -#### Description +### Description -The transition affecting any changes to this layer’s fillOutlineColor propery. +The transition affecting any changes to this layer’s fillOutlineColor property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### fillTranslate +### fillTranslate Name: `fillTranslate` -#### Description +### Description The geometry's offset. Values are [x, y] where negatives indicate left and up, respectively. -#### Type +### Type `array` -#### Default Value +### Default Value `[0,0]` -#### Units +### Units `pixels` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `fillTranslateTransition` -#### Description +### Description -The transition affecting any changes to this layer’s fillTranslate propery. +The transition affecting any changes to this layer’s fillTranslate property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### fillTranslateAnchor +### fillTranslateAnchor Name: `fillTranslateAnchor` -#### Description +### Description Controls the frame of reference for `fillTranslate`. -#### Type +### Type `enum` -#### Default Value +### Default Value `map` -#### Supported Values +### Supported Values **map** - The fill is translated relative to the map.
**viewport** - The fill is translated relative to the viewport.
-#### Requires +### Requires `fillTranslate` -#### Expression +### Expression Parameters: `zoom` ___ -#### fillPattern +### fillPattern Name: `fillPattern` -#### Description +### Description Name of image in sprite to use for drawing image fills. For seamless patterns, image width and height must be a factor of two (2, 4, 8, ..., 512). Note that zoomDependent expressions will be evaluated only at integer zoom levels. -#### Type +### Type `resolvedImage` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### Name +### Name `fillPatternTransition` -#### Description +### Description -The transition affecting any changes to this layer’s fillPattern propery. +The transition affecting any changes to this layer’s fillPattern property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` diff --git a/docs/HeadingIndicator.md b/docs/HeadingIndicator.md index e51321497..e67b35c07 100644 --- a/docs/HeadingIndicator.md +++ b/docs/HeadingIndicator.md @@ -1,8 +1,8 @@ -## -### +# -### props + +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | heading | `number` | `none` | `false` | FIX ME NO DESCRIPTION | diff --git a/docs/HeatmapLayer.md b/docs/HeatmapLayer.md index e19e9d3a0..e8bb78bee 100644 --- a/docs/HeatmapLayer.md +++ b/docs/HeatmapLayer.md @@ -1,8 +1,8 @@ -## -### HeatmapLayer is a style layer that renders one or more filled circles on the map. +# +HeatmapLayer is a style layer that renders one or more filled circles on the map. -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | id | `string` | `none` | `true` | A string that uniquely identifies the source in the style to which it is added. | @@ -17,7 +17,7 @@ | style | `union` | `none` | `false` | Customizable style attributes | -### styles +## styles * visibility
* heatmapRadius
@@ -28,18 +28,18 @@ ___ -#### visibility +### visibility Name: `visibility` -#### Description +### Description Whether this layer is displayed. -#### Type +### Type `enum` -#### Default Value +### Default Value `visible` -#### Supported Values +### Supported Values **visible** - The layer is shown.
**none** - The layer is not shown.
@@ -47,169 +47,169 @@ Whether this layer is displayed. ___ -#### heatmapRadius +### heatmapRadius Name: `heatmapRadius` -#### Description +### Description Radius of influence of one heatmap point in pixels. Increasing the value makes the heatmap smoother, but less detailed. `queryRenderedFeatures` on heatmap layers will return points within this radius. -#### Type +### Type `number` -#### Default Value +### Default Value `30` -#### Units +### Units `pixels` -#### Minimum +### Minimum `1` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `heatmapRadiusTransition` -#### Description +### Description -The transition affecting any changes to this layer’s heatmapRadius propery. +The transition affecting any changes to this layer’s heatmapRadius property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### heatmapWeight +### heatmapWeight Name: `heatmapWeight` -#### Description +### Description A measure of how much an individual point contributes to the heatmap. A value of 10 would be equivalent to having 10 points of weight 1 in the same spot. Especially useful when combined with clustering. -#### Type +### Type `number` -#### Default Value +### Default Value `1` -#### Minimum +### Minimum `0` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### heatmapIntensity +### heatmapIntensity Name: `heatmapIntensity` -#### Description +### Description Similar to `heatmapWeight` but controls the intensity of the heatmap globally. Primarily used for adjusting the heatmap based on zoom level. -#### Type +### Type `number` -#### Default Value +### Default Value `1` -#### Minimum +### Minimum `0` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `heatmapIntensityTransition` -#### Description +### Description -The transition affecting any changes to this layer’s heatmapIntensity propery. +The transition affecting any changes to this layer’s heatmapIntensity property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### heatmapColor +### heatmapColor Name: `heatmapColor` -#### Description +### Description Defines the color of each pixel based on its density value in a heatmap. Should be an expression that uses `["heatmapDensity"]` as input. -#### Type +### Type `color` -#### Default Value +### Default Value `interpolate,linear,heatmap-density,0,rgba(0, 0, 255, 0),0.1,royalblue,0.3,cyan,0.5,lime,0.7,yellow,1,red` -#### Expression +### Expression Parameters: `heatmap-density` ___ -#### heatmapOpacity +### heatmapOpacity Name: `heatmapOpacity` -#### Description +### Description The global opacity at which the heatmap layer will be drawn. -#### Type +### Type `number` -#### Default Value +### Default Value `1` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `heatmapOpacityTransition` -#### Description +### Description -The transition affecting any changes to this layer’s heatmapOpacity propery. +The transition affecting any changes to this layer’s heatmapOpacity property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` diff --git a/docs/ImageSource.md b/docs/ImageSource.md index 04bc95912..304c73bf4 100644 --- a/docs/ImageSource.md +++ b/docs/ImageSource.md @@ -1,8 +1,9 @@ -## -### ImageSource is a content source that is used for a georeferenced raster image to be shown on the map.
The georeferenced image scales and rotates as the user zooms and rotates the map +# +ImageSource is a content source that is used for a georeferenced raster image to be shown on the map. +The georeferenced image scales and rotates as the user zooms and rotates the map -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | id | `string` | `none` | `true` | A string that uniquely identifies the source. | diff --git a/docs/Images.md b/docs/Images.md index 7bf0a4b24..64ced7068 100644 --- a/docs/Images.md +++ b/docs/Images.md @@ -1,8 +1,8 @@ -## -### Images defines the images used in Symbol etc layers +# +Images defines the images used in Symbol etc. layers. -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | images | `object` | `none` | `false` | Specifies the external images in key-value pairs required for the shape source.
Keys are names - see iconImage expressions, values can be either urls-s objects
with format {uri: 'http://...'}` or `require('image.png')` or `import 'image.png'` | diff --git a/docs/Light.md b/docs/Light.md index ecafcae8d..7709fba0b 100644 --- a/docs/Light.md +++ b/docs/Light.md @@ -1,14 +1,14 @@ -## -### Light represents the light source for extruded geometries +# +Light represents the light source for extruded geometries -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | style | `custom` | `none` | `false` | Customizable style attributes | -### styles +## styles * anchor
* position
@@ -17,143 +17,143 @@ ___ -#### anchor +### anchor Name: `anchor` -#### Description +### Description Whether extruded geometries are lit relative to the map or viewport. -#### Type +### Type `enum` -#### Default Value +### Default Value `viewport` -#### Supported Values +### Supported Values **map** - The position of the light source is aligned to the rotation of the map.
**viewport** - The position of the light source is aligned to the rotation of the viewport.
-#### Expression +### Expression Parameters: `zoom` ___ -#### position +### position Name: `position` -#### Description +### Description Position of the light source relative to lit (extruded) geometries, in [r radial coordinate, a azimuthal angle, p polar angle] where r indicates the distance from the center of the base of an object to its light, a indicates the position of the light relative to 0° (0° when `light.anchor` is set to `viewport` corresponds to the top of the viewport, or 0° when `light.anchor` is set to `map` corresponds to due north, and degrees proceed clockwise), and p indicates the height of the light (from 0°, directly above, to 180°, directly below). -#### Type +### Type `array` -#### Default Value +### Default Value `[1.15,210,30]` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `positionTransition` -#### Description +### Description -The transition affecting any changes to this layer’s position propery. +The transition affecting any changes to this layer’s position property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### color +### color Name: `color` -#### Description +### Description Color tint for lighting extruded geometries. -#### Type +### Type `color` -#### Default Value +### Default Value `#ffffff` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `colorTransition` -#### Description +### Description -The transition affecting any changes to this layer’s color propery. +The transition affecting any changes to this layer’s color property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### intensity +### intensity Name: `intensity` -#### Description +### Description Intensity of lighting (on a scale from 0 to 1). Higher numbers will present as more extreme contrast. -#### Type +### Type `number` -#### Default Value +### Default Value `0.5` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `intensityTransition` -#### Description +### Description -The transition affecting any changes to this layer’s intensity propery. +The transition affecting any changes to this layer’s intensity property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` diff --git a/docs/LineLayer.md b/docs/LineLayer.md index 3d09ece33..963550a06 100644 --- a/docs/LineLayer.md +++ b/docs/LineLayer.md @@ -1,8 +1,8 @@ -## -### LineLayer is a style layer that renders one or more stroked polylines on the map. +# +LineLayer is a style layer that renders one or more stroked polylines on the map. -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | id | `string` | `none` | `true` | A string that uniquely identifies the source in the style to which it is added. | @@ -17,7 +17,7 @@ | style | `union` | `none` | `false` | Customizable style attributes | -### styles +## styles * lineCap
* lineJoin
@@ -40,118 +40,118 @@ ___ -#### lineCap +### lineCap Name: `lineCap` -#### Description +### Description The display of line endings. -#### Type +### Type `enum` -#### Default Value +### Default Value `butt` -#### Supported Values +### Supported Values **butt** - A cap with a squared-off end which is drawn to the exact endpoint of the line.
**round** - A cap with a rounded end which is drawn beyond the endpoint of the line at a radius of one-half of the line's width and centered on the endpoint of the line.
**square** - A cap with a squared-off end which is drawn beyond the endpoint of the line at a distance of one-half of the line's width.
-#### Expression +### Expression Parameters: `zoom, feature` ___ -#### lineJoin +### lineJoin Name: `lineJoin` -#### Description +### Description The display of lines when joining. -#### Type +### Type `enum` -#### Default Value +### Default Value `miter` -#### Supported Values +### Supported Values **bevel** - A join with a squared-off end which is drawn beyond the endpoint of the line at a distance of one-half of the line's width.
**round** - A join with a rounded end which is drawn beyond the endpoint of the line at a radius of one-half of the line's width and centered on the endpoint of the line.
**miter** - A join with a sharp, angled corner which is drawn with the outer sides beyond the endpoint of the path until they meet.
-#### Supported Style Functions +### Supported Style Functions `camera` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### lineMiterLimit +### lineMiterLimit Name: `lineMiterLimit` -#### Description +### Description Used to automatically convert miter joins to bevel joins for sharp angles. -#### Type +### Type `number` -#### Default Value +### Default Value `2` -#### Expression +### Expression Parameters: `zoom` ___ -#### lineRoundLimit +### lineRoundLimit Name: `lineRoundLimit` -#### Description +### Description Used to automatically convert round joins to miter joins for shallow angles. -#### Type +### Type `number` -#### Default Value +### Default Value `1.05` -#### Expression +### Expression Parameters: `zoom` ___ -#### lineSortKey +### lineSortKey Name: `lineSortKey` -#### Description +### Description Sorts features in ascending order based on this value. Features with a higher sort key will appear above features with a lower sort key. -#### Type +### Type `number` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### visibility +### visibility Name: `visibility` -#### Description +### Description Whether this layer is displayed. -#### Type +### Type `enum` -#### Default Value +### Default Value `visible` -#### Supported Values +### Supported Values **visible** - The layer is shown.
**none** - The layer is not shown.
@@ -159,448 +159,448 @@ Whether this layer is displayed. ___ -#### lineOpacity +### lineOpacity Name: `lineOpacity` -#### Description +### Description The opacity at which the line will be drawn. -#### Type +### Type `number` -#### Default Value +### Default Value `1` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `lineOpacityTransition` -#### Description +### Description -The transition affecting any changes to this layer’s lineOpacity propery. +The transition affecting any changes to this layer’s lineOpacity property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### lineColor +### lineColor Name: `lineColor` -#### Description +### Description The color with which the line will be drawn. -#### Type +### Type `color` -#### Default Value +### Default Value `#000000` -#### Disabled By +### Disabled By `linePattern` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `lineColorTransition` -#### Description +### Description -The transition affecting any changes to this layer’s lineColor propery. +The transition affecting any changes to this layer’s lineColor property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### lineTranslate +### lineTranslate Name: `lineTranslate` -#### Description +### Description The geometry's offset. Values are [x, y] where negatives indicate left and up, respectively. -#### Type +### Type `array` -#### Default Value +### Default Value `[0,0]` -#### Units +### Units `pixels` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `lineTranslateTransition` -#### Description +### Description -The transition affecting any changes to this layer’s lineTranslate propery. +The transition affecting any changes to this layer’s lineTranslate property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### lineTranslateAnchor +### lineTranslateAnchor Name: `lineTranslateAnchor` -#### Description +### Description Controls the frame of reference for `lineTranslate`. -#### Type +### Type `enum` -#### Default Value +### Default Value `map` -#### Supported Values +### Supported Values **map** - The line is translated relative to the map.
**viewport** - The line is translated relative to the viewport.
-#### Requires +### Requires `lineTranslate` -#### Expression +### Expression Parameters: `zoom` ___ -#### lineWidth +### lineWidth Name: `lineWidth` -#### Description +### Description Stroke thickness. -#### Type +### Type `number` -#### Default Value +### Default Value `1` -#### Units +### Units `pixels` -#### Minimum +### Minimum `0` -#### Supported Style Functions +### Supported Style Functions `camera` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `lineWidthTransition` -#### Description +### Description -The transition affecting any changes to this layer’s lineWidth propery. +The transition affecting any changes to this layer’s lineWidth property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### lineGapWidth +### lineGapWidth Name: `lineGapWidth` -#### Description +### Description Draws a line casing outside of a line's actual path. Value indicates the width of the inner gap. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Units +### Units `pixels` -#### Minimum +### Minimum `0` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `lineGapWidthTransition` -#### Description +### Description -The transition affecting any changes to this layer’s lineGapWidth propery. +The transition affecting any changes to this layer’s lineGapWidth property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### lineOffset +### lineOffset Name: `lineOffset` -#### Description +### Description The line's offset. For linear features, a positive value offsets the line to the right, relative to the direction of the line, and a negative value to the left. For polygon features, a positive value results in an inset, and a negative value results in an outset. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Units +### Units `pixels` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `lineOffsetTransition` -#### Description +### Description -The transition affecting any changes to this layer’s lineOffset propery. +The transition affecting any changes to this layer’s lineOffset property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### lineBlur +### lineBlur Name: `lineBlur` -#### Description +### Description Blur applied to the line, in pixels. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Units +### Units `pixels` -#### Minimum +### Minimum `0` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `lineBlurTransition` -#### Description +### Description -The transition affecting any changes to this layer’s lineBlur propery. +The transition affecting any changes to this layer’s lineBlur property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### lineDasharray +### lineDasharray Name: `lineDasharray` -#### Description +### Description Specifies the lengths of the alternating dashes and gaps that form the dash pattern. The lengths are later scaled by the line width. To convert a dash length to pixels, multiply the length by the current line width. Note that GeoJSON sources with `lineMetrics: true` specified won't render dashed lines to the expected scale. Also note that zoomDependent expressions will be evaluated only at integer zoom levels. -#### Type +### Type `array` -#### Units +### Units `line widths` -#### Minimum +### Minimum `0` -#### Disabled By +### Disabled By `linePattern` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### Name +### Name `lineDasharrayTransition` -#### Description +### Description -The transition affecting any changes to this layer’s lineDasharray propery. +The transition affecting any changes to this layer’s lineDasharray property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### linePattern +### linePattern Name: `linePattern` -#### Description +### Description Name of image in sprite to use for drawing image lines. For seamless patterns, image width must be a factor of two (2, 4, 8, ..., 512). Note that zoomDependent expressions will be evaluated only at integer zoom levels. -#### Type +### Type `resolvedImage` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### Name +### Name `linePatternTransition` -#### Description +### Description -The transition affecting any changes to this layer’s linePattern propery. +The transition affecting any changes to this layer’s linePattern property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### lineGradient +### lineGradient Name: `lineGradient` -#### Description +### Description Defines a gradient with which to color a line feature. Can only be used with GeoJSON sources that specify `"lineMetrics": true`. -#### Type +### Type `color` -#### Disabled By +### Disabled By `linePattern` -#### Expression +### Expression Parameters: `line-progress` ___ -#### lineTrimOffset +### lineTrimOffset Name: `lineTrimOffset` -#### Description +### Description The line part between [trimStart, trimEnd] will be marked as transparent to make a route vanishing effect. The line trimOff offset is based on the whole line range [0.0, 1.0]. -#### Type +### Type `array` -#### Default Value +### Default Value `[0,0]` -#### Minimum +### Minimum `0,0` -#### Maximum +### Maximum `1,1` diff --git a/docs/Logger.md b/docs/Logger.md index c7c5f2fca..ce858efc9 100644 --- a/docs/Logger.md +++ b/docs/Logger.md @@ -1,23 +1,22 @@ -## Logger -### +# Logger -### methods -#### setLogLevel(LogLevel) +## methods +### setLogLevel(LogLevel) -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `LogLevel` | `String` | `Yes` | required level of logging, can be `"error" | "warning" | "info" | "debug" | "verbose"` | -##### Description +#### Description sets the amount of logging -#### setLogCallback(LogCallback) +### setLogCallback(LogCallback) -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `LogCallback` | `function` | `Yes` | callback taking a log object `{ message: String, level: LogLevel, tag: String }` as param. If callback return falsy value then default logging will take place. | -##### Description +#### Description overwrite logging - good to mute specific errors/ warnings \ No newline at end of file diff --git a/docs/MapView.md b/docs/MapView.md index a6a6ff284..0880d90ec 100644 --- a/docs/MapView.md +++ b/docs/MapView.md @@ -1,15 +1,15 @@ -## -### MapView backed by Mapbox Native GL +# +MapView backed by Mapbox Native GL -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | contentInset | `union` | `none` | `false` | The distance from the edges of the map view’s frame to the edges of the map view’s logical viewport. | | style | `any` | `none` | `false` | Style for wrapping React Native View | | styleURL | `string` | `none` | `false` | Style URL for map - notice, if non is set it _will_ default to `MapboxGL.StyleURL.Street` | | styleJSON | `string` | `none` | `false` | StyleJSON for map - according to TileJSON specs: https://github.com/mapbox/tilejson-spec | -| preferredFramesPerSecond | `number` | `none` | `false` | iOS: The preferred frame rate at which the map view is rendered.
The default value for this property is MGLMapViewPreferredFramesPerSecondDefault,
which will adaptively set the preferred frame rate based on the capability of
the user’s device to maintain a smooth experience. This property can be set to arbitrary integer values.

Android: The maximum frame rate at which the map view is rendered, but it can't excess the ability of device hardware.
This property can be set to arbitrary integer values. | +| preferredFramesPerSecond | `number` | `none` | `false` | iOS: The preferred frame rate at which the map view is rendered.
The default value for this property is MGLMapViewPreferredFramesPerSecondDefault,
which will adaptively set the preferred frame rate based on the capability of
the user’s device to maintain a smooth experience. This property can be set to arbitrary integer values.

Android: The maximum frame rate at which the map view is rendered, but it can't exceed the ability of device hardware.
This property can be set to arbitrary integer values. | | localizeLabels | `bool` | `false` | `false` | Automatically change the language of the map labels to the system’s preferred language,
this is not something that can be toggled on/off | | zoomEnabled | `bool` | `none` | `false` | Enable/Disable zoom on the map | | scrollEnabled | `bool` | `true` | `false` | Enable/Disable scroll on the map | @@ -27,7 +27,7 @@ | compassViewMargins | `object` | `none` | `false` | Add margins to the compass with x and y values | | scaleBarEnabled | `bool` | `true` | `false` | [`mapbox` (v10) implementation only] Enable/Disable the scale bar from appearing on the map | | scaleBarPosition | `custom` | `none` | `false` | [`mapbox` (v10) implementation only] Adds scale bar offset, e.g. `{top: 8, left: 8}` will put the scale bar in top-left corner of the map | -| surfaceView | `bool` | `false` | `false` | [Android only] Enable/Disable use of GLSurfaceView insted of TextureView. | +| surfaceView | `bool` | `false` | `false` | [Android only] Enable/Disable use of GLSurfaceView instead of TextureView. | | onPress | `func` | `none` | `false` | Map press listener, gets called when a user presses the map | | onLongPress | `func` | `none` | `false` | Map long press listener, gets called when a user long presses the map | | onRegionWillChange | `func` | `none` | `false` |
This event is triggered whenever the currently displayed map region is about to change. | @@ -49,12 +49,12 @@ | regionWillChangeDebounceTime | `number` | `10` | `false` | The emitted frequency of regionwillchange events | | regionDidChangeDebounceTime | `number` | `500` | `false` | The emitted frequency of regiondidchange events | -### methods -#### getPointInView(coordinate) +## methods +### getPointInView(coordinate) Converts a geographic coordinate to a point in the given view’s coordinate system. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `coordinate` | `Array` | `Yes` | A point expressed in the map view's coordinate system. | @@ -66,11 +66,11 @@ const pointInView = await this._map.getPointInView([-37.817070, 144.949901]); ``` -#### getCoordinateFromView(point) +### getCoordinateFromView(point) Converts a point in the given view’s coordinate system to a geographic coordinate. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `point` | `Array` | `Yes` | A point expressed in the given view’s coordinate system. | @@ -82,11 +82,11 @@ const coordinate = await this._map.getCoordinateFromView([100, 100]); ``` -#### getVisibleBounds() +### getVisibleBounds() -The coordinate bounds(ne, sw) visible in the users’s viewport. +The coordinate bounds (ne, sw) visible in the user’s viewport. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | @@ -98,11 +98,11 @@ const visibleBounds = await this._map.getVisibleBounds(); ``` -#### queryRenderedFeaturesAtPoint(coordinate[, filter][, layerIDs]) +### queryRenderedFeaturesAtPoint(coordinate[, filter][, layerIDs]) Returns an array of rendered map features that intersect with a given point. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `coordinate` | `Array` | `Yes` | A point expressed in the map view’s coordinate system. | @@ -116,11 +116,11 @@ this._map.queryRenderedFeaturesAtPoint([30, 40], ['==', 'type', 'Point'], ['id1' ``` -#### queryRenderedFeaturesInRect(bbox[, filter][, layerIDs]) +### queryRenderedFeaturesInRect(bbox[, filter][, layerIDs]) Returns an array of rendered map features that intersect with the given rectangle,
restricted to the given style layers and filtered by the given predicate. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `bbox` | `Array` | `Yes` | A rectangle expressed in the map view’s coordinate system. | @@ -134,31 +134,31 @@ this._map.queryRenderedFeaturesInRect([30, 40, 20, 10], ['==', 'type', 'Point'], ``` -#### setCamera() +### setCamera() Map camera will perform updates based on provided config. Deprecated use Camera#setCamera. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | -#### takeSnap(writeToDisk) +### takeSnap(writeToDisk) Takes snapshot of map with current tiles and returns a URI to the image -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `writeToDisk` | `Boolean` | `Yes` | If true will create a temp file, otherwise it is in base64 | -#### getZoom() +### getZoom() Returns the current zoom of the map view. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | @@ -170,11 +170,11 @@ const zoom = await this._map.getZoom(); ``` -#### getCenter() +### getCenter() Returns the map's geographical centerpoint -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | @@ -186,21 +186,21 @@ const center = await this._map.getCenter(); ``` -#### queryTerrainElevation(coordinate) +### queryTerrainElevation(coordinate) Queries the currently loaded data for elevation at a geographical location.
The elevation is returned in meters relative to mean sea-level.
Returns null if terrain is disabled or if terrain data for the location hasn't been loaded yet. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `coordinate` | `Array` | `Yes` | the coordinates to query elevation at | -#### setSourceVisibility(visible, sourceId[, sourceLayerId]) +### setSourceVisibility(visible, sourceId[, sourceLayerId]) Sets the visibility of all the layers referencing the specified `sourceLayerId` and/or `sourceId` -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `visible` | `boolean` | `Yes` | Visibility of the layers | @@ -214,11 +214,11 @@ await this._map.setSourceVisibility(false, 'composite', 'building') ``` -#### showAttribution() +### showAttribution() Show the attribution and telemetry action sheet.
If you implement a custom attribution button, you should add this action to the button. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | diff --git a/docs/MapboxGL.md b/docs/MapboxGL.md index cd87f13ea..d8523f0e8 100644 --- a/docs/MapboxGL.md +++ b/docs/MapboxGL.md @@ -1,84 +1,83 @@ -## MapboxGL -### +# MapboxGL -### methods -#### setAccessToken(accessToken) +## methods +### setAccessToken(accessToken) -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `accessToken` | `String` | `Yes` | required acessToken to pull mapbox tiles, can be `null` if other tiles are used | -##### Description +#### Description sets the accessToken, which is required when you want to use mapbox tiles not required when using other tiles -#### setWellKnownTileServer(tileServer) +### setWellKnownTileServer(tileServer) -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `tileServer` | `String` | `Yes` | tile server | -##### Description +#### Description No-op on non MapLibre implemntations. Use MapboxGL.TileServer.Mapbox to consume mapbox tiles with maplibre. *Note*: Consuming mapbox with MapLibre has different pricing than with the official SDK. Other values: MapboxGL.TileServer.MapLibre, MapboxGL.TileServer.MapTiler -#### getAccessToken() +### getAccessToken() -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `accessToken` | `String` | `Yes` | required acessToken to pull mapbox tiles, can be `null` if other tiles are used | -##### Description +#### Description gets the accessToken -#### addCustomHeader(headerName, headerValue) +### addCustomHeader(headerName, headerValue) -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `headerName` | `String` | `Yes` | name for customHeader | | `headerValue` | `String` | `Yes` | value for customHeader | -##### Description +#### Description also see [CustomHttpHeaders](/docs/CustomHttpHeaders.md) -#### removeCustomHeader(headerName) +### removeCustomHeader(headerName) -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `headerName` | `String` | `Yes` | name of customHeader to be removed | -##### Description +#### Description also see [CustomHttpHeaders](/docs/CustomHttpHeaders.md) -#### setTelemetryEnabled(telemetryEnabled) +### setTelemetryEnabled(telemetryEnabled) -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `telemetryEnabled` | `Boolean` | `Yes` | | -##### Description +#### Description If mapbox' telemetry should be enabled or not -### Android only -#### requestAndroidLocationPermissions() -##### Description +## Android only +### requestAndroidLocationPermissions() +#### Description Opens Android Location Permission prompt. Returns a Promise which resolves into a boolean. Either permission was granted or denied. -#### setConnected(connected) -##### arguments +### setConnected(connected) +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `connected` | `Boolean` | `Yes` | whether or not mapbox is told to be connected or not | -#### Description +### Description If you want to fully block online map - maybe to force offline maps diff --git a/docs/MarkerView.md b/docs/MarkerView.md index a20bcb603..01fec74f8 100644 --- a/docs/MarkerView.md +++ b/docs/MarkerView.md @@ -1,8 +1,13 @@ -## -### MarkerView allows you to place a interactive react native marker to the map.

If you have static view consider using PointAnnotation or SymbolLayer they'll offer much better performance
.
This is based on [MakerView plugin](https://docs.mapbox.com/android/plugins/overview/markerview/) on Android
and PointAnnotation on iOS. +# +MarkerView allows you to place an interactive React Native marker to the map. -### props +If you have static view consider using PointAnnotation or SymbolLayer they'll offer much better performance. + +This is based on [MakerView plugin](https://docs.mapbox.com/android/plugins/overview/markerview/) on Android +and PointAnnotation on iOS. + +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | coordinate | `array` | `none` | `true` | The center point (specified as a map coordinate) of the marker.
See also #anchor. | diff --git a/docs/NativeUserLocation.md b/docs/NativeUserLocation.md index c97db255e..598caeb9e 100644 --- a/docs/NativeUserLocation.md +++ b/docs/NativeUserLocation.md @@ -1,8 +1,8 @@ -## -### +# -### props + +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | androidRenderMode | `enum` | `none` | `false` | Android render mode.

- normal: just a circle
- compass: triangle with heading
- gps: large arrow

@platform android | diff --git a/docs/OfflineManager.md b/docs/OfflineManager.md index eaae72267..b05df6e0f 100644 --- a/docs/OfflineManager.md +++ b/docs/OfflineManager.md @@ -1,14 +1,16 @@ -## -### OfflineManager implements a singleton (shared object) that manages offline packs.
All of this class’s instance methods are asynchronous, reflecting the fact that offline resources are stored in a database.
The shared object maintains a canonical collection of offline packs. +# +OfflineManager implements a singleton (shared object) that manages offline packs. +All of this class’s instance methods are asynchronous, reflecting the fact that offline resources are stored in a database. +The shared object maintains a canonical collection of offline packs. -### methods -#### createPack(options[, progressListener][, errorListener]) +## methods +### createPack(options[, progressListener][, errorListener]) Creates and registers an offline pack that downloads the resources needed to use the given region offline. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `options` | `OfflineCreatePackOptions` | `Yes` | Create options for a offline pack that specifices zoom levels, style url, and the region to download. | @@ -31,11 +33,11 @@ await MapboxGL.offlineManager.createPack({ ``` -#### invalidatePack(name) +### invalidatePack(name) Invalidates the specified offline pack. This method checks that the tiles in the specified offline pack match those from the server. Local tiles that do not match the latest version on the server are updated.This is more efficient than deleting the offline pack and downloading it again. If the data stored locally matches that on the server, new data will not be downloaded. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `name` | `String` | `Yes` | Name of the offline pack. | @@ -47,11 +49,11 @@ await MapboxGL.offlineManager.invalidatePack('packName') ``` -#### deletePack(name) +### deletePack(name) Unregisters the given offline pack and allows resources that are no longer required by any remaining packs to be potentially freed. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `name` | `String` | `Yes` | Name of the offline pack. | @@ -63,11 +65,11 @@ await MapboxGL.offlineManager.deletePack('packName') ``` -#### invalidateAmbientCache() +### invalidateAmbientCache() Forces a revalidation of the tiles in the ambient cache and downloads a fresh version of the tiles from the tile server.
This is the recommend method for clearing the cache.
This is the most efficient method because tiles in the ambient cache are re-downloaded to remove outdated data from a device.
It does not erase resources from the ambient cache or delete the database, which can be computationally expensive operations that may carry unintended side effects. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | @@ -79,11 +81,11 @@ await MapboxGL.offlineManager.invalidateAmbientCache(); ``` -#### clearAmbientCache() +### clearAmbientCache() Erases resources from the ambient cache.
This method clears the cache and decreases the amount of space that map resources take up on the device. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | @@ -95,11 +97,11 @@ await MapboxGL.offlineManager.clearAmbientCache(); ``` -#### migrateOfflineCache() +### migrateOfflineCache() Migrates the offline cache from pre-v10 SDKs to the new v10 cache location -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | @@ -111,11 +113,11 @@ await MapboxGL.offlineManager.migrateOfflineCache() ``` -#### setMaximumAmbientCacheSize(size) +### setMaximumAmbientCacheSize(size) Sets the maximum size of the ambient cache in bytes. Disables the ambient cache if set to 0.
This method may be computationally expensive because it will erase resources from the ambient cache if its size is decreased. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `size` | `Number` | `Yes` | Size of ambient cache. | @@ -127,11 +129,11 @@ await MapboxGL.offlineManager.setMaximumAmbientCacheSize(5000000); ``` -#### resetDatabase() +### resetDatabase() Deletes the existing database, which includes both the ambient cache and offline packs, then reinitializes it. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | @@ -143,11 +145,11 @@ await MapboxGL.offlineManager.resetDatabase(); ``` -#### getPacks() +### getPacks() Retrieves all the current offline packs that are stored in the database. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | @@ -159,11 +161,11 @@ const offlinePacks = await MapboxGL.offlineManager.getPacks(); ``` -#### getPack(name) +### getPack(name) Retrieves an offline pack that is stored in the database by name. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `name` | `String` | `Yes` | Name of the offline pack. | @@ -175,11 +177,11 @@ const offlinePack = await MapboxGL.offlineManager.getPack(); ``` -#### mergeOfflineRegions(path) +### mergeOfflineRegions(path) Sideloads offline db -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `path` | `String` | `Yes` | Path to offline tile db on file system. | @@ -191,11 +193,11 @@ await MapboxGL.offlineManager.mergeOfflineRegions(path); ``` -#### setTileCountLimit(limit) +### setTileCountLimit(limit) Sets the maximum number of Mapbox-hosted tiles that may be downloaded and stored on the current device.
The Mapbox Terms of Service prohibit changing or bypassing this limit without permission from Mapbox. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `limit` | `Number` | `Yes` | Map tile limit count. | @@ -207,11 +209,11 @@ MapboxGL.offlineManager.setTileCountLimit(1000); ``` -#### setProgressEventThrottle(throttleValue) +### setProgressEventThrottle(throttleValue) Sets the period at which download status events will be sent over the React Native bridge.
The default is 500ms. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `throttleValue` | `Number` | `Yes` | event throttle value in ms. | @@ -223,11 +225,11 @@ MapboxGL.offlineManager.setProgressEventThrottle(500); ``` -#### subscribe(packName, progressListener, errorListener) +### subscribe(packName, progressListener, errorListener) Subscribe to download status/error events for the requested offline pack.
Note that createPack calls this internally if listeners are provided. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `packName` | `String` | `Yes` | Name of the offline pack. | @@ -243,11 +245,11 @@ MapboxGL.offlineManager.subscribe('packName', progressListener, errorListener) ``` -#### unsubscribe(packName) +### unsubscribe(packName) Unsubscribes any listeners associated with the offline pack.
It's a good idea to call this on componentWillUnmount. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `packName` | `String` | `Yes` | Name of the offline pack. | diff --git a/docs/PointAnnotation.md b/docs/PointAnnotation.md index 713b36924..ba2f2e12f 100644 --- a/docs/PointAnnotation.md +++ b/docs/PointAnnotation.md @@ -1,8 +1,14 @@ -## -### PointAnnotation represents a one-dimensional shape located at a single geographical coordinate.

Consider using ShapeSource and SymbolLayer instead, if you have many points and you have static images,
they'll offer much better performance.

If you need interactive views please use MarkerView,
as with PointAnnotation on Android child views are rendered onto a bitmap for better performance. +# +PointAnnotation represents a one-dimensional shape located at a single geographical coordinate. -### props +Consider using ShapeSource and SymbolLayer instead, if you have many points and you have static images, +they'll offer much better performance. + +If you need interactive views please use MarkerView, +as with PointAnnotation on Android child views are rendered onto a bitmap for better performance. + +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | id | `string` | `none` | `true` | A string that uniquely identifies the annotation | @@ -20,12 +26,12 @@ | onDragEnd | `func` | `none` | `false` | This callback is fired once this annotation has stopped being dragged. | | onDrag | `func` | `none` | `false` | This callback is fired while this annotation is being dragged. | -### methods -#### refresh() +## methods +### refresh() On v10 and pre v10 android point annotation is rendered offscreen with a canvas into an image.
To rerender the image from the current state of the view call refresh.
Call this for example from Image#onLoad. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | diff --git a/docs/RasterDemSource.md b/docs/RasterDemSource.md index 43fe5fb18..306cc410c 100644 --- a/docs/RasterDemSource.md +++ b/docs/RasterDemSource.md @@ -1,8 +1,8 @@ -## -### +# -### props + +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | id | `string` | `MapboxGL.StyleSource.DefaultSourceID` | `false` | A string that uniquely identifies the source. | diff --git a/docs/RasterLayer.md b/docs/RasterLayer.md index c0df673f0..bb1b605fe 100644 --- a/docs/RasterLayer.md +++ b/docs/RasterLayer.md @@ -1,8 +1,8 @@ -## -### +# -### props + +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | id | `string` | `none` | `true` | A string that uniquely identifies the source in the style to which it is added. | @@ -17,7 +17,7 @@ | style | `union` | `none` | `false` | Customizable style attributes | -### styles +## styles * visibility
* rasterOpacity
@@ -31,18 +31,18 @@ ___ -#### visibility +### visibility Name: `visibility` -#### Description +### Description Whether this layer is displayed. -#### Type +### Type `enum` -#### Default Value +### Default Value `visible` -#### Supported Values +### Supported Values **visible** - The layer is shown.
**none** - The layer is not shown.
@@ -50,308 +50,308 @@ Whether this layer is displayed. ___ -#### rasterOpacity +### rasterOpacity Name: `rasterOpacity` -#### Description +### Description The opacity at which the image will be drawn. -#### Type +### Type `number` -#### Default Value +### Default Value `1` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `rasterOpacityTransition` -#### Description +### Description -The transition affecting any changes to this layer’s rasterOpacity propery. +The transition affecting any changes to this layer’s rasterOpacity property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### rasterHueRotate +### rasterHueRotate Name: `rasterHueRotate` -#### Description +### Description Rotates hues around the color wheel. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Units +### Units `degrees` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `rasterHueRotateTransition` -#### Description +### Description -The transition affecting any changes to this layer’s rasterHueRotate propery. +The transition affecting any changes to this layer’s rasterHueRotate property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### rasterBrightnessMin +### rasterBrightnessMin Name: `rasterBrightnessMin` -#### Description +### Description Increase or reduce the brightness of the image. The value is the minimum brightness. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `rasterBrightnessMinTransition` -#### Description +### Description -The transition affecting any changes to this layer’s rasterBrightnessMin propery. +The transition affecting any changes to this layer’s rasterBrightnessMin property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### rasterBrightnessMax +### rasterBrightnessMax Name: `rasterBrightnessMax` -#### Description +### Description Increase or reduce the brightness of the image. The value is the maximum brightness. -#### Type +### Type `number` -#### Default Value +### Default Value `1` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `rasterBrightnessMaxTransition` -#### Description +### Description -The transition affecting any changes to this layer’s rasterBrightnessMax propery. +The transition affecting any changes to this layer’s rasterBrightnessMax property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### rasterSaturation +### rasterSaturation Name: `rasterSaturation` -#### Description +### Description Increase or reduce the saturation of the image. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Minimum +### Minimum `-1` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `rasterSaturationTransition` -#### Description +### Description -The transition affecting any changes to this layer’s rasterSaturation propery. +The transition affecting any changes to this layer’s rasterSaturation property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### rasterContrast +### rasterContrast Name: `rasterContrast` -#### Description +### Description Increase or reduce the contrast of the image. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Minimum +### Minimum `-1` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `rasterContrastTransition` -#### Description +### Description -The transition affecting any changes to this layer’s rasterContrast propery. +The transition affecting any changes to this layer’s rasterContrast property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### rasterResampling +### rasterResampling Name: `rasterResampling` -#### Description +### Description The resampling/interpolation method to use for overscaling, also known as texture magnification filter -#### Type +### Type `enum` -#### Default Value +### Default Value `linear` -#### Supported Values +### Supported Values **linear** - (Bi)linear filtering interpolates pixel values using the weighted average of the four closest original source pixels creating a smooth but blurry look when overscaled
**nearest** - Nearest neighbor filtering interpolates pixel values using the nearest original source pixel creating a sharp but pixelated look when overscaled
-#### Expression +### Expression Parameters: `zoom` ___ -#### rasterFadeDuration +### rasterFadeDuration Name: `rasterFadeDuration` -#### Description +### Description Fade duration when a new tile is added. -#### Type +### Type `number` -#### Default Value +### Default Value `300` -#### Units +### Units `milliseconds` -#### Minimum +### Minimum `0` -#### Expression +### Expression Parameters: `zoom` diff --git a/docs/RasterSource.md b/docs/RasterSource.md index ba8073ebc..8c99b5bc8 100644 --- a/docs/RasterSource.md +++ b/docs/RasterSource.md @@ -1,8 +1,10 @@ -## -### RasterSource is a map content source that supplies raster image tiles to be shown on the map.
The location of and metadata about the tiles are defined either by an option dictionary
or by an external file that conforms to the TileJSON specification. +# +RasterSource is a map content source that supplies raster image tiles to be shown on the map. +The location of and metadata about the tiles are defined either by an option dictionary +or by an external file that conforms to the TileJSON specification. -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | id | `string` | `MapboxGL.StyleSource.DefaultSourceID` | `false` | A string that uniquely identifies the source. | diff --git a/docs/ShapeSource.md b/docs/ShapeSource.md index b0789126c..b06ef4209 100644 --- a/docs/ShapeSource.md +++ b/docs/ShapeSource.md @@ -1,13 +1,14 @@ -## -### ShapeSource is a map content source that supplies vector shapes to be shown on the map.
The shape may be a url or a GeoJSON object +# +ShapeSource is a map content source that supplies vector shapes to be shown on the map. +The shape may be an url or a GeoJSON object -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | id | `string` | `MapboxGL.StyleSource.DefaultSourceID` | `false` | A string that uniquely identifies the source. | | url | `string` | `none` | `false` | An HTTP(S) URL, absolute file URL, or local file URL relative to the current application’s resource bundle. | -| shape | `object` | `none` | `false` | The contents of the source. A shape can represent a GeoJSON geometry, a feature, or a feature colllection. | +| shape | `object` | `none` | `false` | The contents of the source. A shape can represent a GeoJSON geometry, a feature, or a feature collection. | | cluster | `bool` | `none` | `false` | Enables clustering on the source for point shapes. | | clusterRadius | `number` | `none` | `false` | Specifies the radius of each cluster if clustering is enabled.
A value of 512 produces a radius equal to the width of a tile.
The default value is 50. | | clusterMaxZoomLevel | `number` | `none` | `false` | Specifies the maximum zoom level at which to cluster points if clustering is enabled.
Defaults to one zoom level less than the value of maxZoomLevel so that, at the maximum zoom level,
the shapes are not clustered. | @@ -21,12 +22,12 @@ |   width | `number` | `none` | `true` | `width` of hitbox | |   height | `number` | `none` | `true` | `height` of hitbox | -### methods -#### features([filter]) +## methods +### features([filter]) -Returns all features from the source that match the query parameters regardless of whether or not the feature is
currently rendered on the map. +Returns all features from the source that match the query parameters whether the feature is currently
rendered on the map. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `filter` | `Array` | `No` | an optional filter statement to filter the returned Features. | @@ -38,11 +39,11 @@ shapeSource.features() ``` -#### getClusterExpansionZoom(feature) +### getClusterExpansionZoom(feature) Returns the zoom needed to expand the cluster. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `feature` | `Feature` | `Yes` | The feature cluster to expand. | @@ -54,11 +55,11 @@ const zoom = await shapeSource.getClusterExpansionZoom(clusterId); ``` -#### getClusterLeaves(feature, limit, offset) +### getClusterLeaves(feature, limit, offset) Returns the FeatureCollection from the cluster. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `feature` | `Feature` | `Yes` | The feature cluster to expand. | @@ -72,11 +73,11 @@ const collection = await shapeSource.getClusterLeaves(clusterId, limit, offset); ``` -#### getClusterChildren(feature) +### getClusterChildren(feature) Returns the FeatureCollection from the cluster (on the next zoom level). -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `feature` | `Feature` | `Yes` | The feature cluster to expand. | @@ -88,11 +89,11 @@ const collection = await shapeSource.getClusterChildren(clusterId); ``` -#### onPress(event) +### onPress(event) -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `event` | `n/a` | `Yes` | undefined | diff --git a/docs/SkyLayer.md b/docs/SkyLayer.md index fd4e289a1..fbb197c1b 100644 --- a/docs/SkyLayer.md +++ b/docs/SkyLayer.md @@ -1,8 +1,8 @@ -## -### SkyLayer is a spherical dome around the map that is always rendered behind all other layers +# +SkyLayer is a spherical dome around the map that is always rendered behind all other layers -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | id | `string` | `none` | `true` | A string that uniquely identifies the source in the style to which it is added. | @@ -14,7 +14,7 @@ | style | `union` | `none` | `false` | Customizable style attributes | -### styles +## styles * visibility
* skyType
@@ -29,18 +29,18 @@ ___ -#### visibility +### visibility Name: `visibility` -#### Description +### Description Whether this layer is displayed. -#### Type +### Type `enum` -#### Default Value +### Default Value `visible` -#### Supported Values +### Supported Values **visible** - The layer is shown.
**none** - The layer is not shown.
@@ -48,212 +48,212 @@ Whether this layer is displayed. ___ -#### skyType +### skyType Name: `skyType` -#### Description +### Description The type of the sky -#### Type +### Type `enum` -#### Default Value +### Default Value `atmosphere` -#### Supported Values +### Supported Values **gradient** - Renders the sky with a gradient that can be configured with `sky-gradient-radius` and `sky-gradient`.
**atmosphere** - Renders the sky with a simulated atmospheric scattering algorithm, the sun direction can be attached to the light position or explicitly set through `sky-atmosphere-sun`.
-#### Expression +### Expression Parameters: `zoom` ___ -#### skyAtmosphereSun +### skyAtmosphereSun Name: `skyAtmosphereSun` -#### Description +### Description Position of the sun center [a azimuthal angle, p polar angle]. The azimuthal angle indicates the position of the sun relative to 0° north, where degrees proceed clockwise. The polar angle indicates the height of the sun, where 0° is directly above, at zenith, and 90° at the horizon. When this property is ommitted, the sun center is directly inherited from the light position. -#### Type +### Type `array` -#### Units +### Units `degrees` -#### Minimum +### Minimum `0,0` -#### Maximum +### Maximum `360,180` -#### Expression +### Expression Parameters: `zoom` ___ -#### skyAtmosphereSunIntensity +### skyAtmosphereSunIntensity Name: `skyAtmosphereSunIntensity` -#### Description +### Description Intensity of the sun as a light source in the atmosphere (on a scale from 0 to a 100). Setting higher values will brighten up the sky. -#### Type +### Type `number` -#### Default Value +### Default Value `10` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `100` ___ -#### skyGradientCenter +### skyGradientCenter Name: `skyGradientCenter` -#### Description +### Description Position of the gradient center [a azimuthal angle, p polar angle]. The azimuthal angle indicates the position of the gradient center relative to 0° north, where degrees proceed clockwise. The polar angle indicates the height of the gradient center, where 0° is directly above, at zenith, and 90° at the horizon. -#### Type +### Type `array` -#### Default Value +### Default Value `[0,0]` -#### Units +### Units `degrees` -#### Minimum +### Minimum `0,0` -#### Maximum +### Maximum `360,180` -#### Expression +### Expression Parameters: `zoom` ___ -#### skyGradientRadius +### skyGradientRadius Name: `skyGradientRadius` -#### Description +### Description The angular distance (measured in degrees) from `skyGradientCenter` up to which the gradient extends. A value of 180 causes the gradient to wrap around to the opposite direction from `skyGradientCenter`. -#### Type +### Type `number` -#### Default Value +### Default Value `90` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `180` -#### Expression +### Expression Parameters: `zoom` ___ -#### skyGradient +### skyGradient Name: `skyGradient` -#### Description +### Description Defines a radial color gradient with which to color the sky. The color values can be interpolated with an expression using `skyRadialProgress`. The range [0, 1] for the interpolant covers a radial distance (in degrees) of [0, `skyGradientRadius`] centered at the position specified by `skyGradientCenter`. -#### Type +### Type `color` -#### Default Value +### Default Value `interpolate,linear,sky-radial-progress,0.8,#87ceeb,1,white` -#### Expression +### Expression Parameters: `sky-radial-progress` ___ -#### skyAtmosphereHaloColor +### skyAtmosphereHaloColor Name: `skyAtmosphereHaloColor` -#### Description +### Description A color applied to the atmosphere sun halo. The alpha channel describes how strongly the sun halo is represented in an atmosphere sky layer. -#### Type +### Type `color` -#### Default Value +### Default Value `white` ___ -#### skyAtmosphereColor +### skyAtmosphereColor Name: `skyAtmosphereColor` -#### Description +### Description A color used to tweak the main atmospheric scattering coefficients. Using white applies the default coefficients giving the natural blue color to the atmosphere. This color affects how heavily the corresponding wavelength is represented during scattering. The alpha channel describes the density of the atmosphere, with 1 maximum density and 0 no density. -#### Type +### Type `color` -#### Default Value +### Default Value `white` ___ -#### skyOpacity +### skyOpacity Name: `skyOpacity` -#### Description +### Description The opacity of the entire sky layer. -#### Type +### Type `number` -#### Default Value +### Default Value `1` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `skyOpacityTransition` -#### Description +### Description -The transition affecting any changes to this layer’s skyOpacity propery. +The transition affecting any changes to this layer’s skyOpacity property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` diff --git a/docs/Style.md b/docs/Style.md index 2ca9452fe..3816b4b82 100644 --- a/docs/Style.md +++ b/docs/Style.md @@ -1,8 +1,10 @@ -## -### Style is a component that automatically adds sources / layers to the map using Mapbox GL Style Spec.
Only [`sources`](https://docs.mapbox.com/mapbox-gl-js/style-spec/sources) & [`layers`](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/) are supported.
Other fields such as `sprites`, `glyphs` etc. will be ignored. Not all layer / source attributes from the style spec are supported, in general the supported attributes will mentioned under https://github.com/rnmapbox/maps/tree/main/docs. +# +Style is a component that automatically adds sources / layers to the map using Mapbox GL Style Spec. +Only [`sources`](https://docs.mapbox.com/mapbox-gl-js/style-spec/sources) & [`layers`](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/) are supported. +Other fields such as `sprites`, `glyphs` etc. will be ignored. Not all layer / source attributes from the style spec are supported, in general the supported attributes will be mentioned under https://github.com/rnmapbox/maps/tree/main/docs. -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | json | `any` | `none` | `false` | A JSON object conforming to the schema described in the Mapbox Style Specification , or a URL to such JSON. | diff --git a/docs/StyleSheet.md b/docs/StyleSheet.md index 4d54c7609..71e7becf3 100644 --- a/docs/StyleSheet.md +++ b/docs/StyleSheet.md @@ -1,18 +1,18 @@ -## StyleSheet +# StyleSheet +StyleSheet is written as a JS object. +See [Mapbox expression specs](https://docs.mapbox.com/mapbox-gl-js/style-spec/#expressions) for reference on +expressions. -### Stylesheet is now a JS object, see [CHANGELOG.md](../CHANGELOG.md) for more details +## Style Functions -See (Mapbox expression specs)[https://docs.mapbox.com/mapbox-gl-js/style-spec/#expressions] for reference on expressions. +### Zoom based Expressions -### Style functions +This is a value function defining a style value that changes as the zoom level changes. The layout and paint attribute +properties of the layer can be set to style function objects. Use a camera function to create the illusion of depth and +control data density. -#### zoom based expressions (replaces camera(stops[, interpolationMode])) - -This is a value function defining a style value that changes as the zoom level changes. The layout and paint attribute properties of the layer can be set to style function objects. Use a camera function to create the illusion of depth and control data density. - -new: -```js +```typescript // color would change based on zoom level keys. [ 'interpolate', @@ -20,44 +20,22 @@ new: ['zoom'], 0, 'blue', 10, 'green', - 20, 'yellow' + 20, 'yellow', ]; // Example of use inside stylesheet { - fillColor: [ - 'step', - ['zoom'], - 'blue', - 20, 'green' - ] + fillColor: ['step', ['zoom'], 'blue', 20, 'green']; } ``` -old: -```js -// color would change based on zoom level keys. -MapboxGL.StyleSheet.camera({ - 0: 'blue', - 10: 'green', - 20: 'yellow', -}, MapboxGL.InterpolationMode.Exponential); +### Attribute based Expressions -// Example of use inside stylesheet -MapboxGL.StyleSheet.create({ - fillColor: MapboxGL.StyleSheet.camera({ - 15: 'blue', - 20: 'green', - }, MapboxGL.InterpolationMode.Interval), -}); -``` +This is a value function defining a style value that changes with its properties. The layout and paint attribute +properties of the layer can be set to style function objects. Use source functions to visually differentiate types of +features within the same layer or create data visualizations. -#### attribute based expressions (replaces source(stops, attributeName[, interpolationMode])) - -This is a value function defining a style value that changes with its properties. The layout and paint attribute properties of the layer can be set to style function objects. Use source functions to visually differentate types of features within the same layer or create data visualizations. - -new: -```js +```typescript // would color the layer based the property rating=[1, 5] [ 'step', @@ -79,126 +57,42 @@ new: 3, 'yellow', 4, 'yellowgreen', 5, 'green', - ], + ]; } ``` +### Nested Expressions -old: -```js -// would color the layer based the property rating=[1, 5] -MapboxGL.StyleSheet.source([ - [1, 'red'], - [2, 'orange'], - [3, 'yellow'], - [4, 'yellowgreen'], - [5, 'green'], -], 'rating', MapboxGL.InterpolationMode.Categorical); - -// Example of use inside stylesheet -MapboxGL.StyleSheet.create({ - circleColor: MapboxGL.StyleSheet.source([ - [1, 'red'], - [2, 'orange'], - [3, 'yellow'], - [4, 'yellowgreen'], - [5, 'green'], - ], 'rating', MapboxGL.InterpolationMode.Categorical), -}); -``` - -#### nested expressions (replaces composite(stops, attributeName[, interpolationMode])) - -This is a value function defining a style value that changes with the feature attributes at each map zoom level. The layout and paint attribute properties of the layer can be set to style function objects. Use composite functions to allow the appearance of a map feature to change with both its attributes and the map zoom level. Note that support for composite functions is not yet complete in the Android/iOS SDK's. +This is a value function defining a style value that changes with the feature attributes at each map zoom level. The +layout and paint attribute properties of the layer can be set to style function objects. Use composite functions to +allow the appearance of a map feature to change with both its attributes and the map zoom level. Note that support for +composite functions is not yet complete in the Android/iOS SDK's. -new: -```js +```typescript // would change based on the zoom level and rating value // {zoom_level}: [{value}, {style_value}] [ 'step', ['zoom'], - [ - 'step', - ['get','rating'], - 0, - 5, 5 - ], - 20, [ - 'step', - ['get','rating'], - 0, - 5, 20 - ] -] + ['step', ['get', 'rating'], 0, 5, 5], + 20, + ['step', ['get', 'rating'], 0, 5, 20], +]; { circleRadius: [ 'step', ['zoom'], - [ 'step', - ['get','rating'], - 0, - 5, 5 - ], - 20, [ 'step', - ['get','rating'], - 0, - 5, 20 - ], -] -}; -``` - - -old: -```js -// would change based on the zoom level and rating value -// {zoom_level}: [{value}, {style_value}] -MapboxGL.StyleSheet.composite({ - 0: [0, 0], - 0: [5, 5], - 20: [0, 0], - 20: [5, 20], -}, 'rating', MapboxGL.InterpolationMode.Interval); - -MapboxGL.StyleSheet.create({ - circleRadius: MapboxGL.StyleSheet.composite({ - 0: [0, 0], - 0: [5, 5], - 20: [0, 0], - 20: [5, 20], - }, 'rating', MapboxGL.InterpolationMode.Interval), -}); -``` - -### Simple expressions - -#### ['get', attributeName] - replaces identity(attributeName) - -This is just a source style function under the hood. For example say if you had a feature property with an attribute height. Identity means that it will just equal the attribute value, so there is no need to provide any stops - -new: -```js -{ - fillExtrusionHeight: ['get', 'height'], + ['step', ['get', 'rating'], 0, 5, 5], + 20, + ['step', ['get', 'rating'], 0, 5, 20], + ]; } ``` -old: - -```js -MapboxGL.StyleSheet.create({ - fillExtrusionHeight: MapboxGL.StyleSheet.identity('height'), -}); -``` - -### StyleSheet Examples - +## StyleSheet Examples -#### new: - -```js +```tsx const styles = { buildings: { fillColor: 'blue', @@ -208,13 +102,19 @@ const styles = { } }; -... +// ... - - + +< MapboxGL.FillLayer + style={styles.street} + // ... +/> ``` -```js +```tsx const layerStyles = { singlePoint: { circleColor: 'green', @@ -228,7 +128,7 @@ const layerStyles = { circleColor: [ 'interpolate', ['exponential', 1.5], - ['get','point_count'], + ['get', 'point_count'], 25, 'yellow', 50, 'red', 75, 'blue', @@ -240,7 +140,7 @@ const layerStyles = { circleRadius: [ 'interpolate', ['exponential', 1.5], - ['get','point_count'], + ['get', 'point_count'], [0, 15], [100, 20], [750, 30], @@ -255,28 +155,35 @@ const layerStyles = { textField: ['get', 'point_count'], textSize: 12, }, -}); +}; -... +// ... + style={layerStyles.clusterCount} +/> - + filter={['has', 'point_count' + ] + } + style={layerStyles.clusteredPoints} +/> - + filter={['!has', 'point_count' + ] + } + style={layerStyles.singlePoint} +/> ``` -```javascript -const layerStyles = MapboxGL.StyleSheet.create({ +```tsx +const layerStyles = { building: { fillExtrusionOpacity: 1, fillExtrusionHeight: ['get', 'height'], @@ -288,9 +195,8 @@ const layerStyles = MapboxGL.StyleSheet.create({ [0, 'white'], [50, 'blue'], [100, 'red'], - ], - }, - fillExtrusionColorTransition: { duration: 2000, delay: 0 }, + ], + fillExtrusionColorTransition: {duration: 2000, delay: 0}, }, streets: { lineColor: 'blue', @@ -298,133 +204,23 @@ const layerStyles = MapboxGL.StyleSheet.create({ lineOpacity: 0.50, lineJoin: MapboxGL.LineJoin.Round, lineCap: MapboxGL.LineCap.Round, - lineDasharray: [2, 2], - }, -}); - -... - - - - -``` - -#### old: - -```js -const styles = MapboxGL.StyleSheet.create({ - buildings: { - fillColor: 'blue', - }, - street: { - lineColor: 'green', + lineDasharray: [2, 2] } -}); - -... - - - -``` - -```js -const layerStyles = MapboxGL.StyleSheet.create({ - singlePoint: { - circleColor: 'green', - circleOpacity: 0.84, - circleStrokeWidth: 2, - circleStrokeColor: 'white', - circleRadius: 5, - }, - - clusteredPoints: { - circleColor: MapboxGL.StyleSheet.source([ - [25, 'yellow'], - [50, 'red'], - [75, 'blue'], - [100, 'orange'], - [300, 'pink'], - [750, 'white'], - ], 'point_count', MapboxGL.InterpolationMode.Exponential), - - circleRadius: MapboxGL.StyleSheet.source([ - [0, 15], - [100, 20], - [750, 30], - ], 'point_count', MapboxGL.InterpolationMode.Exponential), - - circleOpacity: 0.84, - circleStrokeWidth: 2, - circleStrokeColor: 'white', - }, - - clusterCount: { - textField: '{point_count}', - textSize: 12, - }, -}); - -... - - - - - - -``` - -```javascript -const layerStyles = MapboxGL.StyleSheet.create({ - building: { - fillExtrusionOpacity: 1, - fillExtrusionHeight: MapboxGL.StyleSheet.identity('height'), - fillExtrusionBase: MapboxGL.StyleSheet.identity('min_height'), - fillExtrusionColor: MapboxGL.StyleSheet.source([ - [0, 'white'], - [50, 'blue'], - [100, 'red'], - ], 'height', MapboxGL.InterpolationMode.Exponential), - fillExtrusionColorTransition: { duration: 2000, delay: 0 }, - }, - streets: { - lineColor: 'blue', - lineWidth: 2, - lineOpacity: 0.50, - lineJoin: MapboxGL.LineJoin.Round, - lineCap: MapboxGL.LineCap.Round, - lineDasharray: [2, 2], - }, -}); +}; -... +// ... + style={layerStyles.building} +/> - + style={layerStyles.streets} +/> ``` - diff --git a/docs/SymbolLayer.md b/docs/SymbolLayer.md index 9bbe91d82..c81162675 100644 --- a/docs/SymbolLayer.md +++ b/docs/SymbolLayer.md @@ -1,8 +1,8 @@ -## -### SymbolLayer is a style layer that renders icon and text labels at points or along lines on the map. +# +SymbolLayer is a style layer that renders icon and text labels at points or along lines on the map. -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | id | `string` | `none` | `true` | A string that uniquely identifies the source in the style to which it is added. | @@ -17,7 +17,7 @@ | style | `union` | `none` | `false` | Customizable style attributes | -### styles +## styles * symbolPlacement
* symbolSpacing
@@ -78,398 +78,398 @@ ___ -#### symbolPlacement +### symbolPlacement Name: `symbolPlacement` -#### Description +### Description Label placement relative to its geometry. -#### Type +### Type `enum` -#### Default Value +### Default Value `point` -#### Supported Values +### Supported Values **point** - The label is placed at the point where the geometry is located.
**line** - The label is placed along the line of the geometry. Can only be used on `LineString` and `Polygon` geometries.
**line-center** - The label is placed at the center of the line of the geometry. Can only be used on `LineString` and `Polygon` geometries. Note that a single feature in a vector tile may contain multiple line geometries.
-#### Expression +### Expression Parameters: `zoom` ___ -#### symbolSpacing +### symbolSpacing Name: `symbolSpacing` -#### Description +### Description Distance between two symbol anchors. -#### Type +### Type `number` -#### Default Value +### Default Value `250` -#### Units +### Units `pixels` -#### Minimum +### Minimum `1` -#### Expression +### Expression Parameters: `zoom` ___ -#### symbolAvoidEdges +### symbolAvoidEdges Name: `symbolAvoidEdges` -#### Description +### Description If true, the symbols will not cross tile edges to avoid mutual collisions. Recommended in layers that don't have enough padding in the vector tile to prevent collisions, or if it is a point symbol layer placed after a line symbol layer. When using a client that supports global collision detection, like Mapbox GL JS version 0.42.0 or greater, enabling this property is not needed to prevent clipped labels at tile boundaries. -#### Type +### Type `boolean` -#### Default Value +### Default Value `false` -#### Expression +### Expression Parameters: `zoom` ___ -#### symbolSortKey +### symbolSortKey Name: `symbolSortKey` -#### Description +### Description Sorts features in ascending order based on this value. Features with lower sort keys are drawn and placed first. When `iconAllowOverlap` or `textAllowOverlap` is `false`, features with a lower sort key will have priority during placement. When `iconAllowOverlap` or `textAllowOverlap` is set to `true`, features with a higher sort key will overlap over features with a lower sort key. -#### Type +### Type `number` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### symbolZOrder +### symbolZOrder Name: `symbolZOrder` -#### Description +### Description Determines whether overlapping symbols in the same layer are rendered in the order that they appear in the data source or by their yPosition relative to the viewport. To control the order and prioritization of symbols otherwise, use `symbolSortKey`. -#### Type +### Type `enum` -#### Default Value +### Default Value `auto` -#### Supported Values +### Supported Values **auto** - Sorts symbols by `symbol-sort-key` if set. Otherwise, sorts symbols by their y-position relative to the viewport if `icon-allow-overlap` or `text-allow-overlap` is set to `true` or `icon-ignore-placement` or `text-ignore-placement` is `false`.
**viewport-y** - Sorts symbols by their y-position relative to the viewport if `icon-allow-overlap` or `text-allow-overlap` is set to `true` or `icon-ignore-placement` or `text-ignore-placement` is `false`.
**source** - Sorts symbols by `symbol-sort-key` if set. Otherwise, no sorting is applied; symbols are rendered in the same order as the source data.
-#### Expression +### Expression Parameters: `zoom` ___ -#### iconAllowOverlap +### iconAllowOverlap Name: `iconAllowOverlap` -#### Description +### Description If true, the icon will be visible even if it collides with other previously drawn symbols. -#### Type +### Type `boolean` -#### Default Value +### Default Value `false` -#### Requires +### Requires `iconImage` -#### Expression +### Expression Parameters: `zoom` ___ -#### iconIgnorePlacement +### iconIgnorePlacement Name: `iconIgnorePlacement` -#### Description +### Description If true, other symbols can be visible even if they collide with the icon. -#### Type +### Type `boolean` -#### Default Value +### Default Value `false` -#### Requires +### Requires `iconImage` -#### Expression +### Expression Parameters: `zoom` ___ -#### iconOptional +### iconOptional Name: `iconOptional` -#### Description +### Description If true, text will display without their corresponding icons when the icon collides with other symbols and the text does not. -#### Type +### Type `boolean` -#### Default Value +### Default Value `false` -#### Requires +### Requires `iconImage, textField` -#### Expression +### Expression Parameters: `zoom` ___ -#### iconRotationAlignment +### iconRotationAlignment Name: `iconRotationAlignment` -#### Description +### Description In combination with `symbolPlacement`, determines the rotation behavior of icons. -#### Type +### Type `enum` -#### Default Value +### Default Value `auto` -#### Supported Values +### Supported Values **map** - When `symbol-placement` is set to `point`, aligns icons east-west. When `symbol-placement` is set to `line` or `line-center`, aligns icon x-axes with the line.
**viewport** - Produces icons whose x-axes are aligned with the x-axis of the viewport, regardless of the value of `symbol-placement`.
**auto** - When `symbol-placement` is set to `point`, this is equivalent to `viewport`. When `symbol-placement` is set to `line` or `line-center`, this is equivalent to `map`.
-#### Requires +### Requires `iconImage` -#### Expression +### Expression Parameters: `zoom` ___ -#### iconSize +### iconSize Name: `iconSize` -#### Description +### Description Scales the original size of the icon by the provided factor. The new pixel size of the image will be the original pixel size multiplied by `iconSize`. 1 is the original size; 3 triples the size of the image. -#### Type +### Type `number` -#### Default Value +### Default Value `1` -#### Units +### Units `factor of the original icon size` -#### Minimum +### Minimum `0` -#### Requires +### Requires `iconImage` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### iconTextFit +### iconTextFit Name: `iconTextFit` -#### Description +### Description Scales the icon to fit around the associated text. -#### Type +### Type `enum` -#### Default Value +### Default Value `none` -#### Supported Values +### Supported Values **none** - The icon is displayed at its intrinsic aspect ratio.
**width** - The icon is scaled in the x-dimension to fit the width of the text.
**height** - The icon is scaled in the y-dimension to fit the height of the text.
**both** - The icon is scaled in both x- and y-dimensions.
-#### Requires +### Requires `iconImage, textField` -#### Expression +### Expression Parameters: `zoom` ___ -#### iconTextFitPadding +### iconTextFitPadding Name: `iconTextFitPadding` -#### Description +### Description Size of the additional area added to dimensions determined by `iconTextFit`, in clockwise order: top, right, bottom, left. -#### Type +### Type `array` -#### Default Value +### Default Value `[0,0,0,0]` -#### Units +### Units `pixels` -#### Requires +### Requires `iconImage, textField` -#### Expression +### Expression Parameters: `zoom` ___ -#### iconImage +### iconImage Name: `iconImage` -#### Description +### Description Name of image in sprite to use for drawing an image background. -#### Type +### Type `resolvedImage` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### iconRotate +### iconRotate Name: `iconRotate` -#### Description +### Description Rotates the icon clockwise. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Units +### Units `degrees` -#### Requires +### Requires `iconImage` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### iconPadding +### iconPadding Name: `iconPadding` -#### Description +### Description Size of the additional area around the icon bounding box used for detecting symbol collisions. -#### Type +### Type `number` -#### Default Value +### Default Value `2` -#### Units +### Units `pixels` -#### Minimum +### Minimum `0` -#### Requires +### Requires `iconImage` -#### Expression +### Expression Parameters: `zoom` ___ -#### iconKeepUpright +### iconKeepUpright Name: `iconKeepUpright` -#### Description +### Description If true, the icon may be flipped to prevent it from being rendered upsideDown. -#### Type +### Type `boolean` -#### Default Value +### Default Value `false` -#### Requires +### Requires `iconImage` -#### Expression +### Expression Parameters: `zoom` ___ -#### iconOffset +### iconOffset Name: `iconOffset` -#### Description +### Description Offset distance of icon from its anchor. Positive values indicate right and down, while negative values indicate left and up. Each component is multiplied by the value of `iconSize` to obtain the final offset in pixels. When combined with `iconRotate` the offset will be as if the rotated direction was up. -#### Type +### Type `array` -#### Default Value +### Default Value `[0,0]` -#### Requires +### Requires `iconImage` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### iconAnchor +### iconAnchor Name: `iconAnchor` -#### Description +### Description Part of the icon placed closest to the anchor. -#### Type +### Type `enum` -#### Default Value +### Default Value `center` -#### Supported Values +### Supported Values **center** - The center of the icon is placed closest to the anchor.
**left** - The left side of the icon is placed closest to the anchor.
**right** - The right side of the icon is placed closest to the anchor.
@@ -481,324 +481,324 @@ Part of the icon placed closest to the anchor. **bottom-right** - The bottom right corner of the icon is placed closest to the anchor.
-#### Requires +### Requires `iconImage` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### iconPitchAlignment +### iconPitchAlignment Name: `iconPitchAlignment` -#### Description +### Description Orientation of icon when map is pitched. -#### Type +### Type `enum` -#### Default Value +### Default Value `auto` -#### Supported Values +### Supported Values **map** - The icon is aligned to the plane of the map.
**viewport** - The icon is aligned to the plane of the viewport.
**auto** - Automatically matches the value of `icon-rotation-alignment`.
-#### Requires +### Requires `iconImage` -#### Expression +### Expression Parameters: `zoom` ___ -#### textPitchAlignment +### textPitchAlignment Name: `textPitchAlignment` -#### Description +### Description Orientation of text when map is pitched. -#### Type +### Type `enum` -#### Default Value +### Default Value `auto` -#### Supported Values +### Supported Values **map** - The text is aligned to the plane of the map.
**viewport** - The text is aligned to the plane of the viewport.
**auto** - Automatically matches the value of `text-rotation-alignment`.
-#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom` ___ -#### textRotationAlignment +### textRotationAlignment Name: `textRotationAlignment` -#### Description +### Description In combination with `symbolPlacement`, determines the rotation behavior of the individual glyphs forming the text. -#### Type +### Type `enum` -#### Default Value +### Default Value `auto` -#### Supported Values +### Supported Values **map** - When `symbol-placement` is set to `point`, aligns text east-west. When `symbol-placement` is set to `line` or `line-center`, aligns text x-axes with the line.
**viewport** - Produces glyphs whose x-axes are aligned with the x-axis of the viewport, regardless of the value of `symbol-placement`.
**auto** - When `symbol-placement` is set to `point`, this is equivalent to `viewport`. When `symbol-placement` is set to `line` or `line-center`, this is equivalent to `map`.
-#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom` ___ -#### textField +### textField Name: `textField` -#### Description +### Description Value to use for a text label. If a plain `string` is provided, it will be treated as a `formatted` with default/inherited formatting options. SDF images are not supported in formatted text and will be ignored. -#### Type +### Type `formatted` -#### Default Value +### Default Value `` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### textFont +### textFont Name: `textFont` -#### Description +### Description Font stack to use for displaying text. -#### Type +### Type `array` -#### Default Value +### Default Value `[Open Sans Regular,Arial Unicode MS Regular]` -#### Requires +### Requires `textField` -#### Supported Style Functions +### Supported Style Functions `camera` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### textSize +### textSize Name: `textSize` -#### Description +### Description Font size. -#### Type +### Type `number` -#### Default Value +### Default Value `16` -#### Units +### Units `pixels` -#### Minimum +### Minimum `0` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### textMaxWidth +### textMaxWidth Name: `textMaxWidth` -#### Description +### Description The maximum line width for text wrapping. -#### Type +### Type `number` -#### Default Value +### Default Value `10` -#### Units +### Units `ems` -#### Minimum +### Minimum `0` -#### Requires +### Requires `textField` -#### Supported Style Functions +### Supported Style Functions `camera` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### textLineHeight +### textLineHeight Name: `textLineHeight` -#### Description +### Description Text leading value for multiLine text. -#### Type +### Type `number` -#### Default Value +### Default Value `1.2` -#### Units +### Units `ems` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### textLetterSpacing +### textLetterSpacing Name: `textLetterSpacing` -#### Description +### Description Text tracking amount. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Units +### Units `ems` -#### Requires +### Requires `textField` -#### Supported Style Functions +### Supported Style Functions `camera` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### textJustify +### textJustify Name: `textJustify` -#### Description +### Description Text justification options. -#### Type +### Type `enum` -#### Default Value +### Default Value `center` -#### Supported Values +### Supported Values **auto** - The text is aligned towards the anchor position.
**left** - The text is aligned to the left.
**center** - The text is centered.
**right** - The text is aligned to the right.
-#### Requires +### Requires `textField` -#### Supported Style Functions +### Supported Style Functions `camera` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### textRadialOffset +### textRadialOffset Name: `textRadialOffset` -#### Description +### Description Radial offset of text, in the direction of the symbol's anchor. Useful in combination with `textVariableAnchor`, which defaults to using the twoDimensional `textOffset` if present. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Units +### Units `ems` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### textVariableAnchor +### textVariableAnchor Name: `textVariableAnchor` -#### Description +### Description To increase the chance of placing highPriority labels on the map, you can provide an array of `textAnchor` locations: the renderer will attempt to place the label at each location, in order, before moving onto the next label. Use `textJustify: auto` to choose justification based on anchor position. To apply an offset, use the `textRadialOffset` or the twoDimensional `textOffset`. -#### Type +### Type `array` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom` ___ -#### textAnchor +### textAnchor Name: `textAnchor` -#### Description +### Description Part of the text placed closest to the anchor. -#### Type +### Type `enum` -#### Default Value +### Default Value `center` -#### Supported Values +### Supported Values **center** - The center of the text is placed closest to the anchor.
**left** - The left side of the text is placed closest to the anchor.
**right** - The right side of the text is placed closest to the anchor.
@@ -810,263 +810,263 @@ Part of the text placed closest to the anchor. **bottom-right** - The bottom right corner of the text is placed closest to the anchor.
-#### Requires +### Requires `textField` -#### Disabled By +### Disabled By `textVariableAnchor` -#### Supported Style Functions +### Supported Style Functions `camera` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### textMaxAngle +### textMaxAngle Name: `textMaxAngle` -#### Description +### Description Maximum angle change between adjacent characters. -#### Type +### Type `number` -#### Default Value +### Default Value `45` -#### Units +### Units `degrees` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom` ___ -#### textWritingMode +### textWritingMode Name: `textWritingMode` -#### Description +### Description The property allows control over a symbol's orientation. Note that the property values act as a hint, so that a symbol whose language doesn’t support the provided orientation will be laid out in its natural orientation. Example: English point symbol will be rendered horizontally even if array value contains single 'vertical' enum value. For symbol with point placement, the order of elements in an array define priority order for the placement of an orientation variant. For symbol with line placement, the default text writing mode is either ['horizontal', 'vertical'] or ['vertical', 'horizontal'], the order doesn't affect the placement. -#### Type +### Type `array` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom` ___ -#### textRotate +### textRotate Name: `textRotate` -#### Description +### Description Rotates the text clockwise. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Units +### Units `degrees` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### textPadding +### textPadding Name: `textPadding` -#### Description +### Description Size of the additional area around the text bounding box used for detecting symbol collisions. -#### Type +### Type `number` -#### Default Value +### Default Value `2` -#### Units +### Units `pixels` -#### Minimum +### Minimum `0` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom` ___ -#### textKeepUpright +### textKeepUpright Name: `textKeepUpright` -#### Description +### Description If true, the text may be flipped vertically to prevent it from being rendered upsideDown. -#### Type +### Type `boolean` -#### Default Value +### Default Value `true` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom` ___ -#### textTransform +### textTransform Name: `textTransform` -#### Description +### Description Specifies how to capitalize text, similar to the CSS `textTransform` property. -#### Type +### Type `enum` -#### Default Value +### Default Value `none` -#### Supported Values +### Supported Values **none** - The text is not altered.
**uppercase** - Forces all letters to be displayed in uppercase.
**lowercase** - Forces all letters to be displayed in lowercase.
-#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### textOffset +### textOffset Name: `textOffset` -#### Description +### Description Offset distance of text from its anchor. Positive values indicate right and down, while negative values indicate left and up. If used with textVariableAnchor, input values will be taken as absolute values. Offsets along the x and yAxis will be applied automatically based on the anchor position. -#### Type +### Type `array` -#### Default Value +### Default Value `[0,0]` -#### Units +### Units `ems` -#### Requires +### Requires `textField` -#### Disabled By +### Disabled By `textRadialOffset` -#### Expression +### Expression Parameters: `zoom, feature` ___ -#### textAllowOverlap +### textAllowOverlap Name: `textAllowOverlap` -#### Description +### Description If true, the text will be visible even if it collides with other previously drawn symbols. -#### Type +### Type `boolean` -#### Default Value +### Default Value `false` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom` ___ -#### textIgnorePlacement +### textIgnorePlacement Name: `textIgnorePlacement` -#### Description +### Description If true, other symbols can be visible even if they collide with the text. -#### Type +### Type `boolean` -#### Default Value +### Default Value `false` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom` ___ -#### textOptional +### textOptional Name: `textOptional` -#### Description +### Description If true, icons will display without their corresponding text when the text collides with other symbols and the icon does not. -#### Type +### Type `boolean` -#### Default Value +### Default Value `false` -#### Requires +### Requires `textField, iconImage` -#### Expression +### Expression Parameters: `zoom` ___ -#### visibility +### visibility Name: `visibility` -#### Description +### Description Whether this layer is displayed. -#### Type +### Type `enum` -#### Default Value +### Default Value `visible` -#### Supported Values +### Supported Values **visible** - The layer is shown.
**none** - The layer is not shown.
@@ -1074,585 +1074,585 @@ Whether this layer is displayed. ___ -#### iconOpacity +### iconOpacity Name: `iconOpacity` -#### Description +### Description The opacity at which the icon will be drawn. -#### Type +### Type `number` -#### Default Value +### Default Value `1` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Requires +### Requires `iconImage` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `iconOpacityTransition` -#### Description +### Description -The transition affecting any changes to this layer’s iconOpacity propery. +The transition affecting any changes to this layer’s iconOpacity property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### iconColor +### iconColor Name: `iconColor` -#### Description +### Description The color of the icon. This can only be used with [SDF icons](/help/troubleshooting/usingRecolorableImagesInMapboxMaps/). -#### Type +### Type `color` -#### Default Value +### Default Value `#000000` -#### Requires +### Requires `iconImage` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `iconColorTransition` -#### Description +### Description -The transition affecting any changes to this layer’s iconColor propery. +The transition affecting any changes to this layer’s iconColor property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### iconHaloColor +### iconHaloColor Name: `iconHaloColor` -#### Description +### Description The color of the icon's halo. Icon halos can only be used with [SDF icons](/help/troubleshooting/usingRecolorableImagesInMapboxMaps/). -#### Type +### Type `color` -#### Default Value +### Default Value `rgba(0, 0, 0, 0)` -#### Requires +### Requires `iconImage` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `iconHaloColorTransition` -#### Description +### Description -The transition affecting any changes to this layer’s iconHaloColor propery. +The transition affecting any changes to this layer’s iconHaloColor property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### iconHaloWidth +### iconHaloWidth Name: `iconHaloWidth` -#### Description +### Description Distance of halo to the icon outline. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Units +### Units `pixels` -#### Minimum +### Minimum `0` -#### Requires +### Requires `iconImage` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `iconHaloWidthTransition` -#### Description +### Description -The transition affecting any changes to this layer’s iconHaloWidth propery. +The transition affecting any changes to this layer’s iconHaloWidth property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### iconHaloBlur +### iconHaloBlur Name: `iconHaloBlur` -#### Description +### Description Fade out the halo towards the outside. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Units +### Units `pixels` -#### Minimum +### Minimum `0` -#### Requires +### Requires `iconImage` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `iconHaloBlurTransition` -#### Description +### Description -The transition affecting any changes to this layer’s iconHaloBlur propery. +The transition affecting any changes to this layer’s iconHaloBlur property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### iconTranslate +### iconTranslate Name: `iconTranslate` -#### Description +### Description Distance that the icon's anchor is moved from its original placement. Positive values indicate right and down, while negative values indicate left and up. -#### Type +### Type `array` -#### Default Value +### Default Value `[0,0]` -#### Units +### Units `pixels` -#### Requires +### Requires `iconImage` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `iconTranslateTransition` -#### Description +### Description -The transition affecting any changes to this layer’s iconTranslate propery. +The transition affecting any changes to this layer’s iconTranslate property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### iconTranslateAnchor +### iconTranslateAnchor Name: `iconTranslateAnchor` -#### Description +### Description Controls the frame of reference for `iconTranslate`. -#### Type +### Type `enum` -#### Default Value +### Default Value `map` -#### Supported Values +### Supported Values **map** - Icons are translated relative to the map.
**viewport** - Icons are translated relative to the viewport.
-#### Requires +### Requires `iconImage, iconTranslate` -#### Expression +### Expression Parameters: `zoom` ___ -#### textOpacity +### textOpacity Name: `textOpacity` -#### Description +### Description The opacity at which the text will be drawn. -#### Type +### Type `number` -#### Default Value +### Default Value `1` -#### Minimum +### Minimum `0` -#### Maximum +### Maximum `1` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `textOpacityTransition` -#### Description +### Description -The transition affecting any changes to this layer’s textOpacity propery. +The transition affecting any changes to this layer’s textOpacity property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### textColor +### textColor Name: `textColor` -#### Description +### Description The color with which the text will be drawn. -#### Type +### Type `color` -#### Default Value +### Default Value `#000000` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `textColorTransition` -#### Description +### Description -The transition affecting any changes to this layer’s textColor propery. +The transition affecting any changes to this layer’s textColor property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### textHaloColor +### textHaloColor Name: `textHaloColor` -#### Description +### Description The color of the text's halo, which helps it stand out from backgrounds. -#### Type +### Type `color` -#### Default Value +### Default Value `rgba(0, 0, 0, 0)` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `textHaloColorTransition` -#### Description +### Description -The transition affecting any changes to this layer’s textHaloColor propery. +The transition affecting any changes to this layer’s textHaloColor property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### textHaloWidth +### textHaloWidth Name: `textHaloWidth` -#### Description +### Description Distance of halo to the font outline. Max text halo width is 1/4 of the fontSize. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Units +### Units `pixels` -#### Minimum +### Minimum `0` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `textHaloWidthTransition` -#### Description +### Description -The transition affecting any changes to this layer’s textHaloWidth propery. +The transition affecting any changes to this layer’s textHaloWidth property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### textHaloBlur +### textHaloBlur Name: `textHaloBlur` -#### Description +### Description The halo's fadeout distance towards the outside. -#### Type +### Type `number` -#### Default Value +### Default Value `0` -#### Units +### Units `pixels` -#### Minimum +### Minimum `0` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom, feature, feature-state` ___ -#### Name +### Name `textHaloBlurTransition` -#### Description +### Description -The transition affecting any changes to this layer’s textHaloBlur propery. +The transition affecting any changes to this layer’s textHaloBlur property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### textTranslate +### textTranslate Name: `textTranslate` -#### Description +### Description Distance that the text's anchor is moved from its original placement. Positive values indicate right and down, while negative values indicate left and up. -#### Type +### Type `array` -#### Default Value +### Default Value `[0,0]` -#### Units +### Units `pixels` -#### Requires +### Requires `textField` -#### Expression +### Expression Parameters: `zoom` ___ -#### Name +### Name `textTranslateTransition` -#### Description +### Description -The transition affecting any changes to this layer’s textTranslate propery. +The transition affecting any changes to this layer’s textTranslate property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` ___ -#### textTranslateAnchor +### textTranslateAnchor Name: `textTranslateAnchor` -#### Description +### Description Controls the frame of reference for `textTranslate`. -#### Type +### Type `enum` -#### Default Value +### Default Value `map` -#### Supported Values +### Supported Values **map** - The text is translated relative to the map.
**viewport** - The text is translated relative to the viewport.
-#### Requires +### Requires `textField, textTranslate` -#### Expression +### Expression Parameters: `zoom` diff --git a/docs/Terrain.md b/docs/Terrain.md index 3f52717e6..a3cb6f77f 100644 --- a/docs/Terrain.md +++ b/docs/Terrain.md @@ -1,19 +1,19 @@ -## -### A global modifier that elevates layers and markers based on a DEM data source. +# +A global modifier that elevates layers and markers based on a DEM data source. -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | sourceID | `string` | `MapboxGL.StyleSource.DefaultSourceID` | `false` | Name of a source of raster_dem type to be used for terrain elevation. | | exaggeration | `union` | `none` | `false` | Optional number between 0 and 1000 inclusive. Defaults to 1. Supports interpolateexpressions. Transitionable.
Exaggerates the elevation of the terrain by multiplying the data from the DEM with this value. | -### methods -#### baseProps() +## methods +### baseProps() -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | diff --git a/docs/UserLocation.md b/docs/UserLocation.md index 84e837ae1..531304209 100644 --- a/docs/UserLocation.md +++ b/docs/UserLocation.md @@ -1,8 +1,8 @@ -## -### +# -### props + +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | animated | `bool` | `true` | `false` | Whether location icon is animated between updates | @@ -15,22 +15,22 @@ | minDisplacement | `number` | `0` | `false` | Minimum amount of movement before GPS location is updated in meters | | children | `any` | `none` | `false` | Custom location icon of type mapbox-gl-native components | -### methods -#### setLocationManager({ running }) +## methods +### setLocationManager({ running }) Whether to start or stop listening to the locationManager

Notice, that listening will start automatically when
either `onUpdate` or `visible` are set -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `{ running }` | `n/a` | `Yes` | undefined | -#### needsLocationManagerRunning() +### needsLocationManagerRunning() If locationManager should be running -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | diff --git a/docs/VectorSource.md b/docs/VectorSource.md index 83e528a2d..a1ccb1892 100644 --- a/docs/VectorSource.md +++ b/docs/VectorSource.md @@ -1,8 +1,9 @@ -## -### VectorSource is a map content source that supplies tiled vector data in Mapbox Vector Tile format to be shown on the map.
The location of and metadata about the tiles are defined either by an option dictionary or by an external file that conforms to the TileJSON specification. +# +VectorSource is a map content source that supplies tiled vector data in Mapbox Vector Tile format to be shown on the map. +The location of and metadata about the tiles are defined either by an option dictionary or by an external file that conforms to the TileJSON specification. -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | | id | `string` | `MapboxGL.StyleSource.DefaultSourceID` | `false` | A string that uniquely identifies the source. | @@ -17,12 +18,12 @@ |   width | `number` | `none` | `true` | `width` of hitbox | |   height | `number` | `none` | `true` | `height` of hitbox | -### methods -#### features([layerIDs][, filter]) +## methods +### features([layerIDs][, filter]) Returns all features that match the query parameters regardless of whether or not the feature is
currently rendered on the map. The domain of the query includes all currently-loaded vector tiles
and GeoJSON source tiles. This function does not check tiles outside of the visible viewport. -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `layerIDs` | `Array` | `No` | A set of strings that correspond to the names of layers defined in the current style. Only the features contained in these layers are included in the returned array. | @@ -35,11 +36,11 @@ vectorSource.features(['id1', 'id2']) ``` -#### onPress(event) +### onPress(event) -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `event` | `n/a` | `Yes` | undefined | diff --git a/docs/docs.json b/docs/docs.json index 678bbc9ca..0779f1c9e 100644 --- a/docs/docs.json +++ b/docs/docs.json @@ -331,7 +331,7 @@ "required": false, "type": "string", "default": "none", - "description": "String that get's displayed in the default callout." + "description": "String that gets displayed in the default callout." }, { "name": "style", @@ -376,7 +376,7 @@ "name": "Callout" }, "Camera": { - "description": "Controls the perspective from which the user sees the map.\n\nTo use imperative methods, pass in a ref object:\n\n```\nconst camera = useRef(null);\n\nuseEffect(() => {\n camera.current?.setCamera({\n centerCoordinate: [lon, lat],\n });\n}, []);\n\nreturn (\n \n);\n```", + "description": "Controls the perspective from which the user sees the map.\n\nTo use imperative methods, pass in a ref object:\n\n```tsx\nconst camera = useRef(null);\n\nuseEffect(() => {\n camera.current?.setCamera({\n centerCoordinate: [lon, lat],\n });\n}, []);\n\nreturn (\n \n);\n```", "displayName": "Camera", "methods": [], "props": [ @@ -1735,7 +1735,7 @@ "name": "ImageSource" }, "Images": { - "description": "Images defines the images used in Symbol etc layers", + "description": "Images defines the images used in Symbol etc. layers.", "displayName": "Images", "methods": [], "props": [ @@ -2402,7 +2402,7 @@ }, { "name": "getVisibleBounds", - "docblock": "The coordinate bounds(ne, sw) visible in the users’s viewport.\n\n@example\nconst visibleBounds = await this._map.getVisibleBounds();\n\n@return {Array}", + "docblock": "The coordinate bounds (ne, sw) visible in the user’s viewport.\n\n@example\nconst visibleBounds = await this._map.getVisibleBounds();\n\n@return {Array}", "modifiers": [ "async" ], @@ -2413,7 +2413,7 @@ "name": "Array" } }, - "description": "The coordinate bounds(ne, sw) visible in the users’s viewport.", + "description": "The coordinate bounds (ne, sw) visible in the user’s viewport.", "examples": [ "\nconst visibleBounds = await this._map.getVisibleBounds();\n\n" ] @@ -2684,7 +2684,7 @@ "required": false, "type": "number", "default": "none", - "description": "iOS: The preferred frame rate at which the map view is rendered.\nThe default value for this property is MGLMapViewPreferredFramesPerSecondDefault,\nwhich will adaptively set the preferred frame rate based on the capability of\nthe user’s device to maintain a smooth experience. This property can be set to arbitrary integer values.\n\nAndroid: The maximum frame rate at which the map view is rendered, but it can't excess the ability of device hardware.\nThis property can be set to arbitrary integer values." + "description": "iOS: The preferred frame rate at which the map view is rendered.\nThe default value for this property is MGLMapViewPreferredFramesPerSecondDefault,\nwhich will adaptively set the preferred frame rate based on the capability of\nthe user’s device to maintain a smooth experience. This property can be set to arbitrary integer values.\n\nAndroid: The maximum frame rate at which the map view is rendered, but it can't exceed the ability of device hardware.\nThis property can be set to arbitrary integer values." }, { "name": "localizeLabels", @@ -2810,7 +2810,7 @@ "required": false, "type": "bool", "default": "false", - "description": "[Android only] Enable/Disable use of GLSurfaceView insted of TextureView." + "description": "[Android only] Enable/Disable use of GLSurfaceView instead of TextureView." }, { "name": "onPress", @@ -3010,7 +3010,7 @@ "name": "MapView" }, "MarkerView": { - "description": "MarkerView allows you to place a interactive react native marker to the map.\n\nIf you have static view consider using PointAnnotation or SymbolLayer they'll offer much better performance\n.\nThis is based on [MakerView plugin](https://docs.mapbox.com/android/plugins/overview/markerview/) on Android\nand PointAnnotation on iOS.", + "description": "MarkerView allows you to place an interactive React Native marker to the map.\n\nIf you have static view consider using PointAnnotation or SymbolLayer they'll offer much better performance.\n\nThis is based on [MakerView plugin](https://docs.mapbox.com/android/plugins/overview/markerview/) on Android\nand PointAnnotation on iOS.", "displayName": "MarkerView", "methods": [], "props": [ @@ -3610,12 +3610,12 @@ "name": "RasterSource" }, "ShapeSource": { - "description": "ShapeSource is a map content source that supplies vector shapes to be shown on the map.\nThe shape may be a url or a GeoJSON object", + "description": "ShapeSource is a map content source that supplies vector shapes to be shown on the map.\nThe shape may be an url or a GeoJSON object", "displayName": "ShapeSource", "methods": [ { "name": "features", - "docblock": "Returns all features from the source that match the query parameters regardless of whether or not the feature is\ncurrently rendered on the map.\n\n@example\nshapeSource.features()\n\n@param {Array=} filter - an optional filter statement to filter the returned Features.\n@return {FeatureCollection}", + "docblock": "Returns all features from the source that match the query parameters whether the feature is currently\nrendered on the map.\n\n@example\nshapeSource.features()\n\n@param {Array=} filter - an optional filter statement to filter the returned Features.\n@return {FeatureCollection}", "modifiers": [ "async" ], @@ -3635,7 +3635,7 @@ "name": "FeatureCollection" } }, - "description": "Returns all features from the source that match the query parameters regardless of whether or not the feature is\ncurrently rendered on the map.", + "description": "Returns all features from the source that match the query parameters whether the feature is currently\nrendered on the map.", "examples": [ "\nshapeSource.features()\n\n" ] @@ -3772,7 +3772,7 @@ "required": false, "type": "object", "default": "none", - "description": "The contents of the source. A shape can represent a GeoJSON geometry, a feature, or a feature colllection." + "description": "The contents of the source. A shape can represent a GeoJSON geometry, a feature, or a feature collection." }, { "name": "cluster", @@ -4176,7 +4176,7 @@ ] }, "Style": { - "description": "Style is a component that automatically adds sources / layers to the map using Mapbox GL Style Spec.\nOnly [`sources`](https://docs.mapbox.com/mapbox-gl-js/style-spec/sources) & [`layers`](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/) are supported.\nOther fields such as `sprites`, `glyphs` etc. will be ignored. Not all layer / source attributes from the style spec are supported, in general the supported attributes will mentioned under https://github.com/rnmapbox/maps/tree/main/docs.", + "description": "Style is a component that automatically adds sources / layers to the map using Mapbox GL Style Spec.\nOnly [`sources`](https://docs.mapbox.com/mapbox-gl-js/style-spec/sources) & [`layers`](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/) are supported.\nOther fields such as `sprites`, `glyphs` etc. will be ignored. Not all layer / source attributes from the style spec are supported, in general the supported attributes will be mentioned under https://github.com/rnmapbox/maps/tree/main/docs.", "displayName": "Style", "methods": [], "props": [ diff --git a/docs/snapshotManager.md b/docs/snapshotManager.md index b94de31cf..2bfeff08b 100644 --- a/docs/snapshotManager.md +++ b/docs/snapshotManager.md @@ -1,14 +1,16 @@ -## -### The snapshotManager generates static raster images of the map.
Each snapshot image depicts a portion of a map defined by an SnapshotOptions object you provide.
The snapshotter generates the snapshot asynchronous. +# +The snapshotManager generates static raster images of the map. +Each snapshot image depicts a portion of a map defined by an SnapshotOptions object you provide. +The snapshotter generates the snapshot asynchronous. -### methods -#### takeSnap(options) +## methods +### takeSnap(options) Takes a snapshot of the base map using the provided Snapshot options. NOTE pitch, heading, zoomLevel only works when centerCoordinate is set! -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | | `options` | `SnapshotOptions` | `Yes` | Snapshot options for create a static image of the base map | diff --git a/javascript/components/Callout.js b/javascript/components/Callout.js index 4ba33eee7..e548881f3 100644 --- a/javascript/components/Callout.js +++ b/javascript/components/Callout.js @@ -56,7 +56,7 @@ class Callout extends React.PureComponent { ...viewPropTypes, /** - * String that get's displayed in the default callout. + * String that gets displayed in the default callout. */ title: PropTypes.string, diff --git a/javascript/components/Camera.tsx b/javascript/components/Camera.tsx index 43766e7e6..f7c9501b2 100644 --- a/javascript/components/Camera.tsx +++ b/javascript/components/Camera.tsx @@ -178,7 +178,7 @@ export type CameraAnimationMode = * * To use imperative methods, pass in a ref object: * - * ``` + * ```tsx * const camera = useRef(null); * * useEffect(() => { diff --git a/javascript/components/Images.js b/javascript/components/Images.js index 0887cc808..9c84099dc 100644 --- a/javascript/components/Images.js +++ b/javascript/components/Images.js @@ -21,7 +21,7 @@ function _isUrlOrPath(value) { } /** - * Images defines the images used in Symbol etc layers + * Images defines the images used in Symbol etc. layers. */ class Images extends React.Component { static NATIVE_ASSETS_KEY = 'assets'; diff --git a/javascript/components/MapView.js b/javascript/components/MapView.js index 7de463a72..82ba3e895 100644 --- a/javascript/components/MapView.js +++ b/javascript/components/MapView.js @@ -75,7 +75,7 @@ class MapView extends NativeBridgeComponent(React.Component) { * which will adaptively set the preferred frame rate based on the capability of * the user’s device to maintain a smooth experience. This property can be set to arbitrary integer values. * - * Android: The maximum frame rate at which the map view is rendered, but it can't excess the ability of device hardware. + * Android: The maximum frame rate at which the map view is rendered, but it can't exceed the ability of device hardware. * This property can be set to arbitrary integer values. */ preferredFramesPerSecond: PropTypes.number, @@ -175,7 +175,7 @@ class MapView extends NativeBridgeComponent(React.Component) { scaleBarPosition: ornamentPositionPropType, /** - * [Android only] Enable/Disable use of GLSurfaceView insted of TextureView. + * [Android only] Enable/Disable use of GLSurfaceView instead of TextureView. */ surfaceView: PropTypes.bool, @@ -450,7 +450,7 @@ class MapView extends NativeBridgeComponent(React.Component) { } /** - * The coordinate bounds(ne, sw) visible in the users’s viewport. + * The coordinate bounds (ne, sw) visible in the user’s viewport. * * @example * const visibleBounds = await this._map.getVisibleBounds(); diff --git a/javascript/components/MarkerView.js b/javascript/components/MarkerView.js index 53b25f3ee..151b4b973 100644 --- a/javascript/components/MarkerView.js +++ b/javascript/components/MarkerView.js @@ -12,10 +12,10 @@ const MapboxGL = NativeModules.MGLModule; export const NATIVE_MODULE_NAME = 'RCTMGLMarkerView'; /** - * MarkerView allows you to place a interactive react native marker to the map. + * MarkerView allows you to place an interactive React Native marker to the map. + * + * If you have static view consider using PointAnnotation or SymbolLayer they'll offer much better performance. * - * If you have static view consider using PointAnnotation or SymbolLayer they'll offer much better performance - * . * This is based on [MakerView plugin](https://docs.mapbox.com/android/plugins/overview/markerview/) on Android * and PointAnnotation on iOS. */ diff --git a/javascript/components/RasterDemSource.js b/javascript/components/RasterDemSource.js index 8a8e04c74..57ebdcd9e 100644 --- a/javascript/components/RasterDemSource.js +++ b/javascript/components/RasterDemSource.js @@ -72,7 +72,7 @@ class RasterDemSource extends AbstractSource { let { url } = this.props; let { tileUrlTemplates } = this.props; - // Swapping url for tileUrlTemplates to provide backward compatiblity + // Swapping url for tileUrlTemplates to provide backward compatibility // when RasterSource supported only tile url as url prop if (isTileTemplateUrl(url)) { tileUrlTemplates = [url]; diff --git a/javascript/components/RasterSource.js b/javascript/components/RasterSource.js index 6cb1f7068..a8664c4c3 100644 --- a/javascript/components/RasterSource.js +++ b/javascript/components/RasterSource.js @@ -88,7 +88,7 @@ class RasterSource extends AbstractSource { let { url } = this.props; let { tileUrlTemplates } = this.props; - // Swapping url for tileUrlTemplates to provide backward compatiblity + // Swapping url for tileUrlTemplates to provide backward compatibility // when RasterSource supported only tile url as url prop if (isTileTemplateUrl(url)) { tileUrlTemplates = [url]; diff --git a/javascript/components/ShapeSource.js b/javascript/components/ShapeSource.js index 42f359c2b..1e8155f73 100644 --- a/javascript/components/ShapeSource.js +++ b/javascript/components/ShapeSource.js @@ -21,7 +21,7 @@ export const NATIVE_MODULE_NAME = 'RCTMGLShapeSource'; /** * ShapeSource is a map content source that supplies vector shapes to be shown on the map. - * The shape may be a url or a GeoJSON object + * The shape may be an url or a GeoJSON object */ class ShapeSource extends NativeBridgeComponent(AbstractSource) { static NATIVE_ASSETS_KEY = 'assets'; @@ -40,7 +40,7 @@ class ShapeSource extends NativeBridgeComponent(AbstractSource) { url: PropTypes.string, /** - * The contents of the source. A shape can represent a GeoJSON geometry, a feature, or a feature colllection. + * The contents of the source. A shape can represent a GeoJSON geometry, a feature, or a feature collection. */ shape: PropTypes.object, @@ -148,8 +148,8 @@ class ShapeSource extends NativeBridgeComponent(AbstractSource) { } /** - * Returns all features from the source that match the query parameters regardless of whether or not the feature is - * currently rendered on the map. + * Returns all features from the source that match the query parameters whether the feature is currently + * rendered on the map. * * @example * shapeSource.features() diff --git a/javascript/components/Style.js b/javascript/components/Style.js index ea4b596d9..cad38908d 100644 --- a/javascript/components/Style.js +++ b/javascript/components/Style.js @@ -198,7 +198,7 @@ function asSourceComponent(id, source) { /** * Style is a component that automatically adds sources / layers to the map using Mapbox GL Style Spec. * Only [`sources`](https://docs.mapbox.com/mapbox-gl-js/style-spec/sources) & [`layers`](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/) are supported. - * Other fields such as `sprites`, `glyphs` etc. will be ignored. Not all layer / source attributes from the style spec are supported, in general the supported attributes will mentioned under https://github.com/rnmapbox/maps/tree/main/docs. + * Other fields such as `sprites`, `glyphs` etc. will be ignored. Not all layer / source attributes from the style spec are supported, in general the supported attributes will be mentioned under https://github.com/rnmapbox/maps/tree/main/docs. */ const Style = (props) => { const [fetchedJson, setFetchedJson] = useState({}); diff --git a/plugin/install.md b/plugin/install.md index 5d3d18237..392dc5d11 100644 --- a/plugin/install.md +++ b/plugin/install.md @@ -1,14 +1,21 @@ -# Expo installation +# Expo Installation -> This package cannot be used in the "Expo Go" app because [it requires custom native code](https://docs.expo.io/workflow/customizing/). +> :warning: This package cannot be used in the "Expo Go" app because [it requires custom native code](https://docs.expo.io/workflow/customizing/). -First install the package with yarn, npm, or [`expo install rnmapbox/maps#main`](https://docs.expo.io/workflow/expo-cli/#expo-install). +First install the package with [`expo`](https://docs.expo.io/workflow/expo-cli/#expo-install), [`yarn`or `npm`](../README.md#step-1---install-package). +Install the latest release: ```sh -expo install rnmapbox/maps#main +expo install @rnmapbox/maps ``` -After installing this npm package, add the [config plugin](https://docs.expo.io/guides/config-plugins/) to the [`plugins`](https://docs.expo.io/versions/latest/config/app/#plugins) array of your `app.json` or `app.config.js`: +## Installing other versions +Replace `@rnmapbox/maps` with the following to install other versions: +- `rnmapbox/maps#main` installs the latest source from git + +## Plugin Configuration + +After installing this package, add the [config plugin](https://docs.expo.io/guides/config-plugins/) to the [`plugins`](https://docs.expo.io/versions/latest/config/app/#plugins) array of your `app.{json,config.js,config.ts}`: ```json { @@ -36,7 +43,7 @@ For `mapbox` or `mapbox-gl` you'll need to provide `RNMapboxMapsDownloadToken` a [ "@rnmapbox/maps", { - "RNMapboxMapsImpl": "maplibre", + "RNMapboxMapsImpl": "mapbox", "RNMapboxMapsDownloadToken": "sk.ey...qg" } ] diff --git a/scripts/templates/component.md.ejs b/scripts/templates/component.md.ejs index a462a3536..310b762f0 100644 --- a/scripts/templates/component.md.ejs +++ b/scripts/templates/component.md.ejs @@ -2,24 +2,24 @@ const component = locals.component; -%> -## /> -### <%- replaceNewLine(component.description) %> +# /> +<%- component.description %> <%_ if (component.props && component.props.length) { _%> -### props +## props | Prop | Type | Default | Required | Description | | ---- | :--: | :-----: | :------: | :----------: | <%- propMarkdownTableRows(component) %> <%_ } _%> <%_ if (component.methods && component.methods.length) { _%> -### methods +## methods <%_ for (let method of component.methods) { _%> -#### <%- getMarkdownMethodSignature(method) %> +### <%- getMarkdownMethodSignature(method) %> <%- replaceNewLine(method.description) %> -##### arguments +#### arguments | Name | Type | Required | Description | | ---- | :--: | :------: | :----------: | <%- methodMarkdownTableRow(method) %> @@ -29,7 +29,7 @@ <%_ } _%> <%_ if (component.styles && component.styles.length) { _%> -### styles +## styles <%_ for (let i = 0; i < component.styles.length; i++) { _%> <% @@ -41,80 +41,80 @@ const style = component.styles[i]; <%_ for (let style of component.styles) { _%> ___ -#### <%- style.name %> +### <%- style.name %> Name: `<%- style.name %>` -#### Description +### Description <%- style.description %> -#### Type +### Type `<%- style.type %>` <%_ if (exists(style.default)) { _%> -#### Default Value +### Default Value `<%= getStyleDefaultValue(style) %>` <%_ } _%> <%_ if (style.type === 'enum') { _%> -#### Supported Values +### Supported Values <%_ for (var i = 0; i < style.values.length; i++) { _%> **<%- style.values[i].value %>** - <%- style.values[i].doc %>
<%_ } _%> <%_ } _%> <%_ if (exists(style.units)) { _%> -#### Units +### Units `<%- style.units %>` <%_ } _%> <%_ if (exists(style.minimum)) { _%> -#### Minimum +### Minimum `<%- style.minimum %>` <%_ } _%> <%_ if (exists(style.maximum)) { _%> -#### Maximum +### Maximum `<%- style.maximum %>` <%_ } _%> <%_ if (style.requires.length) { _%> -#### Requires +### Requires `<%- style.requires.join(', ') %>` <%_ } _%> <%_ if (style.disabledBy.length) { _%> -#### Disabled By +### Disabled By `<%- style.disabledBy.join(', ') %>` <%_ } _%> <%_ if (style.allowedFunctionTypes.length) { _%> -#### Supported Style Functions +### Supported Style Functions `<%- style.allowedFunctionTypes.join(', ') %>` <%_ } _%> <%_ if (style.expression) { _%> -#### Expression +### Expression Parameters: `<%- (style.expression.parameters || []).join(', ') %>` <%_ } _%> <%_ if (style.transition) { _%> ___ -#### Name +### Name `<%- style.name %>Transition` -#### Description +### Description -The transition affecting any changes to this layer’s <%- style.name %> propery. +The transition affecting any changes to this layer’s <%- style.name %> property. -#### Type +### Type `{ duration, delay }` -#### Units +### Units `milliseconds` -#### Default Value +### Default Value `{duration: 300, delay: 0}` <%_ } %>