比例尺控件（ScaleControl）

比例尺组件，用于显示图上距离和实际距离的比值

示例

示例源码

import React, { useState } from 'react'
import ReactDOM from 'react-dom'
import { MbMap, MbScaleControl, MbTiandituLayer } from '@mapbox-react/core'

const App = () => {
  const [mapCenter] = useState([116.38745, 39.91266])
  const [zoom, setZoom] = useState(2)

  return (
    <div className="map-wrapper">
      <MbMap center={mapCenter} zoom={zoom}>
        <MbTiandituLayer types={['vec']} />
        <MbScaleControl position="bottom-right" />
      </MbMap>
    </div>
  )
}

ReactDOM.render(<App />, document.querySelector('#root'))

API

PROPS

名称	描述	类型	默认值
position	控件所处位置	string('top-left' ， 'top-right' ， 'bottom-left' ，'bottom-right')	top-right
maxWidth	ScaleControl控件的最大长度，以像素为单位	number	100
unit	单位	string('imperial' ， 'metric' ， 'nautical')	metric

EVENTS

名称	描述	参数
onCreated	地图初始化完成事件	-

METHODS

名称	描述	定义