单页面多地图

在某些业务中，可能需要在一个页面中加载多个地图，用于对比，或者多个业务方面的同时展示。那么OpenLayers 3能否做到单页面多地图互不干扰呢？

地图1

地图2

可以看到两个地图的导航相互都不会产生任何影响。对应的代码也非常简单，如下：

<p>地图1</p>
<div id="map1" style="width: 100%"></div>
<p>地图2</p>
<div id="map2" style="width: 100%"></div>
<script>
    // 创建第一个地图
  new ol.Map({
        layers: [
            new ol.layer.Tile({source: new ol.source.OSM()})
        ],
        view: new ol.View({
            center: [0, 0],
            zoom: 2
        }),
        target: 'map1'
  });

    // 创建第二个地图
    new ol.Map({
        layers: [
            new ol.layer.Tile({source: new ol.source.OSM()})
        ],
        view: new ol.View({
            center: [0, 0],
            zoom: 2
        }),
        target: 'map2'
  });
</script>

我想这已经不需要进行什么过多的解释了。