40 lines
848 B
TypeScript
40 lines
848 B
TypeScript
import 'mapbox-gl/dist/mapbox-gl.css';
|
|
import Map from 'react-map-gl';
|
|
import './index.less';
|
|
import { MapProps } from './interface';
|
|
import { merge } from './utils';
|
|
import { MAP_CENTER, defaultMapConfig } from './constants';
|
|
|
|
const MapBox: React.FC<MapProps> = (props) => {
|
|
const {
|
|
style = {},
|
|
children,
|
|
mapRef,
|
|
onLoad,
|
|
mapCenter = MAP_CENTER,
|
|
mapConfig = {},
|
|
...others
|
|
} = props || {};
|
|
return (
|
|
//@ts-ignore
|
|
<Map
|
|
ref={(e) => {
|
|
if (mapRef) {
|
|
mapRef.current = e!;
|
|
}
|
|
}}
|
|
onLoad={(e) => {
|
|
onLoad && onLoad(e);
|
|
}}
|
|
style={{ width: '100%', height: 600, ...style }}
|
|
{...merge(defaultMapConfig, mapConfig)}
|
|
initialViewState={{ ...mapCenter, zoom: 10 }}
|
|
{...others}
|
|
>
|
|
{children}
|
|
</Map>
|
|
);
|
|
};
|
|
|
|
export default MapBox;
|