<script src="https://api.map.baidu.com/api?v=1.4&services=true&type=webg1&ak=NNr3GC89RHOHwpfZFz37YRQU0IC5ZLVw"></script> // https://lbsyun.baidu.com/solutions/reactBmapDoc import React, { useEffect } from 'react'; export default function Index() { const handleMap = () => { const windowMap: any = window; console.log(window); const BMapGL = windowMap.BMap; var point = new BMapGL.Point(121.96640,29.78013); var map = new BMapGL.Map('container'); // 获取地图容器 map.centerAndZoom(point, 15); // 地图显示的中心坐标点 map.enableScrollWheelZoom(true, 20); //开启鼠标滚轮缩放 var scaleCtrl = new BMapGL.ScaleControl(); // 添加比例尺控件 map.addControl(scaleCtrl); // 创建点标记 var marker = new BMapGL.Marker(point); map.addOverlay(marker); // 创建信息窗口 var opts: any = { enableCloseOnClick: true, enableMessage: true, width: 200, transparency: 0.8, position: new BMapGL.Point(point), title: '标题', text: '快速文本信息窗口' // height: 300 }; var infoWindow = new BMapGL.InfoWindow( '地址:当前位置', opts ); // 点标记添加点击事件 marker.addEventListener('click', function () { map.openInfoWindow(infoWindow, point); }); // 开启信息窗口}) // 添加缩放控件 map.addControl(infoWindow); map.openInfoWindow(infoWindow, point); // var myCity = new BMapGL.LocalCity(); // function myFun(result: any) { // var cityName = result.name; // console.log('result', result); // map.setCenter(cityName); // // alert("当前定位城市:" + cityName); // } // myCity.get(myFun); var geolocation = new BMapGL.Geolocation(); geolocation.getCurrentPosition(function(r:any){ console.log("hhhh股份回购和国际化家家户户",r); var mk = new BMapGL.Marker(r?.point); map.addOverlay(mk); map.panTo(point); // alert('您的位置:' + r?.point.lng + ',' + r?.point.lat); }); }; useEffect(() => { handleMap(); }, []); return ( <div style={{ width: '100%', height: '1000px', border: '1px solid red' }} id="container" ></div> ); }