react-mapbox-gl

  • Version 5.1.1
  • Published
  • 496 kB
  • 5 dependencies
  • MIT license

Install

npm i react-mapbox-gl
yarn add react-mapbox-gl
pnpm add react-mapbox-gl

Overview

A React binding of mapbox-gl-js

Index

Variables

variable MapContext

const MapContext: React.Context<any>;

    variable Marker

    const Marker: React.StatelessComponent<Props>;

      Functions

      function Cluster

      Cluster: <T>(props: T) => JSX.Element;

        function GeoJSONLayer

        GeoJSONLayer: <T>(props: T) => JSX.Element;

          function Image

          Image: <T>(props: T) => JSX.Element;

            function Layer

            Layer: <T>(props: T) => JSX.Element;

              function Map

              Map: ({
              accessToken,
              apiUrl,
              minZoom,
              maxZoom,
              hash,
              preserveDrawingBuffer,
              scrollZoom,
              interactive,
              dragRotate,
              pitchWithRotate,
              attributionControl,
              customAttribution,
              logoPosition,
              renderWorldCopies,
              trackResize,
              touchZoomRotate,
              doubleClickZoom,
              keyboard,
              dragPan,
              boxZoom,
              refreshExpiredTiles,
              failIfMajorPerformanceCaveat,
              bearingSnap,
              antialias,
              mapInstance,
              transformRequest,
              }: FactoryParameters) => {
              new (props: Readonly<Props & Events>): {
              state: State;
              listeners: Listeners;
              _isMounted: boolean;
              container?: HTMLElement | undefined;
              calcCenter: (
              bounds: [[number, number], [number, number]]
              ) => [number, number];
              componentDidMount(): void;
              componentWillUnmount(): void;
              componentDidUpdate(prevProps: Props & Events): null;
              setRef: (x: HTMLElement | null) => void;
              render(): JSX.Element;
              context: any;
              setState<K extends 'map' | 'ready'>(
              state:
              | State
              | ((
              prevState: Readonly<State>,
              props: Readonly<Props & Events>
              ) => State | Pick<State, K>)
              | Pick<State, K>,
              callback?: (() => void) | undefined
              ): void;
              forceUpdate(callback?: (() => void) | undefined): void;
              readonly props: Readonly<Props & Events> &
              Readonly<{ children?: React.ReactNode }>;
              refs: { [key: string]: React.ReactInstance };
              };
              new (props: Props & Events, context?: any): {
              state: State;
              listeners: Listeners;
              _isMounted: boolean;
              container?: HTMLElement | undefined;
              calcCenter: (
              bounds: [[number, number], [number, number]]
              ) => [number, number];
              componentDidMount(): void;
              componentWillUnmount(): void;
              componentDidUpdate(prevProps: Props & Events): null;
              setRef: (x: HTMLElement | null) => void;
              render(): JSX.Element;
              context: any;
              setState<K extends 'map' | 'ready'>(
              state:
              | State
              | ((
              prevState: Readonly<State>,
              props: Readonly<Props & Events>
              ) => State | Pick<State, K>)
              | Pick<State, K>,
              callback?: (() => void) | undefined
              ): void;
              forceUpdate(callback?: (() => void) | undefined): void;
              readonly props: Readonly<Props & Events> &
              Readonly<{ children?: React.ReactNode }>;
              refs: { [key: string]: React.ReactInstance };
              };
              defaultProps: {
              onStyleLoad: (map: MapboxGl.Map, evt: any) => null;
              center: number[];
              zoom: number[];
              bearing: number;
              movingMethod: string;
              pitch: number;
              containerStyle: { textAlign: string };
              };
              contextType?: React.Context<any> | undefined;
              };

                function ReactMapboxFactory

                ReactMapboxFactory: ({
                accessToken,
                apiUrl,
                minZoom,
                maxZoom,
                hash,
                preserveDrawingBuffer,
                scrollZoom,
                interactive,
                dragRotate,
                pitchWithRotate,
                attributionControl,
                customAttribution,
                logoPosition,
                renderWorldCopies,
                trackResize,
                touchZoomRotate,
                doubleClickZoom,
                keyboard,
                dragPan,
                boxZoom,
                refreshExpiredTiles,
                failIfMajorPerformanceCaveat,
                bearingSnap,
                antialias,
                mapInstance,
                transformRequest,
                }: FactoryParameters) => {
                new (props: Readonly<Props & Events>): {
                state: State;
                listeners: Listeners;
                _isMounted: boolean;
                container?: HTMLElement | undefined;
                calcCenter: (
                bounds: [[number, number], [number, number]]
                ) => [number, number];
                componentDidMount(): void;
                componentWillUnmount(): void;
                componentDidUpdate(prevProps: Props & Events): null;
                setRef: (x: HTMLElement | null) => void;
                render(): JSX.Element;
                context: any;
                setState<K extends 'map' | 'ready'>(
                state:
                | State
                | ((
                prevState: Readonly<State>,
                props: Readonly<Props & Events>
                ) => State | Pick<State, K>)
                | Pick<State, K>,
                callback?: (() => void) | undefined
                ): void;
                forceUpdate(callback?: (() => void) | undefined): void;
                readonly props: Readonly<Props & Events> &
                Readonly<{ children?: React.ReactNode }>;
                refs: { [key: string]: React.ReactInstance };
                };
                new (props: Props & Events, context?: any): {
                state: State;
                listeners: Listeners;
                _isMounted: boolean;
                container?: HTMLElement | undefined;
                calcCenter: (
                bounds: [[number, number], [number, number]]
                ) => [number, number];
                componentDidMount(): void;
                componentWillUnmount(): void;
                componentDidUpdate(prevProps: Props & Events): null;
                setRef: (x: HTMLElement | null) => void;
                render(): JSX.Element;
                context: any;
                setState<K extends 'map' | 'ready'>(
                state:
                | State
                | ((
                prevState: Readonly<State>,
                props: Readonly<Props & Events>
                ) => State | Pick<State, K>)
                | Pick<State, K>,
                callback?: (() => void) | undefined
                ): void;
                forceUpdate(callback?: (() => void) | undefined): void;
                readonly props: Readonly<Props & Events> &
                Readonly<{ children?: React.ReactNode }>;
                refs: { [key: string]: React.ReactInstance };
                };
                defaultProps: {
                onStyleLoad: (map: MapboxGl.Map, evt: any) => null;
                center: number[];
                zoom: number[];
                bearing: number;
                movingMethod: string;
                pitch: number;
                containerStyle: { textAlign: string };
                };
                contextType?: React.Context<any> | undefined;
                };

                  function RotationControl

                  RotationControl: <T>(props: T) => JSX.Element;

                    function ScaleControl

                    ScaleControl: <T>(props: T) => JSX.Element;

                      function Source

                      Source: <T>(props: T) => JSX.Element;

                        function ZoomControl

                        ZoomControl: <T>(props: T) => JSX.Element;

                          Classes

                          class Feature

                          class Feature extends Component<Props> {}

                            method render

                            render: () => null;
                              class Popup extends React.Component<Props> {}

                                method render

                                render: () => JSX.Element;

                                  Package Files (13)

                                  Dependencies (5)

                                  Dev Dependencies (28)

                                  Peer Dependencies (4)

                                  Badge

                                  To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                                  You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/react-mapbox-gl.

                                  • Markdown
                                    [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/react-mapbox-gl)
                                  • HTML
                                    <a href="https://www.jsdocs.io/package/react-mapbox-gl"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>