雷达(RadarLayer)
示例
示例源码
tsx
import React, { useEffect, useRef, useState } from 'react'
import ReactDOM from 'react-dom'
import { MbMap, MbWmtsLayer } from '@mapbox-react/core'
import { MbRadarLayer } from '@mapbox-react/effect-layers'
const App = () => {
const [mapCenter] = useState([116, 39])
const [zoom, setZoom] = useState(10)
const [pitch, setPitch] = useState(0)
const mapInst = useRef<any>()
return (
<div className="map-wrapper">
<MbMap ref={mapInst} center={mapCenter} zoom={zoom} pitch={pitch}>
<MbWmtsLayer
url="https://t{s}.tianditu.gov.cn/img_w/wmts?tk=b8ed92ff9b64aebcb0110acca15e478f"
layerName="img"
layerStyle="default"
tileMatrixSetID="w"
subdomains="01234567"
maxzoom={18}
/>
<MbRadarLayer coordinates={[116, 39]} radius={10000} />
</MbMap>
</div>
)
}
ReactDOM.render(<App />, document.querySelector('#root'))
API
PROPS
名称 | 描述 | 类型 | 默认值 |
---|---|---|---|
id | 图层Id | string | - |
coordinates | 中心坐标 | number[] | - |
radius | 半径 | number | 5000 |
EVENTS
名称 | 描述 | 参数 |
---|
METHODS
名称 | 描述 | 定义 |
---|