openLayer实现两个地图联动
其主要思想就是将两个地图放在一个view即可
<template> <div class="main"> <div id="map1"></div> <div id="map2"></div> </div> </template> <script> import {Map,View} from 'ol' import TileLayer from 'ol/layer/Tile' import OSM from 'ol/source/OSM' export default { data() { return { }; }, mounted() { var view = new View({ projection: "EPSG:4326", //使用这个坐标系 center: [0,0], zoom: 13 }) var map1= new Map({ target: "map1", layers: [ new TileLayer({ source: new OSM() }) ], view: view, }); var map2=new Map({ target: "map2", layers: [ new TileLayer({ source: new OSM() }) ], view:view, }); } }; </script> <style > .main{ height: 100%; width: 100%; } #map1{ width: 50%; height: 100%; float: left; } #map2{ width: 50%; height: 100%; float: left; } </style>