Cloning existing map to another container using OpenLayers?

Question

I have a map created using OpenLayers 4 ,i want to take a print out of the map , before taking the print , i want to see its preview , So I need to clone the map to another container without making any problem with parent map , so i ve tried all these ,

 let map2=this.createMapWithExistingView('previewmap',this.parentMap.getView());


createMapWithExistingView(t,v) {
    let mapObj = new olMap({
      layers: [

      ],
      target: t,
      controls: olControls.defaults({ attribution: false }),
      interactions: [
        new olDragPanInteraction(),
        new olMouseWheelZoomInteraction(),
        new dragrotateandzoom()
      ],
      view:v
    });
    return mapObj;
  }

but its not showing the map , only default zoom controls , when i clicked on zoom of preview map, zooming occurs on parent map.

Answer 1

You only sent view but not layers. You need to pass layers as well. Layers are empty so the map is empty.

let map2=this.createMapWithExistingView('previewmap', this.parentMap.getLayers(), this.parentMap.getView());

createMapWithExistingView(t, l, v) {
    let mapObj = new ol.Map({
        layers: l,
        target: t,
        controls: ol.Controls.defaults({
            attribution: false
        }),
        interactions: [
            new olDragPanInteraction(),
            new olMouseWheelZoomInteraction(),
            new dragrotateandzoom()
        ],
        view: v
    });
    return mapObj;
}

fiddle: https://codepen.io/anon/pen/VVYxLY