react中使用openlayers
不多bb风罩，直接上代碼
少bb讶踪，上代碼
import React from 'react';
import Map from 'ol/Map';
import Tile from 'ol/layer/Tile';
import OSM from 'ol/source/OSM';
import View from 'ol/View';
import { fromLonLat } from 'ol/proj';
class MapHot extends React.Component {
componentDidMount() {
let map = new Map({
// 設(shè)置掛載點為map
target: 'map',
// 設(shè)置圖層
layers: [
new Tile({
source: new OSM()
})
],
// 設(shè)置地圖的可視區(qū)域，center為中心點泊交，zoom為縮放的層級
view: new View({
center: fromLonLat([0, 0]),
zoom: 4
})
});
}
render() {
return (
// 地圖的掛載點乳讥，可以設(shè)置大小，控制地圖的大小
<div id="map" />
);
}
}
export default MapHot;
來人呀廓俭！把朕的效果圖搬上來
效果圖
溜了溜了
溜了溜了
