vue中使用OpenLayers（五）：两层地图合并，地图上显示地址和区域描边

vue中使用OpenLayers（五）：两层地图合并

html中需要用两个id接收jpg和png。png在jpg上面。地址和区域描边都在png上

在js中

  let view=new View({
          center: fromLonLat([119.60753817138888, 30.49043631527778]),
          projection: "EPSG:3857",
          zoom: 8,
          minZoom: 8,
        })
        this.map = new Map({
          target: "themap",
          view:view ,
          layers: [
            new TileLayer({
              source: new XYZ({
                url: "http://61.164.49.122:8092/googlemaps/satellite/{z}/{x}/{y}.jpg",
                //url:'http://www.google.cn/maps/vt/pb=!1m4!1m3!1i{z}!2i{x}!3i{y}!2m3!1e0!2sm!3i345013117!3m8!2szh-CN!3scn!5e1105!12m4!1e68!2m2!1sset!2sRoadmap!4e0',
                wrapX: true
              })
            })
          ]
        });

        this.map2=new Map({
          target: "themap2",
          view:view ,
          layers: [
            new TileLayer({
              source: new XYZ({
                url: "http://61.164.49.122:8092/googlemaps/overlay/{z}/{x}/{y}.png",
                //url:'http://www.google.cn/maps/vt/pb=!1m4!1m3!1i{z}!2i{x}!3i{y}!2m3!1e0!2sm!3i345013117!3m8!2szh-CN!3scn!5e1105!12m4!1e68!2m2!1sset!2sRoadmap!4e0',
                wrapX: true
              })
            })
          ]
        });

提示一定要注意view要另外弄出来。其中两个地图的结合靠的就是使用同一个view。