How to display multiple Baidu maps on one page_javascript skills

The following is the effect of adding two maps to the page:

The core code of the page is as follows:

Copy code The code is as follows:

The above code can display two side-by-side maps on the same page. If you want to drag and zoom the left map, and the right map will also move and zoom, you only need to register zoomend and moveend for the left map. Event is enough, the code is as follows:

Copy code The code is as follows:

map1.addEventListener("zoomend", function () {
map2.zoomTo(map1.getZoom());
map2.panTo(map1.getCenter());
});

map1.addEventListener("moveend", function () {
map2.zoomTo(map1.getZoom());
map2.panTo(map1.getCenter());
});

The complete code is as follows:

Copy code The code is as follows: