embedding Baidu map API, in
React when doing address translation, the callback function is not executed;
Baidu map API is loaded into head dynamically; the methods that have been tried are as follows:
1, writing an official example in React has no effect, and the callback function is still not executed; http://lbsyun.baidu.com/jsdem.
2. Import the convertor.js file into React, the conversion result is incorrect, and the file is written for 11 years, so it is estimated to be out of date;
http://developer.baidu.com/map/jsdemo/demo/convertor.js
also ask the great gods to help answer, thank you! The following is the code written in react
componentDidMount() {
const script = document.createElement("script");
script.src = "http://api.map.baidu.com/api?v=2&ak=key";
script.type = "text/javascript";
document.head.appendChild(script);
window.onLoad = function () {
var x = 116.32715863448607;
var y = 39.990912172420714;
var ggPoint = new BMap.Point(x,y);
//
var bm = new BMap.Map("map");
bm.centerAndZoom(ggPoint, 15);
bm.addControl(new BMap.NavigationControl());
//markerlabel
var markergg = new BMap.Marker(ggPoint);
bm.addOverlay(markergg); //marker
var labelgg = new BMap.Label("",{offset:new BMap.Size(20,-10)});
markergg.setLabel(labelgg); //label
//
setTimeout(function(){
var pointArr = [];
pointArr.push(ggPoint);
new BMap.Convertor().translate(pointArr, 3, 5, function (data){
if(data.status === 0) {
var marker = new BMap.Marker(data.points[0]);
bm.addOverlay(marker);
var label = new BMap.Label("",{offset:new BMap.Size(20,-10)});
marker.setLabel(label); //label
bm.setCenter(data.points[0]);
}
})
}, 1000);
}
}