温度（TempLayer）

示例

示例源码

import React, { useEffect, useRef, useState } from 'react'
import ReactDOM from 'react-dom'
import { MbMap, MbTiandituLayer } from '@mapbox-react/core'
import { MbTempLayer } from '@mapbox-react/env-layers'

const App = () => {
  const [mapCenter] = useState([116, 39])
  const [zoom, setZoom] = useState(3)
  const [pitch, setPitch] = useState(0)
  const mapInst = useRef<any>()

  return (
    <div className="map-wrapper">
      <MbMap ref={mapInst} center={mapCenter} zoom={zoom} pitch={pitch}>
        <MbTempLayer
          image="https://mapbox-web.github.io/mapbox-react/wind/tmp.png"
          min={-21.32}
          max={26.8}
          range={[360, 170]}
          origin={[0, 85]}
          resolution={0.25}
          opacity={0.8}
        />
      </MbMap>
    </div>
  )
}

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

API

PROPS

名称	描述	类型	默认值
id	图层Id	string	-
image	图片路径	string	-
max	-	number	-
min	-	number	-
origin	-	number[]	-
range	-	number[]	-
resolution	-	number	-
rampColors	-	IndexAny	{ 0.0: "#6fb9e6", 0.1: "#8ac4e6", 0.2: "#abdda4", 0.3: "#e6f598", 0.4: "#fee08b", 0.5: "#fdae61", 0.6: "#f46d43", 1.0: "#d53e4f", }
opacity	透明度	number	0.8
visible	是否可见	boolean	true

EVENTS

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

METHODS

名称	描述	定义