diff --git a/.eslintrc.js b/.eslintrc.js index 9468d81fd2..c4b6dd22c5 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -90,6 +90,7 @@ module.exports = { project: [ './tsconfig.json', './example/tsconfig.json', + './scripts/tsconfig.json', './fabricexample/tsconfig.json', './plugin/src/__tests__/tsconfig.eslint.json', ], diff --git a/.github/workflows/ios-actions.yml b/.github/workflows/ios-actions.yml index d3de38b45f..4f152e1a9d 100644 --- a/.github/workflows/ios-actions.yml +++ b/.github/workflows/ios-actions.yml @@ -91,13 +91,13 @@ jobs: brew install xcbeautify - name: Build for detox - run: set -o pipefail && NSUnbufferedIO=YES yarn detox build --configuration ios.debug 2>&1 | xcbeautify -qq + run: set -o pipefail && NSUnbufferedIO=YES yarn detox build --configuration ios.debug.ci 2>&1 - name: Test with detox if: inputs.NEW_ARCH != 1 run: | npx detox --version - yarn detox test --configuration ios.debug --debug-synchronization 500 --loglevel trace --record-logs all --take-screenshots all + yarn detox test --configuration ios.debug.ci --debug-synchronization 500 --loglevel trace --record-logs all --take-screenshots all env: SKIP_TESTS_NO_METAL: ${{ inputs.MAP_IMPL == 'mapbox' || inputs.MAP_IMPL == 'mapbox11' }} diff --git a/__tests__/__mocks__/react-native.mock.js b/__tests__/__mocks__/react-native.mock.js index ade0722dae..f5fccadccb 100644 --- a/__tests__/__mocks__/react-native.mock.js +++ b/__tests__/__mocks__/react-native.mock.js @@ -2,11 +2,7 @@ jest.mock('react-native/Libraries/Image/resolveAssetSource', () => { return () => ({ uri: 'asset://test.png' }); }); -jest.mock('react-native/Libraries/StyleSheet/StyleSheet', () => { - return { - create: (x) => x, - }; -}); +jest.mock('../../src/assets/heading.png', () => 'heading.png'); jest.mock('react-native/Libraries/EventEmitter/NativeEventEmitter', () => { function MockEventEmitter() {} diff --git a/__tests__/components/BackgroundLayer.test.js b/__tests__/components/BackgroundLayer.test.js index 9d085cdb74..8583c79a4d 100644 --- a/__tests__/components/BackgroundLayer.test.js +++ b/__tests__/components/BackgroundLayer.test.js @@ -5,7 +5,7 @@ import BackgroundLayer from '../../src/components/BackgroundLayer'; describe('BackgroundLayer', () => { test('renders correctly with default props', () => { - const { container: backgroundLayer } = render( + const { UNSAFE_root: backgroundLayer } = render( , ); @@ -28,7 +28,7 @@ describe('BackgroundLayer', () => { style: { visibility: 'none' }, }; - const { container: backgroundLayer } = render( + const { UNSAFE_root: backgroundLayer } = render( , ); const { props } = backgroundLayer; diff --git a/__tests__/components/CircleLayer.test.js b/__tests__/components/CircleLayer.test.js index b67122942e..59c83c8228 100644 --- a/__tests__/components/CircleLayer.test.js +++ b/__tests__/components/CircleLayer.test.js @@ -5,7 +5,7 @@ import CircleLayer from '../../src/components/CircleLayer'; describe('CircleLayer', () => { test('renders correctly with default props', () => { - const { container: circleLayer } = render( + const { UNSAFE_root: circleLayer } = render( , ); const { props } = circleLayer; @@ -27,7 +27,9 @@ describe('CircleLayer', () => { style: { visibility: 'none' }, }; - const { container: circleLayer } = render(); + const { UNSAFE_root: circleLayer } = render( + , + ); const { props } = circleLayer; expect(props.id).toStrictEqual(customProps.id); diff --git a/__tests__/components/HeatmapLayer.test.js b/__tests__/components/HeatmapLayer.test.js index b32b62977f..c0362ccd43 100644 --- a/__tests__/components/HeatmapLayer.test.js +++ b/__tests__/components/HeatmapLayer.test.js @@ -5,7 +5,7 @@ import HeatmapLayer from '../../src/components/HeatmapLayer'; describe('HeatmapLayer', () => { test('renders correctly with default props', () => { - const { container: heatmapLayer } = render( + const { UNSAFE_root: heatmapLayer } = render( , ); const { props } = heatmapLayer; @@ -25,7 +25,9 @@ describe('HeatmapLayer', () => { maxZoomLevel: 8, style: { visibility: 'none' }, }; - const { container: heatmapLayer } = render(); + const { UNSAFE_root: heatmapLayer } = render( + , + ); const { props } = heatmapLayer; expect(props.id).toStrictEqual(testProps.id); diff --git a/__tests__/exportTestInterface.js b/__tests__/exportTestInterface.js deleted file mode 100644 index 2704db1fe4..0000000000 --- a/__tests__/exportTestInterface.js +++ /dev/null @@ -1,55 +0,0 @@ -import fs from 'fs'; - -import MapboxGL, { Style } from '../src'; -import StyleImportConfig from '../example/src/examples/V11/StyleImportConfig'; -import UserLocationUpdates from '../example/src/examples/UserLocation/UserLocationUpdates'; - -console.log( - ' [***] => Hello World!', - StyleImportConfig.title, - StyleImportConfig.tags, -); - -const rootDir = '.'; - -const allexamples = { - V11: [{ StyleImportConfig }], - 'User Location': [{ UserLocationUpdates }], -}; - -describe('Public Interface', () => { - it('should contain all expected components and utils', () => {}); - - // enumerate all examples - var result = {}; - - Object.keys(allexamples).forEach((key) => { - const skey = key.replaceAll(' ', '_'); - console.log('skey', skey); - const data = allexamples[key]; - result[skey] = []; - data.forEach((item) => { - const name = Object.keys(item)[0]; - const { title, tags, docs } = item[name]; - - const extensions = ['js', 'jsx', 'ts', 'tsx']; - const path = `${rootDir}/example/src/examples/${key}/${name}`; - var fullPath = null; - extensions.forEach((ext) => { - const actPath = `${rootDir}/example/src/examples/${key.replaceAll( - ' ', - '', - )}/${name}.${ext}`; - console.log("actPath", actPath); - if (fs.existsSync(actPath)) { - fullPath = actPath; - } - }); - result[skey].push({ title, tags, docs, name, fullPath }); - }); - }); - - fs.writeFileSync(`${rootDir}/docs/examples.json`, JSON.stringify(result)); - - console.log(' [***] => result', JSON.stringify(result)); -}); diff --git a/docs/Annotation.md b/docs/Annotation.md index dc59c9cf0b..b1a22a8c23 100644 --- a/docs/Annotation.md +++ b/docs/Annotation.md @@ -1,9 +1,12 @@ + + ```tsx import { Annotation } from '@rnmapbox/maps'; Annotation + ``` @@ -46,7 +49,7 @@ FIX ME NO DESCRIPTION func ``` FIX ME NO DESCRIPTION -*signature:*`(x:number) => number` +*signature:*`(x:number) => number` _defaults to:_ `Easing.linear` @@ -67,7 +70,7 @@ FIX ME NO DESCRIPTION func ``` FIX ME NO DESCRIPTION -*signature:*`(event:OnPressEvent) => void` +*signature:*`(event:OnPressEvent) => void` diff --git a/docs/Atmosphere.md b/docs/Atmosphere.md index 58d7ee79a9..806ffeac93 100644 --- a/docs/Atmosphere.md +++ b/docs/Atmosphere.md @@ -1,9 +1,13 @@ + Mapbox spec: [atmosphere](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#atmosphere) + + ```tsx import { Atmosphere } from '@rnmapbox/maps'; Atmosphere + ``` @@ -40,42 +44,43 @@ ___ ### range Name: `range` -### Description +Mapbox spec: [range](https://docs.mapbox.com/style-spec/reference/layers/#range) + +#### 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 +### rangeTransition +Name: `rangeTransition` -`rangeTransition` - -### Description +#### Description 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}` @@ -84,36 +89,37 @@ ___ ### color Name: `color` -### Description +Mapbox spec: [color](https://docs.mapbox.com/style-spec/reference/layers/#color) + +#### 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 +### colorTransition +Name: `colorTransition` -`colorTransition` - -### Description +#### Description 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}` @@ -122,36 +128,37 @@ ___ ### highColor Name: `highColor` -### Description +Mapbox spec: [high-color](https://docs.mapbox.com/style-spec/reference/layers/#high-color) + +#### 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 +### highColorTransition +Name: `highColorTransition` -`highColorTransition` - -### Description +#### Description 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}` @@ -160,36 +167,37 @@ ___ ### spaceColor Name: `spaceColor` -### Description +Mapbox spec: [space-color](https://docs.mapbox.com/style-spec/reference/layers/#space-color) + +#### 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 +### spaceColorTransition +Name: `spaceColorTransition` -`spaceColorTransition` - -### Description +#### Description 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}` @@ -198,42 +206,43 @@ ___ ### horizonBlend Name: `horizonBlend` -### Description +Mapbox spec: [horizon-blend](https://docs.mapbox.com/style-spec/reference/layers/#horizon-blend) + +#### 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 +### horizonBlendTransition +Name: `horizonBlendTransition` -`horizonBlendTransition` - -### Description +#### Description 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}` @@ -242,42 +251,43 @@ ___ ### starIntensity Name: `starIntensity` -### Description +Mapbox spec: [star-intensity](https://docs.mapbox.com/style-spec/reference/layers/#star-intensity) + +#### 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 - -`starIntensityTransition` +### starIntensityTransition +Name: `starIntensityTransition` -### Description +#### Description 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 db45da079e..8eb15cd92f 100644 --- a/docs/BackgroundLayer.md +++ b/docs/BackgroundLayer.md @@ -1,9 +1,13 @@ + Mapbox spec: [background](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#background) + + ```tsx import { BackgroundLayer } from '@rnmapbox/maps'; BackgroundLayer + ``` @@ -131,15 +135,17 @@ ___ ### visibility Name: `visibility` -### Description +Mapbox spec: [visibility](https://docs.mapbox.com/style-spec/reference/layers/#layout-background-visibility) + +#### 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.
@@ -150,39 +156,40 @@ ___ ### backgroundColor Name: `backgroundColor` -### Description +Mapbox spec: [background-color](https://docs.mapbox.com/style-spec/reference/layers/#paint-background-background-color) + +#### 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 +### backgroundColorTransition +Name: `backgroundColorTransition` -`backgroundColorTransition` - -### Description +#### Description 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}` @@ -191,14 +198,16 @@ ___ ### backgroundPattern Name: `backgroundPattern` -### Description +Mapbox spec: [background-pattern](https://docs.mapbox.com/style-spec/reference/layers/#paint-background-background-pattern) + +#### 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` @@ -207,42 +216,43 @@ ___ ### backgroundOpacity Name: `backgroundOpacity` -### Description +Mapbox spec: [background-opacity](https://docs.mapbox.com/style-spec/reference/layers/#paint-background-background-opacity) + +#### 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 - -`backgroundOpacityTransition` +### backgroundOpacityTransition +Name: `backgroundOpacityTransition` -### Description +#### Description 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 b0948845cc..75968264e1 100644 --- a/docs/Callout.md +++ b/docs/Callout.md @@ -1,9 +1,12 @@ + + ```tsx import { Callout } from '@rnmapbox/maps'; Callout + ``` Callout that displays information about a selected annotation near the annotation. diff --git a/docs/Camera.md b/docs/Camera.md index 22873b5a1a..1587674cc8 100644 --- a/docs/Camera.md +++ b/docs/Camera.md @@ -1,16 +1,19 @@ + + ```tsx import { Camera } from '@rnmapbox/maps'; Camera + ``` Controls the perspective from which the user sees the map. To use imperative methods, pass in a ref object: ```tsx -const camera = useRef(null); +const camera = useRef<Camera>(null); useEffect(() => { camera.current?.setCamera({ @@ -19,7 +22,7 @@ useEffect(() => { }, []); return ( - + <Camera ref={camera} /> ); ``` @@ -83,7 +86,14 @@ The zoom level of the map. ### padding -TODO +```tsx +type Padding = { + paddingLeft: number; /* Left padding in points */ + paddingRight: number; /* Right padding in points */ + paddingTop: number; /* Top padding in points */ + paddingBottom: number; /* Bottom padding in points */ +} +``` The viewport padding in points. @@ -184,14 +194,32 @@ The highest allowed zoom level. ### maxBounds -TODO +```tsx +type MaxBounds = { + ne: union; /* FIX ME NO DESCRIPTION */ + sw: union; /* FIX ME NO DESCRIPTION */ +} +``` The corners of a box defining the limits of where the camera can pan or zoom. ### defaultSettings -TODO +```tsx +type DefaultSettings = { + type: literal; /* Allows static check of the data type. For internal use only. */ + centerCoordinate: union; /* The location on which the map should center. */ + bounds: intersection; /* The corners of a box around which the map should bound. Contains padding props for backwards +compatibility; the root `padding` prop should be used instead. */ + heading: number; /* The heading (orientation) of the map. */ + pitch: number; /* The pitch of the map. */ + zoomLevel: number; /* The zoom level of the map. */ + padding: signature; /* The viewport padding in points. */ + animationDuration: number; /* The duration the map takes to animate to a new configuration. */ + animationMode: union; /* The easing or path the camera uses to animate to a new configuration. */ +} +``` The configuration that the camera falls back on, if no other values are specified. @@ -222,7 +250,7 @@ configuration. (Not yet implemented.) func ``` Executes when user tracking mode changes. -*signature:*`(event:MapboxGLEvent) => void` +*signature:*`(event:MapboxGLEvent) => void` diff --git a/docs/CircleLayer.md b/docs/CircleLayer.md index 2870e2f650..98cf297293 100644 --- a/docs/CircleLayer.md +++ b/docs/CircleLayer.md @@ -1,9 +1,13 @@ + Mapbox spec: [circle](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#circle) + + ```tsx import { CircleLayer } from '@rnmapbox/maps'; CircleLayer + ``` CircleLayer is a style layer that renders one or more filled circles on the map. @@ -141,14 +145,16 @@ ___ ### circleSortKey Name: `circleSortKey` -### Description +Mapbox spec: [circle-sort-key](https://docs.mapbox.com/style-spec/reference/layers/#layout-circle-circle-sort-key) + +#### 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` @@ -157,15 +163,17 @@ ___ ### visibility Name: `visibility` -### Description +Mapbox spec: [visibility](https://docs.mapbox.com/style-spec/reference/layers/#layout-circle-visibility) + +#### 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.
@@ -176,42 +184,43 @@ ___ ### circleRadius Name: `circleRadius` -### Description +Mapbox spec: [circle-radius](https://docs.mapbox.com/style-spec/reference/layers/#paint-circle-circle-radius) + +#### 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 +### circleRadiusTransition +Name: `circleRadiusTransition` -`circleRadiusTransition` - -### Description +#### Description 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}` @@ -220,36 +229,37 @@ ___ ### circleColor Name: `circleColor` -### Description +Mapbox spec: [circle-color](https://docs.mapbox.com/style-spec/reference/layers/#paint-circle-circle-color) + +#### Description The fill color of the circle. -### Type +#### Type `color` -### Default Value +#### Default Value `#000000` -### Expression +#### Expression Parameters: `zoom, feature, feature-state` ___ -### Name - -`circleColorTransition` +### circleColorTransition +Name: `circleColorTransition` -### Description +#### Description 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}` @@ -258,36 +268,37 @@ ___ ### circleBlur Name: `circleBlur` -### Description +Mapbox spec: [circle-blur](https://docs.mapbox.com/style-spec/reference/layers/#paint-circle-circle-blur) + +#### 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 - -`circleBlurTransition` +### circleBlurTransition +Name: `circleBlurTransition` -### Description +#### Description 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}` @@ -296,42 +307,43 @@ ___ ### circleOpacity Name: `circleOpacity` -### Description +Mapbox spec: [circle-opacity](https://docs.mapbox.com/style-spec/reference/layers/#paint-circle-circle-opacity) + +#### 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 +### circleOpacityTransition +Name: `circleOpacityTransition` -`circleOpacityTransition` - -### Description +#### Description 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}` @@ -340,39 +352,40 @@ ___ ### circleTranslate Name: `circleTranslate` -### Description +Mapbox spec: [circle-translate](https://docs.mapbox.com/style-spec/reference/layers/#paint-circle-circle-translate) + +#### 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 - -`circleTranslateTransition` +### circleTranslateTransition +Name: `circleTranslateTransition` -### Description +#### Description 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}` @@ -381,23 +394,25 @@ ___ ### circleTranslateAnchor Name: `circleTranslateAnchor` -### Description +Mapbox spec: [circle-translate-anchor](https://docs.mapbox.com/style-spec/reference/layers/#paint-circle-circle-translate-anchor) + +#### 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` @@ -406,20 +421,22 @@ ___ ### circlePitchScale Name: `circlePitchScale` -### Description +Mapbox spec: [circle-pitch-scale](https://docs.mapbox.com/style-spec/reference/layers/#paint-circle-circle-pitch-scale) + +#### 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` @@ -428,20 +445,22 @@ ___ ### circlePitchAlignment Name: `circlePitchAlignment` -### Description +Mapbox spec: [circle-pitch-alignment](https://docs.mapbox.com/style-spec/reference/layers/#paint-circle-circle-pitch-alignment) + +#### 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` @@ -450,42 +469,43 @@ ___ ### circleStrokeWidth Name: `circleStrokeWidth` -### Description +Mapbox spec: [circle-stroke-width](https://docs.mapbox.com/style-spec/reference/layers/#paint-circle-circle-stroke-width) + +#### 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 - -`circleStrokeWidthTransition` +### circleStrokeWidthTransition +Name: `circleStrokeWidthTransition` -### Description +#### Description 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}` @@ -494,36 +514,37 @@ ___ ### circleStrokeColor Name: `circleStrokeColor` -### Description +Mapbox spec: [circle-stroke-color](https://docs.mapbox.com/style-spec/reference/layers/#paint-circle-circle-stroke-color) + +#### Description The stroke color of the circle. -### Type +#### Type `color` -### Default Value +#### Default Value `#000000` -### Expression +#### Expression Parameters: `zoom, feature, feature-state` ___ -### Name +### circleStrokeColorTransition +Name: `circleStrokeColorTransition` -`circleStrokeColorTransition` - -### Description +#### Description 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}` @@ -532,42 +553,43 @@ ___ ### circleStrokeOpacity Name: `circleStrokeOpacity` -### Description +Mapbox spec: [circle-stroke-opacity](https://docs.mapbox.com/style-spec/reference/layers/#paint-circle-circle-stroke-opacity) + +#### 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 - -`circleStrokeOpacityTransition` +### circleStrokeOpacityTransition +Name: `circleStrokeOpacityTransition` -### Description +#### Description 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/FillExtrusionLayer.md b/docs/FillExtrusionLayer.md index 2ca11b03d1..538585d72b 100644 --- a/docs/FillExtrusionLayer.md +++ b/docs/FillExtrusionLayer.md @@ -1,9 +1,13 @@ + Mapbox spec: [fill-extrusion](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#fill-extrusion) + + ```tsx import { FillExtrusionLayer } from '@rnmapbox/maps'; FillExtrusionLayer + ``` FillExtrusionLayer is a style layer that renders one or more 3D extruded polygons on the map. @@ -138,15 +142,17 @@ ___ ### visibility Name: `visibility` -### Description +Mapbox spec: [visibility](https://docs.mapbox.com/style-spec/reference/layers/#layout-fill-extrusion-visibility) + +#### 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.
@@ -157,42 +163,43 @@ ___ ### fillExtrusionOpacity Name: `fillExtrusionOpacity` -### Description +Mapbox spec: [fill-extrusion-opacity](https://docs.mapbox.com/style-spec/reference/layers/#paint-fill-extrusion-fill-extrusion-opacity) + +#### 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 +### fillExtrusionOpacityTransition +Name: `fillExtrusionOpacityTransition` -`fillExtrusionOpacityTransition` - -### Description +#### Description 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}` @@ -201,39 +208,40 @@ ___ ### fillExtrusionColor Name: `fillExtrusionColor` -### Description +Mapbox spec: [fill-extrusion-color](https://docs.mapbox.com/style-spec/reference/layers/#paint-fill-extrusion-fill-extrusion-color) + +#### 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 +### fillExtrusionColorTransition +Name: `fillExtrusionColorTransition` -`fillExtrusionColorTransition` - -### Description +#### Description 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}` @@ -242,39 +250,40 @@ ___ ### fillExtrusionTranslate Name: `fillExtrusionTranslate` -### Description +Mapbox spec: [fill-extrusion-translate](https://docs.mapbox.com/style-spec/reference/layers/#paint-fill-extrusion-fill-extrusion-translate) + +#### 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 +### fillExtrusionTranslateTransition +Name: `fillExtrusionTranslateTransition` -`fillExtrusionTranslateTransition` - -### Description +#### Description 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}` @@ -283,23 +292,25 @@ ___ ### fillExtrusionTranslateAnchor Name: `fillExtrusionTranslateAnchor` -### Description +Mapbox spec: [fill-extrusion-translate-anchor](https://docs.mapbox.com/style-spec/reference/layers/#paint-fill-extrusion-fill-extrusion-translate-anchor) + +#### 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` @@ -308,14 +319,16 @@ ___ ### fillExtrusionPattern Name: `fillExtrusionPattern` -### Description +Mapbox spec: [fill-extrusion-pattern](https://docs.mapbox.com/style-spec/reference/layers/#paint-fill-extrusion-fill-extrusion-pattern) + +#### 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` @@ -324,42 +337,43 @@ ___ ### fillExtrusionHeight Name: `fillExtrusionHeight` -### Description +Mapbox spec: [fill-extrusion-height](https://docs.mapbox.com/style-spec/reference/layers/#paint-fill-extrusion-fill-extrusion-height) + +#### 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 +### fillExtrusionHeightTransition +Name: `fillExtrusionHeightTransition` -`fillExtrusionHeightTransition` - -### Description +#### Description 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}` @@ -368,45 +382,46 @@ ___ ### fillExtrusionBase Name: `fillExtrusionBase` -### Description +Mapbox spec: [fill-extrusion-base](https://docs.mapbox.com/style-spec/reference/layers/#paint-fill-extrusion-fill-extrusion-base) + +#### 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 +### fillExtrusionBaseTransition +Name: `fillExtrusionBaseTransition` -`fillExtrusionBaseTransition` - -### Description +#### Description 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}` @@ -415,16 +430,18 @@ ___ ### fillExtrusionVerticalGradient Name: `fillExtrusionVerticalGradient` -### Description +Mapbox spec: [fill-extrusion-vertical-gradient](https://docs.mapbox.com/style-spec/reference/layers/#paint-fill-extrusion-fill-extrusion-vertical-gradient) + +#### 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` diff --git a/docs/FillLayer.md b/docs/FillLayer.md index 1dc740a5a6..b5cde7f15e 100644 --- a/docs/FillLayer.md +++ b/docs/FillLayer.md @@ -1,9 +1,13 @@ + Mapbox spec: [fill](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#fill) + + ```tsx import { FillLayer } from '@rnmapbox/maps'; FillLayer + ``` FillLayer is a style layer that renders one or more filled (and optionally stroked) polygons on the map. @@ -136,14 +140,16 @@ ___ ### fillSortKey Name: `fillSortKey` -### Description +Mapbox spec: [fill-sort-key](https://docs.mapbox.com/style-spec/reference/layers/#layout-fill-fill-sort-key) + +#### 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` @@ -152,15 +158,17 @@ ___ ### visibility Name: `visibility` -### Description +Mapbox spec: [visibility](https://docs.mapbox.com/style-spec/reference/layers/#layout-fill-visibility) + +#### 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.
@@ -171,16 +179,18 @@ ___ ### fillAntialias Name: `fillAntialias` -### Description +Mapbox spec: [fill-antialias](https://docs.mapbox.com/style-spec/reference/layers/#paint-fill-fill-antialias) + +#### Description Whether or not the fill should be antialiased. -### Type +#### Type `boolean` -### Default Value +#### Default Value `true` -### Expression +#### Expression Parameters: `zoom` @@ -189,42 +199,43 @@ ___ ### fillOpacity Name: `fillOpacity` -### Description +Mapbox spec: [fill-opacity](https://docs.mapbox.com/style-spec/reference/layers/#paint-fill-fill-opacity) + +#### 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 - -`fillOpacityTransition` +### fillOpacityTransition +Name: `fillOpacityTransition` -### Description +#### Description 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}` @@ -233,39 +244,40 @@ ___ ### fillColor Name: `fillColor` -### Description +Mapbox spec: [fill-color](https://docs.mapbox.com/style-spec/reference/layers/#paint-fill-fill-color) + +#### 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 - -`fillColorTransition` +### fillColorTransition +Name: `fillColorTransition` -### Description +#### Description 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}` @@ -274,37 +286,38 @@ ___ ### fillOutlineColor Name: `fillOutlineColor` -### Description +Mapbox spec: [fill-outline-color](https://docs.mapbox.com/style-spec/reference/layers/#paint-fill-fill-outline-color) + +#### 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 - -`fillOutlineColorTransition` +### fillOutlineColorTransition +Name: `fillOutlineColorTransition` -### Description +#### Description 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}` @@ -313,39 +326,40 @@ ___ ### fillTranslate Name: `fillTranslate` -### Description +Mapbox spec: [fill-translate](https://docs.mapbox.com/style-spec/reference/layers/#paint-fill-fill-translate) + +#### 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 - -`fillTranslateTransition` +### fillTranslateTransition +Name: `fillTranslateTransition` -### Description +#### Description 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}` @@ -354,23 +368,25 @@ ___ ### fillTranslateAnchor Name: `fillTranslateAnchor` -### Description +Mapbox spec: [fill-translate-anchor](https://docs.mapbox.com/style-spec/reference/layers/#paint-fill-fill-translate-anchor) + +#### 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` @@ -379,14 +395,16 @@ ___ ### fillPattern Name: `fillPattern` -### Description +Mapbox spec: [fill-pattern](https://docs.mapbox.com/style-spec/reference/layers/#paint-fill-fill-pattern) + +#### 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` diff --git a/docs/HeadingIndicator.md b/docs/HeadingIndicator.md index cea0cc6535..d6eb983709 100644 --- a/docs/HeadingIndicator.md +++ b/docs/HeadingIndicator.md @@ -1,9 +1,12 @@ + + ```tsx import { HeadingIndicator } from '@rnmapbox/maps'; HeadingIndicator + ``` diff --git a/docs/HeatmapLayer.md b/docs/HeatmapLayer.md index e064732282..2b3e0267ba 100644 --- a/docs/HeatmapLayer.md +++ b/docs/HeatmapLayer.md @@ -1,9 +1,13 @@ + Mapbox spec: [heatmap](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#heatmap) + + ```tsx import { HeatmapLayer } from '@rnmapbox/maps'; HeatmapLayer + ``` HeatmapLayer is a style layer that renders one or more filled circles on the map. @@ -134,15 +138,17 @@ ___ ### visibility Name: `visibility` -### Description +Mapbox spec: [visibility](https://docs.mapbox.com/style-spec/reference/layers/#layout-heatmap-visibility) + +#### 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.
@@ -153,42 +159,43 @@ ___ ### heatmapRadius Name: `heatmapRadius` -### Description +Mapbox spec: [heatmap-radius](https://docs.mapbox.com/style-spec/reference/layers/#paint-heatmap-heatmap-radius) + +#### 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 - -`heatmapRadiusTransition` +### heatmapRadiusTransition +Name: `heatmapRadiusTransition` -### Description +#### Description 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}` @@ -197,19 +204,21 @@ ___ ### heatmapWeight Name: `heatmapWeight` -### Description +Mapbox spec: [heatmap-weight](https://docs.mapbox.com/style-spec/reference/layers/#paint-heatmap-heatmap-weight) + +#### 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` @@ -218,39 +227,40 @@ ___ ### heatmapIntensity Name: `heatmapIntensity` -### Description +Mapbox spec: [heatmap-intensity](https://docs.mapbox.com/style-spec/reference/layers/#paint-heatmap-heatmap-intensity) + +#### 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 - -`heatmapIntensityTransition` +### heatmapIntensityTransition +Name: `heatmapIntensityTransition` -### Description +#### Description 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}` @@ -259,16 +269,18 @@ ___ ### heatmapColor Name: `heatmapColor` -### Description +Mapbox spec: [heatmap-color](https://docs.mapbox.com/style-spec/reference/layers/#paint-heatmap-heatmap-color) + +#### 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` @@ -277,42 +289,43 @@ ___ ### heatmapOpacity Name: `heatmapOpacity` -### Description +Mapbox spec: [heatmap-opacity](https://docs.mapbox.com/style-spec/reference/layers/#paint-heatmap-heatmap-opacity) + +#### 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 - -`heatmapOpacityTransition` +### heatmapOpacityTransition +Name: `heatmapOpacityTransition` -### Description +#### Description 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/Image.md b/docs/Image.md index 4e37a94fed..0d321c14c5 100644 --- a/docs/Image.md +++ b/docs/Image.md @@ -1,9 +1,12 @@ + + ```tsx import { Image } from '@rnmapbox/maps'; Image + ``` diff --git a/docs/ImageSource.md b/docs/ImageSource.md index 6f9307d381..8fcaabac9c 100644 --- a/docs/ImageSource.md +++ b/docs/ImageSource.md @@ -1,9 +1,12 @@ + + ```tsx import { ImageSource } from '@rnmapbox/maps'; ImageSource + ``` 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 diff --git a/docs/Images.md b/docs/Images.md index adfd3695b5..1659fb88e6 100644 --- a/docs/Images.md +++ b/docs/Images.md @@ -1,9 +1,12 @@ + + ```tsx import { Images } from '@rnmapbox/maps'; Images + ``` Images defines the images used in Symbol etc. layers. @@ -12,7 +15,11 @@ Images defines the images used in Symbol etc. layers. ### images -TODO +```tsx +type Images = { + [object Object]: union; /* FIX ME NO DESCRIPTION */ +} +``` 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'` @@ -28,7 +35,7 @@ If you have an asset under Image.xcassets on iOS and the drawables directory on you can specify an array of string names with assets as the key `['pin']`. Additionally object with keys sdf, and strechX, strechY is supported for [SDF icons](https://docs.mapbox.com/help/troubleshooting/using-recolorable-images-in-mapbox-maps/) - +[Shape Source Icons](../examples/SymbolCircleLayer/ShapeSourceIcon) ### onImageMissing @@ -37,9 +44,9 @@ func ``` Gets called when a Layer is trying to render an image whose key is not present in any of the `Images` component of the Map. -*signature:*`(imageKey:string) => void` - +*signature:*`(imageKey:string) => void` +[Shape Source Icons](../examples/SymbolCircleLayer/ShapeSourceIcon) ### id diff --git a/docs/Light.md b/docs/Light.md index f7eed22f83..49d751b701 100644 --- a/docs/Light.md +++ b/docs/Light.md @@ -1,9 +1,13 @@ + Mapbox spec: [light](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#light) + + ```tsx import { Light } from '@rnmapbox/maps'; Light + ``` Light represents the light source for extruded geometries @@ -38,20 +42,22 @@ ___ ### anchor Name: `anchor` -### Description +Mapbox spec: [anchor](https://docs.mapbox.com/style-spec/reference/layers/#anchor) + +#### 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` @@ -60,36 +66,37 @@ ___ ### position Name: `position` -### Description +Mapbox spec: [position](https://docs.mapbox.com/style-spec/reference/layers/#position) + +#### 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 +### positionTransition +Name: `positionTransition` -`positionTransition` - -### Description +#### Description 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}` @@ -98,36 +105,37 @@ ___ ### color Name: `color` -### Description +Mapbox spec: [color](https://docs.mapbox.com/style-spec/reference/layers/#color) + +#### Description Color tint for lighting extruded geometries. -### Type +#### Type `color` -### Default Value +#### Default Value `#ffffff` -### Expression +#### Expression Parameters: `zoom` ___ -### Name - -`colorTransition` +### colorTransition +Name: `colorTransition` -### Description +#### Description 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}` @@ -136,42 +144,43 @@ ___ ### intensity Name: `intensity` -### Description +Mapbox spec: [intensity](https://docs.mapbox.com/style-spec/reference/layers/#intensity) + +#### 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 - -`intensityTransition` +### intensityTransition +Name: `intensityTransition` -### Description +#### Description 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 30277ead97..550d1ca623 100644 --- a/docs/LineLayer.md +++ b/docs/LineLayer.md @@ -1,9 +1,13 @@ + Mapbox spec: [line](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#line) + + ```tsx import { LineLayer } from '@rnmapbox/maps'; LineLayer + ``` LineLayer is a style layer that renders one or more stroked polylines on the map. @@ -145,21 +149,23 @@ ___ ### lineCap Name: `lineCap` -### Description +Mapbox spec: [line-cap](https://docs.mapbox.com/style-spec/reference/layers/#layout-line-line-cap) + +#### 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` @@ -168,23 +174,25 @@ ___ ### lineJoin Name: `lineJoin` -### Description +Mapbox spec: [line-join](https://docs.mapbox.com/style-spec/reference/layers/#layout-line-line-join) + +#### 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` @@ -193,16 +201,18 @@ ___ ### lineMiterLimit Name: `lineMiterLimit` -### Description +Mapbox spec: [line-miter-limit](https://docs.mapbox.com/style-spec/reference/layers/#layout-line-line-miter-limit) + +#### 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` @@ -211,16 +221,18 @@ ___ ### lineRoundLimit Name: `lineRoundLimit` -### Description +Mapbox spec: [line-round-limit](https://docs.mapbox.com/style-spec/reference/layers/#layout-line-line-round-limit) + +#### 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` @@ -229,14 +241,16 @@ ___ ### lineSortKey Name: `lineSortKey` -### Description +Mapbox spec: [line-sort-key](https://docs.mapbox.com/style-spec/reference/layers/#layout-line-line-sort-key) + +#### 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` @@ -245,15 +259,17 @@ ___ ### visibility Name: `visibility` -### Description +Mapbox spec: [visibility](https://docs.mapbox.com/style-spec/reference/layers/#layout-line-visibility) + +#### 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.
@@ -264,42 +280,43 @@ ___ ### lineOpacity Name: `lineOpacity` -### Description +Mapbox spec: [line-opacity](https://docs.mapbox.com/style-spec/reference/layers/#paint-line-line-opacity) + +#### 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 - -`lineOpacityTransition` +### lineOpacityTransition +Name: `lineOpacityTransition` -### Description +#### Description 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}` @@ -308,39 +325,40 @@ ___ ### lineColor Name: `lineColor` -### Description +Mapbox spec: [line-color](https://docs.mapbox.com/style-spec/reference/layers/#paint-line-line-color) + +#### 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 - -`lineColorTransition` +### lineColorTransition +Name: `lineColorTransition` -### Description +#### Description 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}` @@ -349,39 +367,40 @@ ___ ### lineTranslate Name: `lineTranslate` -### Description +Mapbox spec: [line-translate](https://docs.mapbox.com/style-spec/reference/layers/#paint-line-line-translate) + +#### 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 +### lineTranslateTransition +Name: `lineTranslateTransition` -`lineTranslateTransition` - -### Description +#### Description 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}` @@ -390,23 +409,25 @@ ___ ### lineTranslateAnchor Name: `lineTranslateAnchor` -### Description +Mapbox spec: [line-translate-anchor](https://docs.mapbox.com/style-spec/reference/layers/#paint-line-line-translate-anchor) + +#### 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` @@ -415,44 +436,45 @@ ___ ### lineWidth Name: `lineWidth` -### Description +Mapbox spec: [line-width](https://docs.mapbox.com/style-spec/reference/layers/#paint-line-line-width) + +#### 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 - -`lineWidthTransition` +### lineWidthTransition +Name: `lineWidthTransition` -### Description +#### Description 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}` @@ -461,42 +483,43 @@ ___ ### lineGapWidth Name: `lineGapWidth` -### Description +Mapbox spec: [line-gap-width](https://docs.mapbox.com/style-spec/reference/layers/#paint-line-line-gap-width) + +#### 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 - -`lineGapWidthTransition` +### lineGapWidthTransition +Name: `lineGapWidthTransition` -### Description +#### Description 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}` @@ -505,39 +528,40 @@ ___ ### lineOffset Name: `lineOffset` -### Description +Mapbox spec: [line-offset](https://docs.mapbox.com/style-spec/reference/layers/#paint-line-line-offset) + +#### 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 +### lineOffsetTransition +Name: `lineOffsetTransition` -`lineOffsetTransition` - -### Description +#### Description 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}` @@ -546,42 +570,43 @@ ___ ### lineBlur Name: `lineBlur` -### Description +Mapbox spec: [line-blur](https://docs.mapbox.com/style-spec/reference/layers/#paint-line-line-blur) + +#### 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 +### lineBlurTransition +Name: `lineBlurTransition` -`lineBlurTransition` - -### Description +#### Description 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}` @@ -590,23 +615,25 @@ ___ ### lineDasharray Name: `lineDasharray` -### Description +Mapbox spec: [line-dasharray](https://docs.mapbox.com/style-spec/reference/layers/#paint-line-line-dasharray) + +#### 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` @@ -615,14 +642,16 @@ ___ ### linePattern Name: `linePattern` -### Description +Mapbox spec: [line-pattern](https://docs.mapbox.com/style-spec/reference/layers/#paint-line-line-pattern) + +#### 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` @@ -631,17 +660,19 @@ ___ ### lineGradient Name: `lineGradient` -### Description +Mapbox spec: [line-gradient](https://docs.mapbox.com/style-spec/reference/layers/#paint-line-line-gradient) + +#### 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` @@ -650,19 +681,21 @@ ___ ### lineTrimOffset Name: `lineTrimOffset` -### Description +Mapbox spec: [line-trim-offset](https://docs.mapbox.com/style-spec/reference/layers/#paint-line-line-trim-offset) + +#### 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/MapView.md b/docs/MapView.md index 3b3fa52157..4c89b327e9 100644 --- a/docs/MapView.md +++ b/docs/MapView.md @@ -1,9 +1,12 @@ + + ```tsx import { MapView } from '@rnmapbox/maps'; MapView + ``` MapView backed by Mapbox Native GL @@ -136,7 +139,7 @@ string | number[] ``` MapView's tintColor - +[Set Tint Color](../examples/UserLocation/SetTintColor) ### logoEnabled @@ -197,7 +200,12 @@ Change corner of map the compass starts at. 0: TopLeft, 1: TopRight, 2: BottomLe ### compassViewMargins -TODO +```tsx +type CompassViewMargins = { + x: number; /* FIX ME NO DESCRIPTION */ + y: number; /* FIX ME NO DESCRIPTION */ +} +``` Add margins to the compass with x and y values @@ -273,7 +281,7 @@ Set map's label locale, e.g. { "locale": "es" } will localize labels to Spanish, func ``` Map press listener, gets called when a user presses the map -*signature:*`(feature:GeoJSON.Feature) => void` +*signature:*`(feature:GeoJSON.Feature) => void` @@ -283,7 +291,7 @@ Map press listener, gets called when a user presses the map func ``` Map long press listener, gets called when a user long presses the map -*signature:*`(feature:GeoJSON.Feature) => void` +*signature:*`(feature:GeoJSON.Feature) => void` @@ -292,12 +300,12 @@ Map long press listener, gets called when a user long presses the map ```tsx func ``` - void` +*signature:*`(feature:GeoJSON.Feature) => void` @@ -309,7 +317,7 @@ func This event is triggered whenever the currently displayed map region is changing. @param {PointFeature} feature - The geojson point feature at the camera center, properties contains zoomLevel, visibleBounds -*signature:*`(feature:GeoJSON.Feature) => void` +*signature:*`(feature:GeoJSON.Feature) => void` @@ -321,7 +329,7 @@ func This event is triggered whenever the currently displayed map region finished changing. @param {PointFeature} feature - The geojson point feature at the camera center, properties contains zoomLevel, visibleBounds -*signature:*`(feature:GeoJSON.Feature) => void` +*signature:*`(feature:GeoJSON.Feature) => void` @@ -331,7 +339,7 @@ This event is triggered whenever the currently displayed map region finished cha func ``` v10 only, replaces onRegionIsChanging -*signature:*`(state:{properties: {center: GeoJSON.Position, bounds: {ne: GeoJSON.Position, sw: GeoJSON.Position}, zoom: number, heading: number, pitch: number}, gestures: {isGestureActive: boolean}, timestamp: number}) => void` +*signature:*`(state:{properties: {center: GeoJSON.Position, bounds: {ne: GeoJSON.Position, sw: GeoJSON.Position}, zoom: number, heading: number, pitch: number}, gestures: {isGestureActive: boolean}, timestamp: number}) => void` @@ -341,7 +349,7 @@ v10 only, replaces onRegionIsChanging func ``` v10 only, replaces onRegionDidChange -*signature:*`(state:{properties: {center: GeoJSON.Position, bounds: {ne: GeoJSON.Position, sw: GeoJSON.Position}, zoom: number, heading: number, pitch: number}, gestures: {isGestureActive: boolean}, timestamp: number}) => void` +*signature:*`(state:{properties: {center: GeoJSON.Position, bounds: {ne: GeoJSON.Position, sw: GeoJSON.Position}, zoom: number, heading: number, pitch: number}, gestures: {isGestureActive: boolean}, timestamp: number}) => void` @@ -351,7 +359,7 @@ v10 only, replaces onRegionDidChange func ``` This event is triggered when the map is about to start loading a new map style. -*signature:*`() => void` +*signature:*`() => void` @@ -361,7 +369,7 @@ This event is triggered when the map is about to start loading a new map style. func ``` This is triggered when the map has successfully loaded a new map style. -*signature:*`() => void` +*signature:*`() => void` @@ -372,7 +380,7 @@ func ``` This event is triggered when the map has failed to load a new map style. On v10 it's deprecated and replaced by onMapLoadingError @deprecated use onMapLoadingError -*signature:*`() => void` +*signature:*`() => void` @@ -382,7 +390,7 @@ This event is triggered when the map has failed to load a new map style. On v10 func ``` This event is tiggered when there is an error during map load. V10 only, replaces onDidFailLoadingMap, might be called multiple times and not exclusive with onDidFinishLoadingMap. -*signature:*`() => void` +*signature:*`() => void` @@ -392,7 +400,7 @@ This event is tiggered when there is an error during map load. V10 only, replace func ``` This event is triggered when the map will start rendering a frame. -*signature:*`() => void` +*signature:*`() => void` @@ -402,7 +410,7 @@ This event is triggered when the map will start rendering a frame. func ``` This event is triggered when the map finished rendering a frame. -*signature:*`() => void` +*signature:*`() => void` @@ -412,7 +420,7 @@ This event is triggered when the map finished rendering a frame. func ``` This event is triggered when the map fully finished rendering a frame. -*signature:*`() => void` +*signature:*`() => void` @@ -422,7 +430,7 @@ This event is triggered when the map fully finished rendering a frame. func ``` This event is triggered when the map will start rendering the map. -*signature:*`() => void` +*signature:*`() => void` @@ -432,7 +440,7 @@ This event is triggered when the map will start rendering the map. func ``` This event is triggered when the map finished rendering the map. -*signature:*`() => void` +*signature:*`() => void` @@ -442,7 +450,7 @@ This event is triggered when the map finished rendering the map. func ``` This event is triggered when the map fully finished rendering the map. -*signature:*`() => void` +*signature:*`() => void` @@ -452,7 +460,7 @@ This event is triggered when the map fully finished rendering the map. func ``` This event is triggered when the user location is updated. -*signature:*`(feature:Location) => void` +*signature:*`(feature:Location) => void` @@ -462,7 +470,7 @@ This event is triggered when the user location is updated. func ``` This event is triggered when a style has finished loading. -*signature:*`() => void` +*signature:*`() => void` diff --git a/docs/MarkerView.md b/docs/MarkerView.md index 03a7790628..9218465a57 100644 --- a/docs/MarkerView.md +++ b/docs/MarkerView.md @@ -1,9 +1,12 @@ + + ```tsx import { MarkerView } from '@rnmapbox/maps'; MarkerView + ``` MarkerView represents an interactive React Native marker on the map. @@ -32,7 +35,12 @@ The center point (specified as a map coordinate) of the marker. ### anchor -TODO +```tsx +type Anchor = { + x: number; /* FIX ME NO DESCRIPTION */ + y: number; /* FIX ME NO DESCRIPTION */ +} +``` Any coordinate between (0, 0) and (1, 1), where (0, 0) is the top-left corner of the view, and (1, 1) is the bottom-right corner. Defaults to the center at (0.5, 0.5). diff --git a/docs/NativeUserLocation.md b/docs/NativeUserLocation.md index 7d53fd98a6..0e06bc5d09 100644 --- a/docs/NativeUserLocation.md +++ b/docs/NativeUserLocation.md @@ -1,9 +1,12 @@ + + ```tsx import { NativeUserLocation } from '@rnmapbox/maps'; NativeUserLocation + ``` diff --git a/docs/OfflineManager.md b/docs/OfflineManager.md index e74d02a11b..39ad8ecf6e 100644 --- a/docs/OfflineManager.md +++ b/docs/OfflineManager.md @@ -1,9 +1,12 @@ + + ```tsx import { offlineManager } from '@rnmapbox/maps'; offlineManager + ``` 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. diff --git a/docs/PointAnnotation.md b/docs/PointAnnotation.md index ade61649a2..cc99c223d4 100644 --- a/docs/PointAnnotation.md +++ b/docs/PointAnnotation.md @@ -1,9 +1,12 @@ + + ```tsx import { PointAnnotation } from '@rnmapbox/maps'; PointAnnotation + ``` PointAnnotation represents a one-dimensional shape located at a single geographical coordinate. @@ -76,7 +79,12 @@ The center point (specified as a map coordinate) of the annotation. ### anchor -TODO +```tsx +type Anchor = { + x: number; /* See anchor */ + y: number; /* See anchor */ +} +``` Specifies the anchor being set on a particular point of the annotation. The anchor point is specified in the continuous space [0.0, 1.0] x [0.0, 1.0], where (0, 0) is the top-left corner of the image, and (1, 1) is the bottom-right corner. @@ -92,7 +100,7 @@ Defaults to the center of the view. func ``` This callback is fired once this annotation is selected. Returns a Feature as the first param. -*signature:*`(payload:Feature) => void` +*signature:*`(payload:Feature) => void` @@ -102,7 +110,7 @@ This callback is fired once this annotation is selected. Returns a Feature as th func ``` This callback is fired once this annotation is deselected. -*signature:*`(payload:Feature) => void` +*signature:*`(payload:Feature) => void` @@ -112,7 +120,7 @@ This callback is fired once this annotation is deselected. func ``` This callback is fired once this annotation has started being dragged. -*signature:*`(payload:Feature) => void` +*signature:*`(payload:Feature) => void` @@ -122,7 +130,7 @@ This callback is fired once this annotation has started being dragged. func ``` This callback is fired once this annotation has stopped being dragged. -*signature:*`(payload:Feature) => void` +*signature:*`(payload:Feature) => void` @@ -132,7 +140,7 @@ This callback is fired once this annotation has stopped being dragged. func ``` This callback is fired while this annotation is being dragged. -*signature:*`(payload:Feature) => void` +*signature:*`(payload:Feature) => void` diff --git a/docs/RasterDemSource.md b/docs/RasterDemSource.md index d5f5fa2d69..e438daf0e0 100644 --- a/docs/RasterDemSource.md +++ b/docs/RasterDemSource.md @@ -1,9 +1,12 @@ + + ```tsx import { RasterDemSource } from '@rnmapbox/maps'; RasterDemSource + ``` diff --git a/docs/RasterLayer.md b/docs/RasterLayer.md index e93a0f5343..c834ae4a11 100644 --- a/docs/RasterLayer.md +++ b/docs/RasterLayer.md @@ -1,9 +1,13 @@ + Mapbox spec: [raster](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#raster) + + ```tsx import { RasterLayer } from '@rnmapbox/maps'; RasterLayer + ``` @@ -137,15 +141,17 @@ ___ ### visibility Name: `visibility` -### Description +Mapbox spec: [visibility](https://docs.mapbox.com/style-spec/reference/layers/#layout-raster-visibility) + +#### 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.
@@ -156,42 +162,43 @@ ___ ### rasterOpacity Name: `rasterOpacity` -### Description +Mapbox spec: [raster-opacity](https://docs.mapbox.com/style-spec/reference/layers/#paint-raster-raster-opacity) + +#### 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 +### rasterOpacityTransition +Name: `rasterOpacityTransition` -`rasterOpacityTransition` - -### Description +#### Description 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}` @@ -200,39 +207,40 @@ ___ ### rasterHueRotate Name: `rasterHueRotate` -### Description +Mapbox spec: [raster-hue-rotate](https://docs.mapbox.com/style-spec/reference/layers/#paint-raster-raster-hue-rotate) + +#### Description Rotates hues around the color wheel. -### Type +#### Type `number` -### Default Value +#### Default Value `0` -### Units +#### Units `degrees` -### Expression +#### Expression Parameters: `zoom` ___ -### Name +### rasterHueRotateTransition +Name: `rasterHueRotateTransition` -`rasterHueRotateTransition` - -### Description +#### Description 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}` @@ -241,42 +249,43 @@ ___ ### rasterBrightnessMin Name: `rasterBrightnessMin` -### Description +Mapbox spec: [raster-brightness-min](https://docs.mapbox.com/style-spec/reference/layers/#paint-raster-raster-brightness-min) + +#### 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 +### rasterBrightnessMinTransition +Name: `rasterBrightnessMinTransition` -`rasterBrightnessMinTransition` - -### Description +#### Description 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}` @@ -285,42 +294,43 @@ ___ ### rasterBrightnessMax Name: `rasterBrightnessMax` -### Description +Mapbox spec: [raster-brightness-max](https://docs.mapbox.com/style-spec/reference/layers/#paint-raster-raster-brightness-max) + +#### 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 - -`rasterBrightnessMaxTransition` +### rasterBrightnessMaxTransition +Name: `rasterBrightnessMaxTransition` -### Description +#### Description 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}` @@ -329,42 +339,43 @@ ___ ### rasterSaturation Name: `rasterSaturation` -### Description +Mapbox spec: [raster-saturation](https://docs.mapbox.com/style-spec/reference/layers/#paint-raster-raster-saturation) + +#### 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 - -`rasterSaturationTransition` +### rasterSaturationTransition +Name: `rasterSaturationTransition` -### Description +#### Description 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}` @@ -373,42 +384,43 @@ ___ ### rasterContrast Name: `rasterContrast` -### Description +Mapbox spec: [raster-contrast](https://docs.mapbox.com/style-spec/reference/layers/#paint-raster-raster-contrast) + +#### 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 - -`rasterContrastTransition` +### rasterContrastTransition +Name: `rasterContrastTransition` -### Description +#### Description 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}` @@ -417,20 +429,22 @@ ___ ### rasterResampling Name: `rasterResampling` -### Description +Mapbox spec: [raster-resampling](https://docs.mapbox.com/style-spec/reference/layers/#paint-raster-raster-resampling) + +#### 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` @@ -439,22 +453,24 @@ ___ ### rasterFadeDuration Name: `rasterFadeDuration` -### Description +Mapbox spec: [raster-fade-duration](https://docs.mapbox.com/style-spec/reference/layers/#paint-raster-raster-fade-duration) + +#### 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 cb8bc5516e..acf9e899d3 100644 --- a/docs/RasterSource.md +++ b/docs/RasterSource.md @@ -1,9 +1,12 @@ + + ```tsx import { RasterSource } from '@rnmapbox/maps'; RasterSource + ``` 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 diff --git a/docs/ShapeSource.md b/docs/ShapeSource.md index 9e9554ada5..179e84f6e7 100644 --- a/docs/ShapeSource.md +++ b/docs/ShapeSource.md @@ -1,9 +1,12 @@ + + ```tsx import { ShapeSource } from '@rnmapbox/maps'; ShapeSource + ``` 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 @@ -158,13 +161,18 @@ if that layer has a higher z-index than another source layers @param {Object} event.coordinates - the coordinates of the click @param {Object} event.point - the point of the click @return void -*signature:*`(event:OnPressEvent) => void` - +*signature:*`(event:OnPressEvent) => void` +[Custom Icon](../examples/SymbolCircleLayer/CustomIcon) ### hitbox -TODO +```tsx +type Hitbox = { + width: number; /* `width` of hitbox */ + height: number; /* `height` of hitbox */ +} +``` Overrides the default touch hitbox(44x44 pixels) for the source layers @@ -234,7 +242,7 @@ const collection = await shapeSource.getClusterLeaves(clusterId, limit, offset); ``` -### getClusterChildren(feature) +[Earthquakes](../examples/SymbolCircleLayer/Earthquakes)### getClusterChildren(feature) Returns the FeatureCollection from the cluster (on the next zoom level). @@ -260,4 +268,4 @@ const collection = await shapeSource.getClusterChildren(clusterId); | `event` | `NativeSyntheticEvent` | `Yes` | undefined | - +[Custom Icon](../examples/SymbolCircleLayer/CustomIcon) diff --git a/docs/SkyLayer.md b/docs/SkyLayer.md index bed4469ad1..9403e24756 100644 --- a/docs/SkyLayer.md +++ b/docs/SkyLayer.md @@ -1,9 +1,13 @@ + Mapbox spec: [sky](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#sky) + + ```tsx import { SkyLayer } from '@rnmapbox/maps'; SkyLayer + ``` SkyLayer is a spherical dome around the map that is always rendered behind all other layers @@ -109,15 +113,17 @@ ___ ### visibility Name: `visibility` -### Description +Mapbox spec: [visibility](https://docs.mapbox.com/style-spec/reference/layers/#layout-sky-visibility) + +#### 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.
@@ -128,20 +134,22 @@ ___ ### skyType Name: `skyType` -### Description +Mapbox spec: [sky-type](https://docs.mapbox.com/style-spec/reference/layers/#paint-sky-sky-type) + +#### 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` @@ -150,23 +158,25 @@ ___ ### skyAtmosphereSun Name: `skyAtmosphereSun` -### Description +Mapbox spec: [sky-atmosphere-sun](https://docs.mapbox.com/style-spec/reference/layers/#paint-sky-sky-atmosphere-sun) + +#### 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` @@ -175,19 +185,21 @@ ___ ### skyAtmosphereSunIntensity Name: `skyAtmosphereSunIntensity` -### Description +Mapbox spec: [sky-atmosphere-sun-intensity](https://docs.mapbox.com/style-spec/reference/layers/#paint-sky-sky-atmosphere-sun-intensity) + +#### 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` @@ -196,25 +208,27 @@ ___ ### skyGradientCenter Name: `skyGradientCenter` -### Description +Mapbox spec: [sky-gradient-center](https://docs.mapbox.com/style-spec/reference/layers/#paint-sky-sky-gradient-center) + +#### 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` @@ -223,22 +237,24 @@ ___ ### skyGradientRadius Name: `skyGradientRadius` -### Description +Mapbox spec: [sky-gradient-radius](https://docs.mapbox.com/style-spec/reference/layers/#paint-sky-sky-gradient-radius) + +#### 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` @@ -247,16 +263,18 @@ ___ ### skyGradient Name: `skyGradient` -### Description +Mapbox spec: [sky-gradient](https://docs.mapbox.com/style-spec/reference/layers/#paint-sky-sky-gradient) + +#### 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` @@ -265,12 +283,14 @@ ___ ### skyAtmosphereHaloColor Name: `skyAtmosphereHaloColor` -### Description +Mapbox spec: [sky-atmosphere-halo-color](https://docs.mapbox.com/style-spec/reference/layers/#paint-sky-sky-atmosphere-halo-color) + +#### 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` @@ -280,12 +300,14 @@ ___ ### skyAtmosphereColor Name: `skyAtmosphereColor` -### Description +Mapbox spec: [sky-atmosphere-color](https://docs.mapbox.com/style-spec/reference/layers/#paint-sky-sky-atmosphere-color) + +#### 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` @@ -295,42 +317,43 @@ ___ ### skyOpacity Name: `skyOpacity` -### Description +Mapbox spec: [sky-opacity](https://docs.mapbox.com/style-spec/reference/layers/#paint-sky-sky-opacity) + +#### 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 - -`skyOpacityTransition` +### skyOpacityTransition +Name: `skyOpacityTransition` -### Description +#### Description 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 0fc54f851a..a03c10ce0c 100644 --- a/docs/Style.md +++ b/docs/Style.md @@ -1,9 +1,12 @@ + + ```tsx import { Style } from '@rnmapbox/maps'; Style + ``` 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. diff --git a/docs/StyleImport.md b/docs/StyleImport.md index ca9759f5d4..92e3eda9f3 100644 --- a/docs/StyleImport.md +++ b/docs/StyleImport.md @@ -1,9 +1,12 @@ + + ```tsx import { StyleImport } from '@rnmapbox/maps'; StyleImport + ``` Use StyleImport to set configuration options on the new standard style. **V11 only.** @@ -34,7 +37,11 @@ existing is now always required as true ### config -TODO +```tsx +type Config = { + [object Object]: string; /* FIX ME NO DESCRIPTION */ +} +``` _required_ config is a dictionary of configuration options for the style import. diff --git a/docs/SymbolLayer.md b/docs/SymbolLayer.md index e4831d559c..584a0c3073 100644 --- a/docs/SymbolLayer.md +++ b/docs/SymbolLayer.md @@ -1,9 +1,13 @@ + Mapbox spec: [symbol](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#symbol) + + ```tsx import { SymbolLayer } from '@rnmapbox/maps'; SymbolLayer + ``` SymbolLayer is a style layer that renders icon and text labels at points or along lines on the map. @@ -193,21 +197,23 @@ ___ ### symbolPlacement Name: `symbolPlacement` -### Description +Mapbox spec: [symbol-placement](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-symbol-placement) + +#### 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` @@ -216,22 +222,24 @@ ___ ### symbolSpacing Name: `symbolSpacing` -### Description +Mapbox spec: [symbol-spacing](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-symbol-spacing) + +#### Description Distance between two symbol anchors. -### Type +#### Type `number` -### Default Value +#### Default Value `250` -### Units +#### Units `pixels` -### Minimum +#### Minimum `1` -### Expression +#### Expression Parameters: `zoom` @@ -240,16 +248,18 @@ ___ ### symbolAvoidEdges Name: `symbolAvoidEdges` -### Description +Mapbox spec: [symbol-avoid-edges](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-symbol-avoid-edges) + +#### 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` @@ -258,14 +268,16 @@ ___ ### symbolSortKey Name: `symbolSortKey` -### Description +Mapbox spec: [symbol-sort-key](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-symbol-sort-key) + +#### 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` @@ -274,21 +286,23 @@ ___ ### symbolZOrder Name: `symbolZOrder` -### Description +Mapbox spec: [symbol-z-order](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-symbol-z-order) + +#### 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` @@ -297,19 +311,21 @@ ___ ### iconAllowOverlap Name: `iconAllowOverlap` -### Description +Mapbox spec: [icon-allow-overlap](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-icon-allow-overlap) + +#### 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` @@ -318,19 +334,21 @@ ___ ### iconIgnorePlacement Name: `iconIgnorePlacement` -### Description +Mapbox spec: [icon-ignore-placement](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-icon-ignore-placement) + +#### 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` @@ -339,19 +357,21 @@ ___ ### iconOptional Name: `iconOptional` -### Description +Mapbox spec: [icon-optional](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-icon-optional) + +#### 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` @@ -360,24 +380,26 @@ ___ ### iconRotationAlignment Name: `iconRotationAlignment` -### Description +Mapbox spec: [icon-rotation-alignment](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-icon-rotation-alignment) + +#### 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` @@ -386,25 +408,27 @@ ___ ### iconSize Name: `iconSize` -### Description +Mapbox spec: [icon-size](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-icon-size) + +#### 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` @@ -413,25 +437,27 @@ ___ ### iconTextFit Name: `iconTextFit` -### Description +Mapbox spec: [icon-text-fit](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-icon-text-fit) + +#### 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` @@ -440,22 +466,24 @@ ___ ### iconTextFitPadding Name: `iconTextFitPadding` -### Description +Mapbox spec: [icon-text-fit-padding](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-icon-text-fit-padding) + +#### 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` @@ -464,14 +492,16 @@ ___ ### iconImage Name: `iconImage` -### Description +Mapbox spec: [icon-image](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-icon-image) + +#### Description Name of image in sprite to use for drawing an image background. -### Type +#### Type `resolvedImage` -### Expression +#### Expression Parameters: `zoom, feature` @@ -480,22 +510,24 @@ ___ ### iconRotate Name: `iconRotate` -### Description +Mapbox spec: [icon-rotate](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-icon-rotate) + +#### Description Rotates the icon clockwise. -### Type +#### Type `number` -### Default Value +#### Default Value `0` -### Units +#### Units `degrees` -### Requires +#### Requires `iconImage` -### Expression +#### Expression Parameters: `zoom, feature` @@ -504,25 +536,27 @@ ___ ### iconPadding Name: `iconPadding` -### Description +Mapbox spec: [icon-padding](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-icon-padding) + +#### 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` @@ -531,19 +565,21 @@ ___ ### iconKeepUpright Name: `iconKeepUpright` -### Description +Mapbox spec: [icon-keep-upright](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-icon-keep-upright) + +#### 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` @@ -552,19 +588,21 @@ ___ ### iconOffset Name: `iconOffset` -### Description +Mapbox spec: [icon-offset](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-icon-offset) + +#### 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` @@ -573,15 +611,17 @@ ___ ### iconAnchor Name: `iconAnchor` -### Description +Mapbox spec: [icon-anchor](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-icon-anchor) + +#### 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.
@@ -593,10 +633,10 @@ 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` @@ -605,24 +645,26 @@ ___ ### iconPitchAlignment Name: `iconPitchAlignment` -### Description +Mapbox spec: [icon-pitch-alignment](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-icon-pitch-alignment) + +#### 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` @@ -631,24 +673,26 @@ ___ ### textPitchAlignment Name: `textPitchAlignment` -### Description +Mapbox spec: [text-pitch-alignment](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-pitch-alignment) + +#### 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` @@ -657,24 +701,26 @@ ___ ### textRotationAlignment Name: `textRotationAlignment` -### Description +Mapbox spec: [text-rotation-alignment](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-rotation-alignment) + +#### 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` @@ -683,16 +729,18 @@ ___ ### textField Name: `textField` -### Description +Mapbox spec: [text-field](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-field) + +#### 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` @@ -701,21 +749,23 @@ ___ ### textFont Name: `textFont` -### Description +Mapbox spec: [text-font](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-font) + +#### 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` @@ -724,25 +774,27 @@ ___ ### textSize Name: `textSize` -### Description +Mapbox spec: [text-size](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-size) + +#### 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` @@ -751,27 +803,29 @@ ___ ### textMaxWidth Name: `textMaxWidth` -### Description +Mapbox spec: [text-max-width](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-max-width) + +#### 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` @@ -780,22 +834,24 @@ ___ ### textLineHeight Name: `textLineHeight` -### Description +Mapbox spec: [text-line-height](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-line-height) + +#### 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` @@ -804,24 +860,26 @@ ___ ### textLetterSpacing Name: `textLetterSpacing` -### Description +Mapbox spec: [text-letter-spacing](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-letter-spacing) + +#### 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` @@ -830,27 +888,29 @@ ___ ### textJustify Name: `textJustify` -### Description +Mapbox spec: [text-justify](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-justify) + +#### 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` @@ -859,22 +919,24 @@ ___ ### textRadialOffset Name: `textRadialOffset` -### Description +Mapbox spec: [text-radial-offset](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-radial-offset) + +#### 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` @@ -883,17 +945,19 @@ ___ ### textVariableAnchor Name: `textVariableAnchor` -### Description +Mapbox spec: [text-variable-anchor](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-variable-anchor) + +#### 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` @@ -902,15 +966,17 @@ ___ ### textAnchor Name: `textAnchor` -### Description +Mapbox spec: [text-anchor](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-anchor) + +#### 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.
@@ -922,15 +988,15 @@ 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` @@ -939,22 +1005,24 @@ ___ ### textMaxAngle Name: `textMaxAngle` -### Description +Mapbox spec: [text-max-angle](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-max-angle) + +#### 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` @@ -963,17 +1031,19 @@ ___ ### textWritingMode Name: `textWritingMode` -### Description +Mapbox spec: [text-writing-mode](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-writing-mode) + +#### 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` @@ -982,22 +1052,24 @@ ___ ### textRotate Name: `textRotate` -### Description +Mapbox spec: [text-rotate](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-rotate) + +#### Description Rotates the text clockwise. -### Type +#### Type `number` -### Default Value +#### Default Value `0` -### Units +#### Units `degrees` -### Requires +#### Requires `textField` -### Expression +#### Expression Parameters: `zoom, feature` @@ -1006,25 +1078,27 @@ ___ ### textPadding Name: `textPadding` -### Description +Mapbox spec: [text-padding](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-padding) + +#### 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` @@ -1033,19 +1107,21 @@ ___ ### textKeepUpright Name: `textKeepUpright` -### Description +Mapbox spec: [text-keep-upright](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-keep-upright) + +#### 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` @@ -1054,24 +1130,26 @@ ___ ### textTransform Name: `textTransform` -### Description +Mapbox spec: [text-transform](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-transform) + +#### 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` @@ -1080,25 +1158,27 @@ ___ ### textOffset Name: `textOffset` -### Description +Mapbox spec: [text-offset](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-offset) + +#### 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` @@ -1107,19 +1187,21 @@ ___ ### textAllowOverlap Name: `textAllowOverlap` -### Description +Mapbox spec: [text-allow-overlap](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-allow-overlap) + +#### 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` @@ -1128,19 +1210,21 @@ ___ ### textIgnorePlacement Name: `textIgnorePlacement` -### Description +Mapbox spec: [text-ignore-placement](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-ignore-placement) + +#### 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` @@ -1149,19 +1233,21 @@ ___ ### textOptional Name: `textOptional` -### Description +Mapbox spec: [text-optional](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-text-optional) + +#### 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` @@ -1170,15 +1256,17 @@ ___ ### visibility Name: `visibility` -### Description +Mapbox spec: [visibility](https://docs.mapbox.com/style-spec/reference/layers/#layout-symbol-visibility) + +#### 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.
@@ -1189,45 +1277,46 @@ ___ ### iconOpacity Name: `iconOpacity` -### Description +Mapbox spec: [icon-opacity](https://docs.mapbox.com/style-spec/reference/layers/#paint-symbol-icon-opacity) + +#### 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 - -`iconOpacityTransition` +### iconOpacityTransition +Name: `iconOpacityTransition` -### Description +#### Description 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}` @@ -1236,39 +1325,40 @@ ___ ### iconColor Name: `iconColor` -### Description +Mapbox spec: [icon-color](https://docs.mapbox.com/style-spec/reference/layers/#paint-symbol-icon-color) + +#### Description The color of the icon. This can only be used with [SDF icons](https://docs.mapbox.com/help/troubleshooting/using-recolorable-images-in-mapbox-maps/). -### Type +#### Type `color` -### Default Value +#### Default Value `#000000` -### Requires +#### Requires `iconImage` -### Expression +#### Expression Parameters: `zoom, feature, feature-state` ___ -### Name +### iconColorTransition +Name: `iconColorTransition` -`iconColorTransition` - -### Description +#### Description 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}` @@ -1277,39 +1367,40 @@ ___ ### iconHaloColor Name: `iconHaloColor` -### Description +Mapbox spec: [icon-halo-color](https://docs.mapbox.com/style-spec/reference/layers/#paint-symbol-icon-halo-color) + +#### Description The color of the icon's halo. Icon halos can only be used with [SDF icons](https://docs.mapbox.com/help/troubleshooting/using-recolorable-images-in-mapbox-maps/). -### Type +#### Type `color` -### Default Value +#### Default Value `rgba(0, 0, 0, 0)` -### Requires +#### Requires `iconImage` -### Expression +#### Expression Parameters: `zoom, feature, feature-state` ___ -### Name +### iconHaloColorTransition +Name: `iconHaloColorTransition` -`iconHaloColorTransition` - -### Description +#### Description 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}` @@ -1318,45 +1409,46 @@ ___ ### iconHaloWidth Name: `iconHaloWidth` -### Description +Mapbox spec: [icon-halo-width](https://docs.mapbox.com/style-spec/reference/layers/#paint-symbol-icon-halo-width) + +#### 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 +### iconHaloWidthTransition +Name: `iconHaloWidthTransition` -`iconHaloWidthTransition` - -### Description +#### Description 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}` @@ -1365,45 +1457,46 @@ ___ ### iconHaloBlur Name: `iconHaloBlur` -### Description +Mapbox spec: [icon-halo-blur](https://docs.mapbox.com/style-spec/reference/layers/#paint-symbol-icon-halo-blur) + +#### 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 +### iconHaloBlurTransition +Name: `iconHaloBlurTransition` -`iconHaloBlurTransition` - -### Description +#### Description 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}` @@ -1412,42 +1505,43 @@ ___ ### iconTranslate Name: `iconTranslate` -### Description +Mapbox spec: [icon-translate](https://docs.mapbox.com/style-spec/reference/layers/#paint-symbol-icon-translate) + +#### 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 - -`iconTranslateTransition` +### iconTranslateTransition +Name: `iconTranslateTransition` -### Description +#### Description 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}` @@ -1456,23 +1550,25 @@ ___ ### iconTranslateAnchor Name: `iconTranslateAnchor` -### Description +Mapbox spec: [icon-translate-anchor](https://docs.mapbox.com/style-spec/reference/layers/#paint-symbol-icon-translate-anchor) + +#### 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` @@ -1481,45 +1577,46 @@ ___ ### textOpacity Name: `textOpacity` -### Description +Mapbox spec: [text-opacity](https://docs.mapbox.com/style-spec/reference/layers/#paint-symbol-text-opacity) + +#### 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 +### textOpacityTransition +Name: `textOpacityTransition` -`textOpacityTransition` - -### Description +#### Description 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}` @@ -1528,39 +1625,40 @@ ___ ### textColor Name: `textColor` -### Description +Mapbox spec: [text-color](https://docs.mapbox.com/style-spec/reference/layers/#paint-symbol-text-color) + +#### 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 +### textColorTransition +Name: `textColorTransition` -`textColorTransition` - -### Description +#### Description 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}` @@ -1569,39 +1667,40 @@ ___ ### textHaloColor Name: `textHaloColor` -### Description +Mapbox spec: [text-halo-color](https://docs.mapbox.com/style-spec/reference/layers/#paint-symbol-text-halo-color) + +#### 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 +### textHaloColorTransition +Name: `textHaloColorTransition` -`textHaloColorTransition` - -### Description +#### Description 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}` @@ -1610,45 +1709,46 @@ ___ ### textHaloWidth Name: `textHaloWidth` -### Description +Mapbox spec: [text-halo-width](https://docs.mapbox.com/style-spec/reference/layers/#paint-symbol-text-halo-width) + +#### 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 +### textHaloWidthTransition +Name: `textHaloWidthTransition` -`textHaloWidthTransition` - -### Description +#### Description 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}` @@ -1657,45 +1757,46 @@ ___ ### textHaloBlur Name: `textHaloBlur` -### Description +Mapbox spec: [text-halo-blur](https://docs.mapbox.com/style-spec/reference/layers/#paint-symbol-text-halo-blur) + +#### 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 +### textHaloBlurTransition +Name: `textHaloBlurTransition` -`textHaloBlurTransition` - -### Description +#### Description 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}` @@ -1704,42 +1805,43 @@ ___ ### textTranslate Name: `textTranslate` -### Description +Mapbox spec: [text-translate](https://docs.mapbox.com/style-spec/reference/layers/#paint-symbol-text-translate) + +#### 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 +### textTranslateTransition +Name: `textTranslateTransition` -`textTranslateTransition` - -### Description +#### Description 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}` @@ -1748,23 +1850,25 @@ ___ ### textTranslateAnchor Name: `textTranslateAnchor` -### Description +Mapbox spec: [text-translate-anchor](https://docs.mapbox.com/style-spec/reference/layers/#paint-symbol-text-translate-anchor) + +#### 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 aadb5e7480..bfd9b08b16 100644 --- a/docs/Terrain.md +++ b/docs/Terrain.md @@ -1,9 +1,13 @@ + Mapbox spec: [terrain](https://docs.mapbox.com/mapbox-gl-js/style-spec/layers/#terrain) + + ```tsx import { Terrain } from '@rnmapbox/maps'; Terrain + ``` @@ -53,10 +57,12 @@ ___ ### source Name: `source` -### Description +Mapbox spec: [source](https://docs.mapbox.com/style-spec/reference/layers/#source) + +#### Description Name of a source of `raster_dem` type to be used for terrain elevation. -### Type +#### Type `string` @@ -66,45 +72,46 @@ ___ ### exaggeration Name: `exaggeration` -### Description +Mapbox spec: [exaggeration](https://docs.mapbox.com/style-spec/reference/layers/#exaggeration) + +#### Description Exaggerates the elevation of the terrain by multiplying the data from the DEM with this value. -### Type +#### Type `number` -### Default Value +#### Default Value `1` -### Minimum +#### Minimum `0` -### Maximum +#### Maximum `1000` -### Requires +#### Requires `source` -### Expression +#### Expression Parameters: `zoom` ___ -### Name - -`exaggerationTransition` +### exaggerationTransition +Name: `exaggerationTransition` -### Description +#### Description The transition affecting any changes to this layer’s exaggeration property. -### Type +#### Type `{ duration, delay }` -### Units +#### Units `milliseconds` -### Default Value +#### Default Value `{duration: 300, delay: 0}` diff --git a/docs/UserLocation.md b/docs/UserLocation.md index e93a257ce2..36990cd53d 100644 --- a/docs/UserLocation.md +++ b/docs/UserLocation.md @@ -1,9 +1,12 @@ + + ```tsx import { UserLocation } from '@rnmapbox/maps'; UserLocation + ``` @@ -52,7 +55,7 @@ number Minimum amount of movement before GPS location is updated in meters _defaults to:_ `0` - +[Set Displacement](../examples/UserLocation/SetDisplacement) ### onPress @@ -60,7 +63,7 @@ Minimum amount of movement before GPS location is updated in meters func ``` Callback that is triggered on location icon press -*signature:*`() => void` +*signature:*`() => void` @@ -70,9 +73,9 @@ Callback that is triggered on location icon press func ``` Callback that is triggered on location update -*signature:*`(location:Location) => void` - +*signature:*`(location:Location) => void` +[User Location Updates](../examples/UserLocation/UserLocationUpdates) ### renderMode @@ -82,7 +85,7 @@ UserLocationRenderMode Which render mode to use. _defaults to:_ `UserLocationRenderMode.Normal` - +[User Location Render Mode](../examples/UserLocation/UserLocationRenderMode) ### requestsAlwaysUse @@ -114,7 +117,7 @@ boolean Whether location icon is visible _defaults to:_ `true` - +[User Location Render Mode](../examples/UserLocation/UserLocationRenderMode) diff --git a/docs/VectorSource.md b/docs/VectorSource.md index 8a4bfb9af5..34f5c24d71 100644 --- a/docs/VectorSource.md +++ b/docs/VectorSource.md @@ -1,9 +1,12 @@ + + ```tsx import { VectorSource } from '@rnmapbox/maps'; VectorSource + ``` 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. @@ -102,13 +105,18 @@ if that layer has a higher z-index than another source layers @param {Object[]} event.features - the geojson features that have hit by the press (might be multiple) @param {Object} event.coordinates - the coordinates of the click @param {Object} event.point - the point of the click -*signature:*`(event:OnPressEvent) => void` +*signature:*`(event:OnPressEvent) => void` ### hitbox -TODO +```tsx +type Hitbox = { + width: number; /* `width` of hitbox */ + height: number; /* `height` of hitbox */ +} +``` Overrides the default touch hitbox(44x44 pixels) for the source layers diff --git a/docs/coordinates.md b/docs/coordinates.md index ed6e819ec1..a7882e61bb 100644 --- a/docs/coordinates.md +++ b/docs/coordinates.md @@ -1,9 +1,12 @@ + + ```tsx import { coordinates } from '@rnmapbox/maps'; coordinates + ``` Coorinates sent by locationManager diff --git a/docs/docs.json b/docs/docs.json index ecc9d6be0c..a5e3b1e6a4 100644 --- a/docs/docs.json +++ b/docs/docs.json @@ -113,6 +113,7 @@ } ], "fileNameWithExt": "Annotation.tsx", + "relPath": "src/components/Annotation.tsx", "name": "Annotation" }, "Atmosphere": { @@ -129,7 +130,11 @@ } ], "fileNameWithExt": "Atmosphere.tsx", + "relPath": "src/components/Atmosphere.tsx", "name": "Atmosphere", + "mbx": { + "name": "atmosphere" + }, "styles": [ { "name": "range", @@ -151,7 +156,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "range", + "name": "range", + "namespace": null + } }, { "name": "color", @@ -168,7 +178,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "color", + "name": "color", + "namespace": null + } }, { "name": "highColor", @@ -185,7 +200,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "high-color", + "name": "high-color", + "namespace": null + } }, { "name": "spaceColor", @@ -214,7 +234,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "space-color", + "name": "space-color", + "namespace": null + } }, { "name": "horizonBlend", @@ -245,7 +270,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "horizon-blend", + "name": "horizon-blend", + "namespace": null + } }, { "name": "starIntensity", @@ -276,7 +306,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "star-intensity", + "name": "star-intensity", + "namespace": null + } } ] }, @@ -364,7 +399,11 @@ } ], "fileNameWithExt": "BackgroundLayer.tsx", + "relPath": "src/components/BackgroundLayer.tsx", "name": "BackgroundLayer", + "mbx": { + "name": "background" + }, "styles": [ { "name": "visibility", @@ -383,7 +422,12 @@ "description": "Whether this layer is displayed.", "requires": [], "disabledBy": [], - "allowedFunctionTypes": [] + "allowedFunctionTypes": [], + "mbx": { + "fullName": "layout-background-visibility", + "name": "visibility", + "namespace": "layout" + } }, { "name": "backgroundColor", @@ -402,7 +446,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-background-background-color", + "name": "background-color", + "namespace": "paint" + } }, { "name": "backgroundPattern", @@ -418,7 +467,12 @@ "zoom" ] }, - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-background-background-pattern", + "name": "background-pattern", + "namespace": "paint" + } }, { "name": "backgroundOpacity", @@ -437,7 +491,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-background-background-opacity", + "name": "background-opacity", + "namespace": "paint" + } } ] }, @@ -490,10 +549,11 @@ } ], "fileNameWithExt": "Callout.tsx", + "relPath": "src/components/Callout.tsx", "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```tsx\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<Camera>(null);\n\nuseEffect(() => {\n camera.current?.setCamera({\n centerCoordinate: [lon, lat],\n });\n}, []);\n\nreturn (\n \n);\n```", "displayName": "Camera", "methods": [ { @@ -829,6 +889,7 @@ } ], "fileNameWithExt": "Camera.tsx", + "relPath": "src/components/Camera.tsx", "name": "Camera" }, "CircleLayer": { @@ -915,7 +976,11 @@ } ], "fileNameWithExt": "CircleLayer.tsx", + "relPath": "src/components/CircleLayer.tsx", "name": "CircleLayer", + "mbx": { + "name": "circle" + }, "styles": [ { "name": "circleSortKey", @@ -931,6 +996,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-circle-circle-sort-key", + "name": "circle-sort-key", + "namespace": "layout" } }, { @@ -950,7 +1020,12 @@ "description": "Whether this layer is displayed.", "requires": [], "disabledBy": [], - "allowedFunctionTypes": [] + "allowedFunctionTypes": [], + "mbx": { + "fullName": "layout-circle-visibility", + "name": "visibility", + "namespace": "layout" + } }, { "name": "circleRadius", @@ -971,7 +1046,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-circle-circle-radius", + "name": "circle-radius", + "namespace": "paint" + } }, { "name": "circleColor", @@ -990,7 +1070,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-circle-circle-color", + "name": "circle-color", + "namespace": "paint" + } }, { "name": "circleBlur", @@ -1009,7 +1094,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-circle-circle-blur", + "name": "circle-blur", + "namespace": "paint" + } }, { "name": "circleOpacity", @@ -1030,7 +1120,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-circle-circle-opacity", + "name": "circle-opacity", + "namespace": "paint" + } }, { "name": "circleTranslate", @@ -1051,7 +1146,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-circle-circle-translate", + "name": "circle-translate", + "namespace": "paint" + } }, { "name": "circleTranslateAnchor", @@ -1078,6 +1178,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "paint-circle-circle-translate-anchor", + "name": "circle-translate-anchor", + "namespace": "paint" } }, { @@ -1103,6 +1208,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "paint-circle-circle-pitch-scale", + "name": "circle-pitch-scale", + "namespace": "paint" } }, { @@ -1128,6 +1238,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "paint-circle-circle-pitch-alignment", + "name": "circle-pitch-alignment", + "namespace": "paint" } }, { @@ -1149,7 +1264,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-circle-circle-stroke-width", + "name": "circle-stroke-width", + "namespace": "paint" + } }, { "name": "circleStrokeColor", @@ -1168,7 +1288,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-circle-circle-stroke-color", + "name": "circle-stroke-color", + "namespace": "paint" + } }, { "name": "circleStrokeOpacity", @@ -1189,7 +1314,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-circle-circle-stroke-opacity", + "name": "circle-stroke-opacity", + "namespace": "paint" + } } ] }, @@ -1277,7 +1407,11 @@ } ], "fileNameWithExt": "FillExtrusionLayer.tsx", + "relPath": "src/components/FillExtrusionLayer.tsx", "name": "FillExtrusionLayer", + "mbx": { + "name": "fill-extrusion" + }, "styles": [ { "name": "visibility", @@ -1296,7 +1430,12 @@ "description": "Whether this layer is displayed.", "requires": [], "disabledBy": [], - "allowedFunctionTypes": [] + "allowedFunctionTypes": [], + "mbx": { + "fullName": "layout-fill-extrusion-visibility", + "name": "visibility", + "namespace": "layout" + } }, { "name": "fillExtrusionOpacity", @@ -1315,7 +1454,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-fill-extrusion-fill-extrusion-opacity", + "name": "fill-extrusion-opacity", + "namespace": "paint" + } }, { "name": "fillExtrusionColor", @@ -1336,7 +1480,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-fill-extrusion-fill-extrusion-color", + "name": "fill-extrusion-color", + "namespace": "paint" + } }, { "name": "fillExtrusionTranslate", @@ -1357,7 +1506,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-fill-extrusion-fill-extrusion-translate", + "name": "fill-extrusion-translate", + "namespace": "paint" + } }, { "name": "fillExtrusionTranslateAnchor", @@ -1384,6 +1538,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "paint-fill-extrusion-fill-extrusion-translate-anchor", + "name": "fill-extrusion-translate-anchor", + "namespace": "paint" } }, { @@ -1401,7 +1560,12 @@ "feature" ] }, - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-fill-extrusion-fill-extrusion-pattern", + "name": "fill-extrusion-pattern", + "namespace": "paint" + } }, { "name": "fillExtrusionHeight", @@ -1422,7 +1586,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-fill-extrusion-fill-extrusion-height", + "name": "fill-extrusion-height", + "namespace": "paint" + } }, { "name": "fillExtrusionBase", @@ -1445,7 +1614,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-fill-extrusion-fill-extrusion-base", + "name": "fill-extrusion-base", + "namespace": "paint" + } }, { "name": "fillExtrusionVerticalGradient", @@ -1462,7 +1636,12 @@ "zoom" ] }, - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-fill-extrusion-fill-extrusion-vertical-gradient", + "name": "fill-extrusion-vertical-gradient", + "namespace": "paint" + } } ] }, @@ -1550,7 +1729,11 @@ } ], "fileNameWithExt": "FillLayer.tsx", + "relPath": "src/components/FillLayer.tsx", "name": "FillLayer", + "mbx": { + "name": "fill" + }, "styles": [ { "name": "fillSortKey", @@ -1566,6 +1749,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-fill-fill-sort-key", + "name": "fill-sort-key", + "namespace": "layout" } }, { @@ -1585,7 +1773,12 @@ "description": "Whether this layer is displayed.", "requires": [], "disabledBy": [], - "allowedFunctionTypes": [] + "allowedFunctionTypes": [], + "mbx": { + "fullName": "layout-fill-visibility", + "name": "visibility", + "namespace": "layout" + } }, { "name": "fillAntialias", @@ -1601,6 +1794,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "paint-fill-fill-antialias", + "name": "fill-antialias", + "namespace": "paint" } }, { @@ -1622,7 +1820,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-fill-fill-opacity", + "name": "fill-opacity", + "namespace": "paint" + } }, { "name": "fillColor", @@ -1643,7 +1846,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-fill-fill-color", + "name": "fill-color", + "namespace": "paint" + } }, { "name": "fillOutlineColor", @@ -1663,7 +1871,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-fill-fill-outline-color", + "name": "fill-outline-color", + "namespace": "paint" + } }, { "name": "fillTranslate", @@ -1684,7 +1897,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-fill-fill-translate", + "name": "fill-translate", + "namespace": "paint" + } }, { "name": "fillTranslateAnchor", @@ -1711,6 +1929,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "paint-fill-fill-translate-anchor", + "name": "fill-translate-anchor", + "namespace": "paint" } }, { @@ -1728,7 +1951,12 @@ "feature" ] }, - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-fill-fill-pattern", + "name": "fill-pattern", + "namespace": "paint" + } } ] }, @@ -1746,6 +1974,7 @@ } ], "fileNameWithExt": "HeadingIndicator.tsx", + "relPath": "src/components/HeadingIndicator.tsx", "name": "HeadingIndicator" }, "HeatmapLayer": { @@ -1832,7 +2061,11 @@ } ], "fileNameWithExt": "HeatmapLayer.tsx", + "relPath": "src/components/HeatmapLayer.tsx", "name": "HeatmapLayer", + "mbx": { + "name": "heatmap" + }, "styles": [ { "name": "visibility", @@ -1851,7 +2084,12 @@ "description": "Whether this layer is displayed.", "requires": [], "disabledBy": [], - "allowedFunctionTypes": [] + "allowedFunctionTypes": [], + "mbx": { + "fullName": "layout-heatmap-visibility", + "name": "visibility", + "namespace": "layout" + } }, { "name": "heatmapRadius", @@ -1872,7 +2110,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-heatmap-heatmap-radius", + "name": "heatmap-radius", + "namespace": "paint" + } }, { "name": "heatmapWeight", @@ -1892,7 +2135,12 @@ "feature-state" ] }, - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-heatmap-heatmap-weight", + "name": "heatmap-weight", + "namespace": "paint" + } }, { "name": "heatmapIntensity", @@ -1910,7 +2158,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-heatmap-heatmap-intensity", + "name": "heatmap-intensity", + "namespace": "paint" + } }, { "name": "heatmapColor", @@ -1947,7 +2200,12 @@ "heatmap-density" ] }, - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-heatmap-heatmap-color", + "name": "heatmap-color", + "namespace": "paint" + } }, { "name": "heatmapOpacity", @@ -1966,7 +2224,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-heatmap-heatmap-opacity", + "name": "heatmap-opacity", + "namespace": "paint" + } } ] }, @@ -2026,6 +2289,7 @@ } ], "fileNameWithExt": "Image.tsx", + "relPath": "src/components/Image.tsx", "name": "Image" }, "ImageSource": { @@ -2070,6 +2334,7 @@ } ], "fileNameWithExt": "ImageSource.tsx", + "relPath": "src/components/ImageSource.tsx", "name": "ImageSource" }, "Images": { @@ -2130,6 +2395,7 @@ } ], "fileNameWithExt": "Images.tsx", + "relPath": "src/components/Images.tsx", "name": "Images" }, "Light": { @@ -2145,7 +2411,11 @@ } ], "fileNameWithExt": "Light.tsx", + "relPath": "src/components/Light.tsx", "name": "Light", + "mbx": { + "name": "light" + }, "styles": [ { "name": "anchor", @@ -2171,7 +2441,12 @@ "zoom" ] }, - "transition": false + "transition": false, + "mbx": { + "fullName": "anchor", + "name": "anchor", + "namespace": null + } }, { "name": "position", @@ -2192,7 +2467,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "position", + "name": "position", + "namespace": null + } }, { "name": "color", @@ -2209,7 +2489,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "color", + "name": "color", + "namespace": null + } }, { "name": "intensity", @@ -2228,7 +2513,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "intensity", + "name": "intensity", + "namespace": null + } } ] }, @@ -2316,7 +2606,11 @@ } ], "fileNameWithExt": "LineLayer.tsx", + "relPath": "src/components/LineLayer.tsx", "name": "LineLayer", + "mbx": { + "name": "line" + }, "styles": [ { "name": "lineCap", @@ -2346,6 +2640,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-line-line-cap", + "name": "line-cap", + "namespace": "layout" } }, { @@ -2378,6 +2677,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-line-line-join", + "name": "line-join", + "namespace": "layout" } }, { @@ -2394,6 +2698,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-line-line-miter-limit", + "name": "line-miter-limit", + "namespace": "layout" } }, { @@ -2410,6 +2719,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-line-line-round-limit", + "name": "line-round-limit", + "namespace": "layout" } }, { @@ -2426,6 +2740,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-line-line-sort-key", + "name": "line-sort-key", + "namespace": "layout" } }, { @@ -2445,7 +2764,12 @@ "description": "Whether this layer is displayed.", "requires": [], "disabledBy": [], - "allowedFunctionTypes": [] + "allowedFunctionTypes": [], + "mbx": { + "fullName": "layout-line-visibility", + "name": "visibility", + "namespace": "layout" + } }, { "name": "lineOpacity", @@ -2466,7 +2790,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-line-line-opacity", + "name": "line-opacity", + "namespace": "paint" + } }, { "name": "lineColor", @@ -2487,7 +2816,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-line-line-color", + "name": "line-color", + "namespace": "paint" + } }, { "name": "lineTranslate", @@ -2508,7 +2842,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-line-line-translate", + "name": "line-translate", + "namespace": "paint" + } }, { "name": "lineTranslateAnchor", @@ -2535,6 +2874,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "paint-line-line-translate-anchor", + "name": "line-translate-anchor", + "namespace": "paint" } }, { @@ -2558,7 +2902,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-line-line-width", + "name": "line-width", + "namespace": "paint" + } }, { "name": "lineGapWidth", @@ -2579,7 +2928,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-line-line-gap-width", + "name": "line-gap-width", + "namespace": "paint" + } }, { "name": "lineOffset", @@ -2599,7 +2953,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-line-line-offset", + "name": "line-offset", + "namespace": "paint" + } }, { "name": "lineBlur", @@ -2620,7 +2979,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-line-line-blur", + "name": "line-blur", + "namespace": "paint" + } }, { "name": "lineDasharray", @@ -2641,7 +3005,12 @@ "feature" ] }, - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-line-line-dasharray", + "name": "line-dasharray", + "namespace": "paint" + } }, { "name": "linePattern", @@ -2658,7 +3027,12 @@ "feature" ] }, - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-line-line-pattern", + "name": "line-pattern", + "namespace": "paint" + } }, { "name": "lineGradient", @@ -2676,7 +3050,12 @@ "line-progress" ] }, - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-line-line-gradient", + "name": "line-gradient", + "namespace": "paint" + } }, { "name": "lineTrimOffset", @@ -2698,7 +3077,12 @@ "requires": [], "disabledBy": [], "allowedFunctionTypes": [], - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-line-line-trim-offset", + "name": "line-trim-offset", + "namespace": "paint" + } } ] }, @@ -2723,7 +3107,6 @@ } ], "returns": { - "description": null, "type": { "name": "Promise", "elements": [ @@ -2756,7 +3139,6 @@ } ], "returns": { - "description": null, "type": { "name": "Promise", "elements": [ @@ -2780,7 +3162,6 @@ ], "params": [], "returns": { - "description": null, "type": { "name": "Promise", "elements": [ @@ -2838,7 +3219,6 @@ } ], "returns": { - "description": null, "type": { "name": "Promise", "elements": [ @@ -2896,7 +3276,6 @@ } ], "returns": { - "description": null, "type": { "name": "Promise", "elements": [ @@ -2954,7 +3333,6 @@ } ], "returns": { - "description": null, "type": { "name": "Promise", "elements": [ @@ -2996,7 +3374,6 @@ } ], "returns": { - "description": null, "type": { "name": "Promise", "elements": [ @@ -3018,7 +3395,6 @@ ], "params": [], "returns": { - "description": null, "type": { "name": "Promise", "elements": [ @@ -3096,7 +3472,6 @@ } ], "returns": { - "description": null, "type": { "name": "Promise", "elements": [ @@ -3556,6 +3931,7 @@ } ], "fileNameWithExt": "MapView.tsx", + "relPath": "src/components/MapView.tsx", "name": "MapView" }, "MarkerView": { @@ -3618,6 +3994,7 @@ } ], "fileNameWithExt": "MarkerView.tsx", + "relPath": "src/components/MarkerView.tsx", "name": "MarkerView" }, "NativeUserLocation": { @@ -3641,6 +4018,7 @@ } ], "fileNameWithExt": "NativeUserLocation.tsx", + "relPath": "src/components/NativeUserLocation.tsx", "name": "NativeUserLocation" }, "PointAnnotation": { @@ -3791,6 +4169,7 @@ } ], "fileNameWithExt": "PointAnnotation.tsx", + "relPath": "src/components/PointAnnotation.tsx", "name": "PointAnnotation" }, "RasterDemSource": { @@ -3856,6 +4235,7 @@ } ], "fileNameWithExt": "RasterDemSource.tsx", + "relPath": "src/components/RasterDemSource.tsx", "name": "RasterDemSource" }, "RasterLayer": { @@ -3942,7 +4322,11 @@ } ], "fileNameWithExt": "RasterLayer.tsx", + "relPath": "src/components/RasterLayer.tsx", "name": "RasterLayer", + "mbx": { + "name": "raster" + }, "styles": [ { "name": "visibility", @@ -3961,7 +4345,12 @@ "description": "Whether this layer is displayed.", "requires": [], "disabledBy": [], - "allowedFunctionTypes": [] + "allowedFunctionTypes": [], + "mbx": { + "fullName": "layout-raster-visibility", + "name": "visibility", + "namespace": "layout" + } }, { "name": "rasterOpacity", @@ -3980,7 +4369,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-raster-raster-opacity", + "name": "raster-opacity", + "namespace": "paint" + } }, { "name": "rasterHueRotate", @@ -3998,7 +4392,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-raster-raster-hue-rotate", + "name": "raster-hue-rotate", + "namespace": "paint" + } }, { "name": "rasterBrightnessMin", @@ -4017,7 +4416,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-raster-raster-brightness-min", + "name": "raster-brightness-min", + "namespace": "paint" + } }, { "name": "rasterBrightnessMax", @@ -4036,7 +4440,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-raster-raster-brightness-max", + "name": "raster-brightness-max", + "namespace": "paint" + } }, { "name": "rasterSaturation", @@ -4055,7 +4464,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-raster-raster-saturation", + "name": "raster-saturation", + "namespace": "paint" + } }, { "name": "rasterContrast", @@ -4074,7 +4488,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-raster-raster-contrast", + "name": "raster-contrast", + "namespace": "paint" + } }, { "name": "rasterResampling", @@ -4099,6 +4518,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "paint-raster-raster-resampling", + "name": "raster-resampling", + "namespace": "paint" } }, { @@ -4118,7 +4542,12 @@ "zoom" ] }, - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-raster-raster-fade-duration", + "name": "raster-fade-duration", + "namespace": "paint" + } } ] }, @@ -4199,6 +4628,7 @@ } ], "fileNameWithExt": "RasterSource.tsx", + "relPath": "src/components/RasterSource.tsx", "name": "RasterSource" }, "ShapeSource": { @@ -4222,7 +4652,6 @@ } ], "returns": { - "description": null, "type": { "name": "FeatureCollection" } @@ -4249,7 +4678,6 @@ } ], "returns": { - "description": null, "type": { "name": "Promise", "elements": [ @@ -4298,7 +4726,6 @@ } ], "returns": { - "description": null, "type": { "name": "FeatureCollection" } @@ -4325,7 +4752,6 @@ } ], "returns": { - "description": null, "type": { "name": "FeatureCollection" } @@ -4480,6 +4906,7 @@ } ], "fileNameWithExt": "ShapeSource.tsx", + "relPath": "src/components/ShapeSource.tsx", "name": "ShapeSource" }, "SkyLayer": { @@ -4545,7 +4972,11 @@ } ], "fileNameWithExt": "SkyLayer.tsx", + "relPath": "src/components/SkyLayer.tsx", "name": "SkyLayer", + "mbx": { + "name": "sky" + }, "styles": [ { "name": "visibility", @@ -4564,7 +4995,12 @@ "description": "Whether this layer is displayed.", "requires": [], "disabledBy": [], - "allowedFunctionTypes": [] + "allowedFunctionTypes": [], + "mbx": { + "fullName": "layout-sky-visibility", + "name": "visibility", + "namespace": "layout" + } }, { "name": "skyType", @@ -4589,6 +5025,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "paint-sky-sky-type", + "name": "sky-type", + "namespace": "paint" } }, { @@ -4614,7 +5055,12 @@ "zoom" ] }, - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-sky-sky-atmosphere-sun", + "name": "sky-atmosphere-sun", + "namespace": "paint" + } }, { "name": "skyAtmosphereSunIntensity", @@ -4627,7 +5073,12 @@ "requires": [], "disabledBy": [], "allowedFunctionTypes": [], - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-sky-sky-atmosphere-sun-intensity", + "name": "sky-atmosphere-sun-intensity", + "namespace": "paint" + } }, { "name": "skyGradientCenter", @@ -4656,7 +5107,12 @@ "zoom" ] }, - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-sky-sky-gradient-center", + "name": "sky-gradient-center", + "namespace": "paint" + } }, { "name": "skyGradientRadius", @@ -4675,7 +5131,12 @@ "zoom" ] }, - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-sky-sky-gradient-radius", + "name": "sky-gradient-radius", + "namespace": "paint" + } }, { "name": "skyGradient", @@ -4704,7 +5165,12 @@ "sky-radial-progress" ] }, - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-sky-sky-gradient", + "name": "sky-gradient", + "namespace": "paint" + } }, { "name": "skyAtmosphereHaloColor", @@ -4715,7 +5181,12 @@ "requires": [], "disabledBy": [], "allowedFunctionTypes": [], - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-sky-sky-atmosphere-halo-color", + "name": "sky-atmosphere-halo-color", + "namespace": "paint" + } }, { "name": "skyAtmosphereColor", @@ -4726,7 +5197,12 @@ "requires": [], "disabledBy": [], "allowedFunctionTypes": [], - "transition": false + "transition": false, + "mbx": { + "fullName": "paint-sky-sky-atmosphere-color", + "name": "sky-atmosphere-color", + "namespace": "paint" + } }, { "name": "skyOpacity", @@ -4745,7 +5221,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-sky-sky-opacity", + "name": "sky-opacity", + "namespace": "paint" + } } ] }, @@ -4763,6 +5244,7 @@ } ], "fileNameWithExt": "Style.tsx", + "relPath": "src/components/Style.tsx", "name": "Style" }, "StyleImport": { @@ -4805,6 +5287,7 @@ } ], "fileNameWithExt": "StyleImport.tsx", + "relPath": "src/components/StyleImport.tsx", "name": "StyleImport" }, "SymbolLayer": { @@ -4898,7 +5381,11 @@ } ], "fileNameWithExt": "SymbolLayer.tsx", + "relPath": "src/components/SymbolLayer.tsx", "name": "SymbolLayer", + "mbx": { + "name": "symbol" + }, "styles": [ { "name": "symbolPlacement", @@ -4927,6 +5414,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-symbol-placement", + "name": "symbol-placement", + "namespace": "layout" } }, { @@ -4945,6 +5437,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-symbol-spacing", + "name": "symbol-spacing", + "namespace": "layout" } }, { @@ -4961,6 +5458,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-symbol-avoid-edges", + "name": "symbol-avoid-edges", + "namespace": "layout" } }, { @@ -4977,6 +5479,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-symbol-sort-key", + "name": "symbol-sort-key", + "namespace": "layout" } }, { @@ -5006,6 +5513,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-symbol-z-order", + "name": "symbol-z-order", + "namespace": "layout" } }, { @@ -5024,6 +5536,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-icon-allow-overlap", + "name": "icon-allow-overlap", + "namespace": "layout" } }, { @@ -5042,6 +5559,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-icon-ignore-placement", + "name": "icon-ignore-placement", + "namespace": "layout" } }, { @@ -5061,6 +5583,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-icon-optional", + "name": "icon-optional", + "namespace": "layout" } }, { @@ -5092,6 +5619,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-icon-rotation-alignment", + "name": "icon-rotation-alignment", + "namespace": "layout" } }, { @@ -5113,6 +5645,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-icon-size", + "name": "icon-size", + "namespace": "layout" } }, { @@ -5149,6 +5686,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-icon-text-fit", + "name": "icon-text-fit", + "namespace": "layout" } }, { @@ -5174,6 +5716,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-icon-text-fit-padding", + "name": "icon-text-fit-padding", + "namespace": "layout" } }, { @@ -5190,6 +5737,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-icon-image", + "name": "icon-image", + "namespace": "layout" } }, { @@ -5210,6 +5762,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-icon-rotate", + "name": "icon-rotate", + "namespace": "layout" } }, { @@ -5230,6 +5787,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-icon-padding", + "name": "icon-padding", + "namespace": "layout" } }, { @@ -5248,6 +5810,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-icon-keep-upright", + "name": "icon-keep-upright", + "namespace": "layout" } }, { @@ -5270,6 +5837,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-icon-offset", + "name": "icon-offset", + "namespace": "layout" } }, { @@ -5326,6 +5898,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-icon-anchor", + "name": "icon-anchor", + "namespace": "layout" } }, { @@ -5357,6 +5934,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-icon-pitch-alignment", + "name": "icon-pitch-alignment", + "namespace": "layout" } }, { @@ -5388,6 +5970,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-text-pitch-alignment", + "name": "text-pitch-alignment", + "namespace": "layout" } }, { @@ -5419,6 +6006,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-text-rotation-alignment", + "name": "text-rotation-alignment", + "namespace": "layout" } }, { @@ -5436,6 +6028,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-text-field", + "name": "text-field", + "namespace": "layout" } }, { @@ -5460,6 +6057,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-text-font", + "name": "text-font", + "namespace": "layout" } }, { @@ -5481,6 +6083,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-text-size", + "name": "text-size", + "namespace": "layout" } }, { @@ -5504,6 +6111,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-text-max-width", + "name": "text-max-width", + "namespace": "layout" } }, { @@ -5524,6 +6136,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-text-line-height", + "name": "text-line-height", + "namespace": "layout" } }, { @@ -5546,6 +6163,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-text-letter-spacing", + "name": "text-letter-spacing", + "namespace": "layout" } }, { @@ -5584,6 +6206,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-text-justify", + "name": "text-justify", + "namespace": "layout" } }, { @@ -5604,6 +6231,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-text-radial-offset", + "name": "text-radial-offset", + "namespace": "layout" } }, { @@ -5621,6 +6253,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-text-variable-anchor", + "name": "text-variable-anchor", + "namespace": "layout" } }, { @@ -5681,6 +6318,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-text-anchor", + "name": "text-anchor", + "namespace": "layout" } }, { @@ -5700,6 +6342,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-text-max-angle", + "name": "text-max-angle", + "namespace": "layout" } }, { @@ -5717,6 +6364,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-text-writing-mode", + "name": "text-writing-mode", + "namespace": "layout" } }, { @@ -5737,6 +6389,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-text-rotate", + "name": "text-rotate", + "namespace": "layout" } }, { @@ -5757,6 +6414,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-text-padding", + "name": "text-padding", + "namespace": "layout" } }, { @@ -5775,6 +6437,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-text-keep-upright", + "name": "text-keep-upright", + "namespace": "layout" } }, { @@ -5807,6 +6474,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-text-transform", + "name": "text-transform", + "namespace": "layout" } }, { @@ -5832,6 +6504,11 @@ "zoom", "feature" ] + }, + "mbx": { + "fullName": "layout-symbol-text-offset", + "name": "text-offset", + "namespace": "layout" } }, { @@ -5850,6 +6527,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-text-allow-overlap", + "name": "text-allow-overlap", + "namespace": "layout" } }, { @@ -5868,6 +6550,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-text-ignore-placement", + "name": "text-ignore-placement", + "namespace": "layout" } }, { @@ -5887,6 +6574,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "layout-symbol-text-optional", + "name": "text-optional", + "namespace": "layout" } }, { @@ -5906,7 +6598,12 @@ "description": "Whether this layer is displayed.", "requires": [], "disabledBy": [], - "allowedFunctionTypes": [] + "allowedFunctionTypes": [], + "mbx": { + "fullName": "layout-symbol-visibility", + "name": "visibility", + "namespace": "layout" + } }, { "name": "iconOpacity", @@ -5929,7 +6626,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-symbol-icon-opacity", + "name": "icon-opacity", + "namespace": "paint" + } }, { "name": "iconColor", @@ -5950,7 +6652,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-symbol-icon-color", + "name": "icon-color", + "namespace": "paint" + } }, { "name": "iconHaloColor", @@ -5971,7 +6678,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-symbol-icon-halo-color", + "name": "icon-halo-color", + "namespace": "paint" + } }, { "name": "iconHaloWidth", @@ -5994,7 +6706,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-symbol-icon-halo-width", + "name": "icon-halo-width", + "namespace": "paint" + } }, { "name": "iconHaloBlur", @@ -6017,7 +6734,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-symbol-icon-halo-blur", + "name": "icon-halo-blur", + "namespace": "paint" + } }, { "name": "iconTranslate", @@ -6040,7 +6762,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-symbol-icon-translate", + "name": "icon-translate", + "namespace": "paint" + } }, { "name": "iconTranslateAnchor", @@ -6068,6 +6795,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "paint-symbol-icon-translate-anchor", + "name": "icon-translate-anchor", + "namespace": "paint" } }, { @@ -6091,7 +6823,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-symbol-text-opacity", + "name": "text-opacity", + "namespace": "paint" + } }, { "name": "textColor", @@ -6112,7 +6849,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-symbol-text-color", + "name": "text-color", + "namespace": "paint" + } }, { "name": "textHaloColor", @@ -6133,7 +6875,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-symbol-text-halo-color", + "name": "text-halo-color", + "namespace": "paint" + } }, { "name": "textHaloWidth", @@ -6156,7 +6903,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-symbol-text-halo-width", + "name": "text-halo-width", + "namespace": "paint" + } }, { "name": "textHaloBlur", @@ -6179,7 +6931,12 @@ "feature-state" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-symbol-text-halo-blur", + "name": "text-halo-blur", + "namespace": "paint" + } }, { "name": "textTranslate", @@ -6202,7 +6959,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "paint-symbol-text-translate", + "name": "text-translate", + "namespace": "paint" + } }, { "name": "textTranslateAnchor", @@ -6230,6 +6992,11 @@ "parameters": [ "zoom" ] + }, + "mbx": { + "fullName": "paint-symbol-text-translate-anchor", + "name": "text-translate-anchor", + "namespace": "paint" } } ] @@ -6262,7 +7029,11 @@ } ], "fileNameWithExt": "Terrain.tsx", + "relPath": "src/components/Terrain.tsx", "name": "Terrain", + "mbx": { + "name": "terrain" + }, "styles": [ { "name": "source", @@ -6271,7 +7042,12 @@ "description": "Name of a source of `raster_dem` type to be used for terrain elevation.", "requires": [], "disabledBy": [], - "allowedFunctionTypes": [] + "allowedFunctionTypes": [], + "mbx": { + "fullName": "source", + "name": "source", + "namespace": null + } }, { "name": "exaggeration", @@ -6292,7 +7068,12 @@ "zoom" ] }, - "transition": true + "transition": true, + "mbx": { + "fullName": "exaggeration", + "name": "exaggeration", + "namespace": null + } } ] }, @@ -6316,7 +7097,6 @@ } ], "returns": { - "description": null, "type": { "name": "Promise", "elements": [ @@ -6335,7 +7115,6 @@ "modifiers": [], "params": [], "returns": { - "description": null, "type": { "name": "boolean" } @@ -6423,6 +7202,7 @@ } ], "fileNameWithExt": "UserLocation.tsx", + "relPath": "src/components/UserLocation.tsx", "name": "UserLocation" }, "VectorSource": { @@ -6454,7 +7234,6 @@ } ], "returns": { - "description": null, "type": { "name": "FeatureCollection" } @@ -6581,11 +7360,13 @@ } ], "fileNameWithExt": "VectorSource.tsx", + "relPath": "src/components/VectorSource.tsx", "name": "VectorSource" }, "coordinates": { "name": "coordinates", "fileNameWithExt": "locationManager.ts", + "relPath": "src/modules/location/locationManager.ts", "description": "Coorinates sent by locationManager", "props": [], "styles": [], @@ -6594,6 +7375,7 @@ "location": { "name": "location", "fileNameWithExt": "locationManager.ts", + "relPath": "src/modules/location/locationManager.ts", "description": "Location sent by locationManager", "props": [], "styles": [], @@ -6602,6 +7384,7 @@ "locationManager": { "name": "locationManager", "fileNameWithExt": "locationManager.ts", + "relPath": "src/modules/location/locationManager.ts", "description": "LocationManager is a singleton, see ", "props": [], "styles": [], @@ -6634,6 +7417,7 @@ "offlineManager": { "name": "offlineManager", "fileNameWithExt": "offlineManager.ts", + "relPath": "src/modules/offline/offlineManager.ts", "description": "OfflineManager implements a singleton (shared object) that manages offline packs.\nAll of this class’s instance methods are asynchronous, reflecting the fact that offline resources are stored in a database.\nThe shared object maintains a canonical collection of offline packs.", "props": [], "styles": [], @@ -6975,6 +7759,7 @@ "snapshotManager": { "name": "snapshotManager", "fileNameWithExt": "snapshotManager.ts", + "relPath": "src/modules/snapshot/snapshotManager.ts", "description": "The snapshotManager generates static raster images of the map.\nEach snapshot image depicts a portion of a map defined by an SnapshotOptions object you provide.\nThe snapshotter generates the snapshot asynchronous.", "props": [], "styles": [], diff --git a/docs/examples.json b/docs/examples.json index b385c901c0..9d6800e9bd 100644 --- a/docs/examples.json +++ b/docs/examples.json @@ -1,26 +1,166 @@ -{ - "V11": [ - { - "title": "Style Import Config", - "tags": [ - "StyleImport", - "v11" - ], - "docs": "\n# Style Import Config\n\nThis example shows how to change style import configs - v11 only.\n", - "name": "StyleImportConfig", - "fullPath": "./example/src/examples/V11/StyleImportConfig.tsx" - } - ], - "User_Location": [ - { - "title": "User Location Updates", - "tags": [ - "UserLocation", - "UserLocation#onUpdate" - ], - "docs": "Retrieves and shows location updates from UserLocation componen via the `onUpdate` callback", - "name": "UserLocationUpdates", - "fullPath": "./example/src/examples/UserLocation/UserLocationUpdates.tsx" - } - ] -} \ No newline at end of file +[ + { + "groupName": "SymbolCircleLayer", + "metadata": { + "title": "Symbol/CircleLayer" + }, + "examples": [ + { + "metadata": { + "title": "Custom Icon", + "tags": [ + "ShapeSource", + "ShapeSource#onPress", + "SymbolLayer", + "Images", + "SymbolLayer#iconImage" + ], + "docs": "\nRenders a symbol layer with custom icon defined using the Images component. Clicking a location on a map add a new icon.\n" + }, + "fullPath": "example/src/examples/SymbolCircleLayer/CustomIcon.tsx", + "relPath": "SymbolCircleLayer/CustomIcon.tsx", + "name": "CustomIcon" + }, + { + "metadata": { + "title": "Data driven circle colors", + "tags": [ + "VectorSource", + "CircleLayer", + "CircleLayer#circleRadius", + "CircleLayer#circleColor", + "expressions" + ], + "docs": "\nRenders circles with radius and color based on data-driven expressions.\n\nColor is based on the `ethnicity` property of the feature, radius is based on zoom level.\n" + }, + "fullPath": "example/src/examples/SymbolCircleLayer/DataDrivenCircleColors.js", + "relPath": "SymbolCircleLayer/DataDrivenCircleColors.js", + "name": "DataDrivenCircleColors" + }, + { + "metadata": { + "title": "Earthquakes", + "tags": [ + "ShapeSource", + "SymbolLayer", + "ShapeSource#getClusterLeaves", + "CircleLayer", + "CircleLayer#clusterProperties", + "expressions" + ], + "docs": "\nRenders earthqueke with clustering.\n\nClick a cluster to show list of contents in the cluster `getClusterLeaves`.\n" + }, + "fullPath": "example/src/examples/SymbolCircleLayer/Earthquakes.tsx", + "relPath": "SymbolCircleLayer/Earthquakes.tsx", + "name": "Earthquakes" + }, + { + "metadata": { + "title": "Scaleable images", + "tags": [ + "Images", + "Images#stretchX", + "Images#stretchY", + "Images#content" + ], + "docs": "\nDemonstates Scalable images.\n\nYou can use strachX, stretchY and content to scale a bitmap image - keep parts of it fixed while only scale specific parts.\n" + }, + "fullPath": "example/src/examples/SymbolCircleLayer/ScalableImages.tsx", + "relPath": "SymbolCircleLayer/ScalableImages.tsx", + "name": "ScalableImages" + }, + { + "metadata": { + "title": "Shape Source Icons", + "tags": [ + "ShapeSource", + "SymbolLayer", + "Images", + "Images#nativeAssetImages", + "Images#onImageMissing" + ], + "docs": "\nRender icons with various methods.\n\n* pin-rn: Rendered with a React Native View\n* pin: Rendered with a native asset image\n* pin3: Resolved as a result of onImageMissing\n* example: Rendered with a js asset image (require)\n\n" + }, + "fullPath": "example/src/examples/SymbolCircleLayer/ShapeSourceIcon.js", + "relPath": "SymbolCircleLayer/ShapeSourceIcon.js", + "name": "ShapeSourceIcon" + } + ] + }, + { + "groupName": "UserLocation", + "metadata": { + "title": "User Location" + }, + "examples": [ + { + "metadata": { + "title": "Set Displacement", + "tags": [ + "UserLocation", + "UserLocation#minDisplacement" + ], + "docs": "\nChange the minimum displacement required to update the user location.\n" + }, + "fullPath": "example/src/examples/UserLocation/SetDisplacement.js", + "relPath": "UserLocation/SetDisplacement.js", + "name": "SetDisplacement" + }, + { + "metadata": { + "title": "Set Tint Color", + "tags": [ + "MapView#tintColor" + ], + "docs": "\nChange the tint color of the map. This will change the color of the user location icon and the compass.\n" + }, + "fullPath": "example/src/examples/UserLocation/SetTintColor.js", + "relPath": "UserLocation/SetTintColor.js", + "name": "SetTintColor" + }, + { + "metadata": { + "title": "User Location Padding", + "tags": [ + "Images", + "Images#stretchX", + "Images#stretchY", + "Images#content" + ], + "docs": "\nDemonstates Scalable images.\n\nYou can use strachX, stretchY and content to scale a bitmap image - keep parts of it fixed while only scale specific parts.\n" + }, + "fullPath": "example/src/examples/UserLocation/UserLocationPadding.tsx", + "relPath": "UserLocation/UserLocationPadding.tsx", + "name": "UserLocationPadding" + }, + { + "metadata": { + "title": "User Location Render Mode", + "tags": [ + "UserLocation", + "UserLocation#renderMode", + "UserLocation#visible", + "UserLocation#onUserTrackingModeChange" + ], + "docs": "\nDemonstates UserLocation render modes, follow modes\n" + }, + "fullPath": "example/src/examples/UserLocation/UserLocationRenderMode.tsx", + "relPath": "UserLocation/UserLocationRenderMode.tsx", + "name": "UserLocationRenderMode" + }, + { + "metadata": { + "title": "User Location Updates", + "tags": [ + "UserLocation", + "UserLocation#onUpdate" + ], + "docs": "\nRetrieves and shows location updates from UserLocation componen via the `onUpdate` callback\n" + }, + "fullPath": "example/src/examples/UserLocation/UserLocationUpdates.tsx", + "relPath": "UserLocation/UserLocationUpdates.tsx", + "name": "UserLocationUpdates" + } + ] + } +] \ No newline at end of file diff --git a/docs/location.md b/docs/location.md index 4a14d156d0..7e2707a4b1 100644 --- a/docs/location.md +++ b/docs/location.md @@ -1,9 +1,12 @@ + + ```tsx import { location } from '@rnmapbox/maps'; location + ``` Location sent by locationManager diff --git a/docs/locationManager.md b/docs/locationManager.md index a5cd5baab5..8716f23d8e 100644 --- a/docs/locationManager.md +++ b/docs/locationManager.md @@ -1,9 +1,12 @@ + + ```tsx import { locationManager } from '@rnmapbox/maps'; locationManager + ``` LocationManager is a singleton, see diff --git a/docs/snapshotManager.md b/docs/snapshotManager.md index 6d88ef32ab..91ac03d024 100644 --- a/docs/snapshotManager.md +++ b/docs/snapshotManager.md @@ -1,9 +1,12 @@ + + ```tsx import { snapshotManager } from '@rnmapbox/maps'; snapshotManager + ``` 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. diff --git a/example/.detoxrc.js b/example/.detoxrc.js index e0fea96d84..207d4954dd 100644 --- a/example/.detoxrc.js +++ b/example/.detoxrc.js @@ -8,23 +8,35 @@ module.exports = { apps: { "ios": { type: "ios.app", - build: "xcodebuild -quiet -workspace ios/RNMapboxGLExample.xcworkspace -configuration Release -scheme RNMapboxGLExample -sdk iphonesimulator -derivedDataPath ios/build -destination 'platform=iOS Simulator,OS=16.4,name=iPhone 14'", + build: "xcodebuild -quiet -workspace ios/RNMapboxGLExample.xcworkspace -configuration Release -scheme RNMapboxGLExample -sdk iphonesimulator -derivedDataPath ios/build -destination 'platform=iOS Simulator,OS=16.4,name=iPhone SE (3rd generation)'", binaryPath: "ios/build/Build/Products/Release-iphonesimulator/RNMapboxGLExample.app" }, "ios.debug": { type: "ios.app", - build: "FORCE_BUNDLING=1 xcodebuild -quiet -workspace ios/RNMapboxGLExample.xcworkspace -configuration Debug -scheme RNMapboxGLExample DISABLE_MANUAL_TARGET_ORDER_BUILD_WARNING=1 GCC_PREPROCESSOR_DEFINITIONS='$GCC_PREPROCESSOR_DEFINITIONS DEBUG_RCT_BUNDLE=1' -sdk iphonesimulator -derivedDataPath ios/build -destination 'platform=iOS Simulator,OS=16.4,name=iPhone 14'", + build: "FORCE_BUNDLING=1 xcodebuild -quiet -workspace ios/RNMapboxGLExample.xcworkspace -configuration Debug -scheme RNMapboxGLExample DISABLE_MANUAL_TARGET_ORDER_BUILD_WARNING=1 GCC_PREPROCESSOR_DEFINITIONS='$GCC_PREPROCESSOR_DEFINITIONS DEBUG_RCT_BUNDLE=1' -sdk iphonesimulator -derivedDataPath ios/build -destination 'platform=iOS Simulator,OS=16.4,name=iPhone SE (3rd generation)'", binaryPath: "ios/build/Build/Products/Debug-iphonesimulator/RNMapboxGLExample.app" - } + }, + "ios.debug.ci": { + type: "ios.app", + build: "FORCE_BUNDLING=1 xcodebuild -quiet -workspace ios/RNMapboxGLExample.xcworkspace -configuration Debug -scheme RNMapboxGLExample DISABLE_MANUAL_TARGET_ORDER_BUILD_WARNING=1 GCC_PREPROCESSOR_DEFINITIONS='$GCC_PREPROCESSOR_DEFINITIONS DEBUG_RCT_BUNDLE=1' -sdk iphonesimulator -derivedDataPath ios/build -destination 'platform=iOS Simulator,OS=16.2,name=iPhone SE (3rd generation)'", + binaryPath: "ios/build/Build/Products/Debug-iphonesimulator/RNMapboxGLExample.app" + }, }, devices: { simulator: { type: "ios.simulator", device: { - type: "iPhone 14", + type: "iPhone 14 Pro", os: "16.4" } - } + }, + "simulator.ci": { + type: "ios.simulator", + device: { + type: "iPhone SE (3rd generation)", + os: "16.2" + } + }, }, configurations: { "ios": { @@ -34,6 +46,10 @@ module.exports = { "ios.debug": { device: "simulator", app: "ios.debug" + }, + "ios.debug.ci": { + device: "simulator", + app: "ios.debug.ci" } } }; \ No newline at end of file diff --git a/example/__tests__/__mocks__/@rneui/base.js b/example/__tests__/__mocks__/@rneui/base.js new file mode 100644 index 0000000000..f828f56ab6 --- /dev/null +++ b/example/__tests__/__mocks__/@rneui/base.js @@ -0,0 +1,6 @@ +const FAB = () => null; +const Icon = () => null; +const ListItem = () => null; +const Overlay = () => null; + +export { FAB, Icon, ListItem, Overlay }; diff --git a/example/__tests__/dumpExamplesJson.ts b/example/__tests__/dumpExamplesJson.ts new file mode 100644 index 0000000000..54b4fb382a --- /dev/null +++ b/example/__tests__/dumpExamplesJson.ts @@ -0,0 +1,97 @@ +/** + * Dumps examples.json to docs/examples.json from metadata in the examples in the example direcrory + */ +import path from 'path'; +import fs from 'fs'; + +import * as SymbolCircleLayer from '../src/examples/SymbolCircleLayer'; +import * as UserLocation from '../src/examples/UserLocation'; +import type { + Examples, + Example, +} from '../../scripts/autogenHelpers/examplesJsonSchema'; +import { + examplesJSONPath, + mapsRootPath, +} from '../../scripts/autogenHelpers/docconfig.js'; + +jest.mock('../src/assets/scale-test-icon4.png', () => null, { + virtual: true, +}); + +const allTests = { + SymbolCircleLayer, + UserLocation, +} as const; + +const relExamplesPath = path.join('example', 'src', 'examples'); +const examplesPath = path.join(mapsRootPath, relExamplesPath); + +function getExampleFullPath( + groupName: string, + testName: string, +): { fullPath: string; relPath: string } { + const extensions = ['js', 'jsx', 'ts', 'tsx']; + const relPathBase = path.join(groupName, testName); + + const existingExamplePaths = extensions + .map((ext) => ({ + relPath: `${relPathBase}.${ext}`, + fullPath: path.join(relExamplesPath, `${relPathBase}.${ext}`), + })) + .filter(({ relPath, fullPath }) => + fs.existsSync(path.join(mapsRootPath, fullPath)), + ); + if (existingExamplePaths.length === 0) { + throw new Error( + `Could not find example file for ${groupName}/${testName} - ${path.join( + examplesPath, + relPathBase, + )}.*`, + ); + } + return existingExamplePaths[0]; +} + +describe('Public Interface', () => { + it('should contain all expected components and utils', () => { + expect(true).toBe(true); + }); +}); + +const exampleGroups: Examples = []; + +type AllTestKeys = keyof typeof allTests; + +const allTestKeys = Object.keys(allTests) as AllTestKeys[]; + +allTestKeys.forEach((groupName) => { + const { metadata, ...tests } = allTests[groupName]; + const examples: Example[] = []; + Object.entries(tests).forEach(([testName, test]) => { + const { metadata: testMetadata } = test as unknown as { + metadata?: Example['metadata']; + }; + const { fullPath, relPath } = getExampleFullPath(groupName, testName); + if (testMetadata) { + examples.push({ + metadata: testMetadata, + fullPath, + relPath, + name: testName, + }); + } + }); + + exampleGroups.push({ + groupName, + metadata, + examples, + }); +}); + +fs.writeFileSync( + examplesJSONPath, + JSON.stringify(exampleGroups, null, 2), + 'utf8', +); diff --git a/example/e2e/docScreenshots.e2e.js b/example/e2e/docScreenshots.e2e.js index 046c7424f9..3f192816e9 100644 --- a/example/e2e/docScreenshots.e2e.js +++ b/example/e2e/docScreenshots.e2e.js @@ -1,3 +1,7 @@ +/** + * @file process the docs/examples.json file and take screenshots of each example and outputs it to /example-screenshots and /example-screenshots/screenshots.json + */ + const { mkdir, copyFile } = require('fs/promises'); const fs = require('fs'); const path = require('path'); @@ -5,15 +9,17 @@ const { execSync } = require('child_process'); const { device } = require('detox'); -const rootDir = '..'; - -const docsRoot = '/Users/boga/Work/OSS/RNMBGL/map-docs/'; -const exampleDocsRoot = path.join(docsRoot, 'docs/examples'); +const { + examplesJSONPath, + docScreenshotsPath, + screenshotsJSONPath, + docSiteRootPath, +} = require('../../scripts/autogenHelpers/docconfig.js'); -const examples = JSON.parse( - fs.readFileSync(`${rootDir}/docs/examples.json`, 'utf8'), -); -console.log('Examples::', examples); +/** + * @type {import('../../scripts/autogenHelpers/examplesJsonSchema.ts').Examples} + */ +const examples = JSON.parse(fs.readFileSync(examplesJSONPath, 'utf8')); async function setSampleLocation() { const latitude = 40.723279; @@ -23,8 +29,6 @@ async function setSampleLocation() { async function saveImage(basePath, suffix = null) { const imagePath = await device.takeScreenshot(`example-${suffix || ''}`); - // const destDir = `${rootDir}/docs/screenshots`; - // const destPath = `${destDir}/${imageName}.png`; const destDir = path.dirname(basePath); await mkdir(destDir, { recursive: true }); var fullDestPath = basePath; @@ -34,7 +38,7 @@ async function saveImage(basePath, suffix = null) { fullDestPath = `${basePath}.png`; } await copyFile(imagePath, fullDestPath); - await execSync(`sips -Z 640 ${fullDestPath}`); + return fullDestPath; } async function wait(ms) { @@ -45,54 +49,98 @@ async function wait(ms) { } catch (e) {} } -describe('Example screenshots', () => { - beforeAll(async () => { - await device.launchApp({ permissions: { location: 'always' } }); - }); - beforeEach(async () => { - await device.reloadReactNative(); - }); +/** + @typedef {import('../../scripts/autogenHelpers/screenshotsJsonSchema.ts').Screenshots} Screenshots + @typedef {import('../../scripts/autogenHelpers/screenshotsJsonSchema.ts').ExampleGroupScreenshots} ExampleGroupScreenshots + @typedef {import('../../scripts/autogenHelpers/examplesJsonSchema.ts').Example} Example + */ + +class ExampleScreenshots { + /** + * @param {{testName: string; groupName: string}} example + * @param {Screenshots} screenshots + */ + constructor(example, screenshots) { + /** @type {{testName: string, groupName: string}} */ + this.example = example; + + /** @type {Screenshots} */ + this.screenshots = screenshots; + + /** @type string[] */ + this.dirs = [example.groupName]; + + /** @type string */ + this.basename = example.testName; + + var screenshotsDict = screenshots; + screenshotsDict[example.groupName] = + screenshotsDict[example.groupName] || {}; + /** @type ExampleGroupScreenshots */ + this.screenshotsDict = screenshotsDict[example.groupName]; + } + async screenshot(suffix = null) { + const { dirs, basename, screenshotsDict } = this; - Object.keys(examples).forEach((examplegroup) => { - const group = examplegroup.replaceAll('_', ' '); - describe(group, () => { - examples[examplegroup].forEach((example) => { - it(example.name, async () => { - await setSampleLocation(); + const groupDir = path.join(docScreenshotsPath, ...dirs); + fs.mkdirSync(groupDir, { recursive: true }); - await expect(element(by.text(group))).toBeVisible(); - await element(by.text(group)).tap(); + if (!screenshotsDict[basename]) { + screenshotsDict[basename] = { images: [] }; + } - await expect(element(by.text(example.title))).toBeVisible(); - await element(by.text(example.title)).tap(); - console.log(' => before wait'); - await wait(1000); - console.log('=> after wait'); - console.log('[***] x', example, JSON.stringify(example)); - const dirs = example.fullPath.split('/').slice(4); - const nameWithExt = dirs.pop(); + const imgPath = await saveImage(path.join(groupDir, basename), suffix); + screenshotsDict[basename].images.push( + path.relative(docSiteRootPath, path.resolve(imgPath)), + ); + } +} - const groupDir = path.join(exampleDocsRoot, ...dirs); - fs.mkdirSync(groupDir, { recursive: true }); - const basename = nameWithExt.split('.').slice(0, -1).join('.'); +if (['true', 1, '1'].includes(process.env.SKIP_TESTS_NO_METAL)) { + console.debug( + '### Skipping tests as Metal is not available in this environment', + ); +} else { + describe('Example screenshots', () => { + beforeAll(async () => { + await device.launchApp({ permissions: { location: 'always' } }); + }); + beforeEach(async () => { + await device.reloadReactNative(); + }); + + /** @type Screenshots */ + const screenshots = {}; - const destPath = path.join(groupDir, `${basename}.md`); + examples.forEach(({ groupName, metadata: groupMetadata, examples }) => { + describe(`${groupName}`, () => { + examples.forEach(({ metadata, fullPath, name }) => { + if (metadata) { + it(`${name}`, async () => { + await setSampleLocation(); - const destImgPath = path.join(groupDir, `${basename}.png`); + await expect(element(by.text(groupMetadata.title))).toBeVisible(); + await element(by.text(groupMetadata.title)).tap(); - fs.writeFileSync( - destPath, - ` -${example.docs} + await expect(element(by.text(metadata.title))).toBeVisible(); + await element(by.text(metadata.title)).tap(); -![${example.title}](./${basename}.png) + let shots = new ExampleScreenshots( + { testName: name, groupName }, + screenshots, + ); - `, - ); + await wait(1000); - await saveImage(path.join(groupDir, basename)); + await shots.screenshot(); + }); + } }); }); }); + + afterAll(async () => { + fs.writeFileSync(screenshotsJSONPath, JSON.stringify(screenshots)); + }); }); -}); +} diff --git a/example/e2e/firstTest.e2e.js b/example/e2e/firstTest.e2e.js index b7b5bd2998..09a0a43347 100644 --- a/example/e2e/firstTest.e2e.js +++ b/example/e2e/firstTest.e2e.js @@ -1,15 +1,3 @@ -const { mkdir, copyFile } = require('fs/promises'); - -async function saveImage(imageName) { - const imagePath = await device.takeScreenshot('Show Click'); - console.log('[x] imagePath =>', imagePath); - const destDir = '/tmp/screenshots'; - const destPath = `${destDir}/Show Click.png`; - await mkdir(destDir, { recursive: true }); - await copyFile(imagePath, destPath); - console.log('[x] destPath =>', destPath); -} - describe('Maps Example App', () => { beforeAll(async () => { await device.launchApp({ permissions: { location: 'always' } }); @@ -38,7 +26,6 @@ describe('Maps Example App', () => { await expect(element(by.text('Show Map'))).toBeVisible(); await element(by.text('Show Map')).tap(); await expect(element(by.id('show-map'))).toBeVisible(); - await saveImage('Show Map'); }); it('should show click location', async () => { @@ -58,6 +45,5 @@ describe('Maps Example App', () => { await waitFor(element(by.id('location-bubble-latitude'))) .toBeVisible() .withTimeout(1000); - await saveImage('Show Click'); }); }); diff --git a/example/jest.config.ts b/example/jest.config.ts new file mode 100644 index 0000000000..f47a75e485 --- /dev/null +++ b/example/jest.config.ts @@ -0,0 +1,17 @@ +import type { Config } from 'jest'; + +function rnfix(path: string): string { + return path.replace('@rnmapbox/maps', '/..'); +} + +const config: Config = { + verbose: true, + preset: 'react-native', + roots: ['__tests__/'], + setupFilesAfterEnv: [rnfix('@rnmapbox/maps/setup-jest')], + moduleNameMapper: { + '@rnmapbox/maps': '/..', + }, +}; + +export default config; diff --git a/example/package.json b/example/package.json index 646820df99..f7ffd3978d 100644 --- a/example/package.json +++ b/example/package.json @@ -53,24 +53,21 @@ "@babel/core": "^7.20.0", "@babel/preset-env": "^7.20.0", "@babel/runtime": "7.20.0", - "@react-native/eslint-config": "^0.72.0", "@react-native/metro-config": "^0.72.1", "@tsconfig/react-native": "^3.0.0", - "@types/react": "^18.0.24", "@types/react-test-renderer": "^18.0.0", "babel-jest": "^29.2.1", + "babel-plugin-module-resolver": "^4.1.0", + "detox": "^20.12.1", "eslint": "^8.19.0", + "glob-to-regexp": "^0.4.0", "jest": "^29.2.1", "metro-react-native-babel-preset": "^0.76.8", "prettier": "^2.4.1", "react-test-renderer": "18.2.0", - "typescript": "^4.8.4", - - "babel-plugin-module-resolver": "^4.1.0", - "detox": "^20.12.1", - "glob-to-regexp": "^0.4.0" + "typescript": "^4.8.4" }, "engines": { "node": ">=16" diff --git a/example/src/examples/SymbolCircleLayer/CustomIcon.tsx b/example/src/examples/SymbolCircleLayer/CustomIcon.tsx index 3939c2c3a6..e28a743d21 100755 --- a/example/src/examples/SymbolCircleLayer/CustomIcon.tsx +++ b/example/src/examples/SymbolCircleLayer/CustomIcon.tsx @@ -10,7 +10,7 @@ import MapboxGL, { import { featureCollection, feature, point } from '@turf/helpers'; import Bubble from '../common/Bubble'; -import type { ExampleMetadata } from '../common/ExampleMetadata'; +import type { ExampleWithMetadata } from '../common/ExampleMetadata'; import exampleIcon from '../../assets/example.png'; const styles = { @@ -80,19 +80,21 @@ const CustomIcon = memo(() => { ); }); +export default CustomIcon; /* end-example-doc */ -const metadata = CustomIcon as unknown as ExampleMetadata; -metadata.title = 'Custom Icon'; -metadata.tags = [ - 'ShapeSource', - 'ShapeSource#onPress', - 'SymbolLayer', - 'Images', - 'SymbolLayer#iconImage', -]; -metadata.docs = ` +const metadata: ExampleWithMetadata['metadata'] = { + title: 'Custom Icon', + tags: [ + 'ShapeSource', + 'ShapeSource#onPress', + 'SymbolLayer', + 'Images', + 'SymbolLayer#iconImage', + ], + docs: ` Renders a symbol layer with custom icon defined using the Images component. Clicking a location on a map add a new icon. -`; +`, +}; -export default CustomIcon; +(CustomIcon as unknown as ExampleWithMetadata).metadata = metadata; diff --git a/example/src/examples/SymbolCircleLayer/DataDrivenCircleColors.js b/example/src/examples/SymbolCircleLayer/DataDrivenCircleColors.js index 80c576ec00..a7e67a8825 100755 --- a/example/src/examples/SymbolCircleLayer/DataDrivenCircleColors.js +++ b/example/src/examples/SymbolCircleLayer/DataDrivenCircleColors.js @@ -65,17 +65,20 @@ export default DataDrivenCircleColors; /* end-example-doc */ /** @type {import('../common/ExampleMetadata').ExampleMetadata} */ -const metadata = DataDrivenCircleColors; -metadata.title = 'Data driven circle colors'; -metadata.tags = [ - 'VectorSource', - 'CircleLayer', - 'CircleLayer#circleRadius', - 'CircleLayer#circleColor', - 'expressions', -]; -metadata.docs = ` +const metadata = { + title: 'Data driven circle colors', + tags: [ + 'VectorSource', + 'CircleLayer', + 'CircleLayer#circleRadius', + 'CircleLayer#circleColor', + 'expressions', + ], + docs: ` Renders circles with radius and color based on data-driven expressions. Color is based on the \`ethnicity\` property of the feature, radius is based on zoom level. -`; +`, +}; + +DataDrivenCircleColors.metadata = metadata; diff --git a/example/src/examples/SymbolCircleLayer/Earthquakes.tsx b/example/src/examples/SymbolCircleLayer/Earthquakes.tsx index 076bda3466..95ac370068 100755 --- a/example/src/examples/SymbolCircleLayer/Earthquakes.tsx +++ b/example/src/examples/SymbolCircleLayer/Earthquakes.tsx @@ -15,7 +15,7 @@ import { FlatList, SafeAreaView } from 'react-native'; import earthQuakesJSON from '../../assets/earthquakes.json'; import { SF_OFFICE_COORDINATE } from '../../utils'; -import { ExampleMetadata } from '../common/ExampleMetadata'; +import { ExampleWithMetadata } from '../common/ExampleMetadata'; const layerStyles: { singlePoint: CircleLayerStyle; @@ -222,18 +222,21 @@ const Earthquakes = () => { export default Earthquakes; /* end-example-doc */ -const metadata = Earthquakes as unknown as ExampleMetadata; -metadata.title = 'Earthquakes'; -metadata.tags = [ - 'ShapeSource', - 'SymbolLayer', - 'ShapeSource#getClusterLeaves', - 'CircleLayer', - 'CircleLayer#clusterProperties', - 'expressions', -]; -metadata.docs = ` +const metadata: ExampleWithMetadata['metadata'] = { + title: 'Earthquakes', + tags: [ + 'ShapeSource', + 'SymbolLayer', + 'ShapeSource#getClusterLeaves', + 'CircleLayer', + 'CircleLayer#clusterProperties', + 'expressions', + ], + docs: ` Renders earthqueke with clustering. Click a cluster to show list of contents in the cluster \`getClusterLeaves\`. -`; +`, +}; + +(Earthquakes as unknown as ExampleWithMetadata).metadata = metadata; diff --git a/example/src/examples/SymbolCircleLayer/ScalableImages.tsx b/example/src/examples/SymbolCircleLayer/ScalableImages.tsx index 817c7db804..db1f81255f 100644 --- a/example/src/examples/SymbolCircleLayer/ScalableImages.tsx +++ b/example/src/examples/SymbolCircleLayer/ScalableImages.tsx @@ -1,8 +1,7 @@ import React from 'react'; import Mapbox, { type ImageEntry } from '@rnmapbox/maps'; -import sheet from '../../styles/sheet'; -import { ExampleMetadata } from '../common/ExampleMetadata'; +import type { ExampleWithMetadata } from '../common/ExampleMetadata'; const styles = { icon: { @@ -11,6 +10,7 @@ const styles = { textField: ['get', 'name'], iconTextFit: 'both', }, + matchParent: { flex: 1 }, } as const; const featureCollection: GeoJSON.FeatureCollection = { @@ -54,7 +54,7 @@ class ScaleableImages extends React.PureComponent { const { images } = this.state; return ( - + { @@ -33,23 +24,36 @@ class SetDisplacement extends React.Component { render() { return ( - - - + + - - - + + + `${i} meters`)} + selectedIndex={DISPLACEMENT.indexOf(this.state.minDisplacement)} + onPress={this.onDisplacementChange} + /> + ); } } export default SetDisplacement; + +/* end-example-doc */ + +/** @type ExampleWithMetadata['metadata'] */ +const metadata = { + title: 'Set Displacement', + tags: ['UserLocation', 'UserLocation#minDisplacement'], + docs: ` +Change the minimum displacement required to update the user location. +`, +}; +SetDisplacement.metadata = metadata; diff --git a/example/src/examples/UserLocation/SetTintColor.js b/example/src/examples/UserLocation/SetTintColor.js index f90ed9beb4..2713e546a7 100644 --- a/example/src/examples/UserLocation/SetTintColor.js +++ b/example/src/examples/UserLocation/SetTintColor.js @@ -1,18 +1,13 @@ import React from 'react'; -import MapboxGL from '@rnmapbox/maps'; - -import sheet from '../../styles/sheet'; -import BaseExamplePropTypes from '../common/BaseExamplePropTypes'; -import TabBarPage from '../common/TabBarPage'; +import { MapView, Camera, UserLocation } from '@rnmapbox/maps'; +import { ButtonGroup } from '@rneui/base'; +import { SafeAreaView } from 'react-native'; const COLOR = ['red', 'yellow', 'green']; const OPTIONS = [{ label: 'red' }, { label: 'yellow' }, { label: 'green' }]; +const styles = { matchParent: { flex: 1 } }; class SetTintColor extends React.Component { - static propTypes = { - ...BaseExamplePropTypes, - }; - state = { tintColor: COLOR[0] }; onTintColorChange = (index) => { @@ -21,29 +16,36 @@ class SetTintColor extends React.Component { render() { return ( - - - + + - - - + + + i.label)} + selectedIndex={COLOR.indexOf(this.state.tintColor)} + /> + ); } } export default SetTintColor; + +/* end-example-doc */ + +/** @type ExampleWithMetadata['metadata'] */ +const metadata = { + title: 'Set Tint Color', + tags: ['MapView#tintColor'], + docs: ` +Change the tint color of the map. This will change the color of the user location icon and the compass. +`, +}; +SetTintColor.metadata = metadata; diff --git a/example/src/examples/UserLocation/UserLocationPadding.tsx b/example/src/examples/UserLocation/UserLocationPadding.tsx index 3b48176e03..4355fd149e 100755 --- a/example/src/examples/UserLocation/UserLocationPadding.tsx +++ b/example/src/examples/UserLocation/UserLocationPadding.tsx @@ -1,9 +1,14 @@ import React, { useState } from 'react'; -import MapboxGL, { CameraPadding } from '@rnmapbox/maps'; +import { + MapView, + Camera, + UserLocation, + type CameraPadding, +} from '@rnmapbox/maps'; +import { ButtonGroup } from '@rneui/base'; +import { SafeAreaView } from 'react-native'; -import sheet from '../../styles/sheet'; -import { BaseExampleProps } from '../common/BaseExamplePropTypes'; -import TabBarPage from '../common/TabBarPage'; +import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-example-doc enum Alignment { Top = 'TOP', @@ -17,28 +22,37 @@ const ALIGNMENTS: Record> = { [Alignment.Bottom]: { paddingTop: 300 }, }; -const UserLocationPadding = (props: BaseExampleProps) => { +const styles = { matchParent: { flex: 1 } }; + +const UserLocationPadding = () => { const [alignment, setAlignment] = useState(Alignment.Center); return ( - ({ - label: alignmentValue, - data: alignmentValue, - }))} - onOptionPress={(index, data) => setAlignment(data)} - > - - - - - + + + + + + setAlignment(Object.values(Alignment)[index])} + /> + ); }; export default UserLocationPadding; + +/* end-example-doc */ + +const metadata: ExampleWithMetadata['metadata'] = { + title: 'User Location Padding', + tags: ['Images', 'Images#stretchX', 'Images#stretchY', 'Images#content'], + docs: ` +Demonstates Scalable images. + +You can use strachX, stretchY and content to scale a bitmap image - keep parts of it fixed while only scale specific parts. +`, +}; +UserLocationPadding.metadata = metadata; diff --git a/example/src/examples/UserLocation/UserLocationRenderMode.tsx b/example/src/examples/UserLocation/UserLocationRenderMode.tsx index 1dab198297..29b18f699f 100755 --- a/example/src/examples/UserLocation/UserLocationRenderMode.tsx +++ b/example/src/examples/UserLocation/UserLocationRenderMode.tsx @@ -1,16 +1,17 @@ import React, { ReactNode, useState } from 'react'; -import MapboxGL, { +import { + MapView, CircleLayer, + UserLocation, + Camera, UserLocationRenderMode as UserLocationRenderModeType, UserTrackingMode, } from '@rnmapbox/maps'; -import { Button, Platform, View } from 'react-native'; +import { Button, Platform, SafeAreaView, View } from 'react-native'; import { ButtonGroup, Text } from '@rneui/base'; -import sheet from '../../styles/sheet'; -import TabBarPage from '../common/TabBarPage'; -import { BaseExampleProps } from '../common/BaseExamplePropTypes'; import { DEFAULT_CENTER_COORDINATE } from '../../utils'; +import { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc const SettingsGroup = ({ children, @@ -25,6 +26,14 @@ const SettingsGroup = ({ ); +const styles = { matchParent: { flex: 1 } }; + +function humanize(name: string): string { + const words = name.match(/[A-Za-z][a-z]*/g) || []; + + return words.map((i) => i.charAt(0).toUpperCase() + i.substring(1)).join(' '); +} + enum ExampleRenderMode { Normal = 'normal', Native = 'native', @@ -38,7 +47,7 @@ const ANDROID_RENDER_MODES: ('normal' | 'compass' | 'gps')[] = [ 'gps', ]; -const UserLocationRenderMode = (props: BaseExampleProps) => { +const UserLocationRenderMode = () => { const [renderMode, setRenderMode] = useState( ExampleRenderMode.Normal, ); @@ -51,17 +60,7 @@ const UserLocationRenderMode = (props: BaseExampleProps) => { >('normal'); return ( - setRenderMode(value)} - > +