How to access the internal ol.Map instance?

[frankhommers]

In #95 you mention the accessing of the ol.Map instance directly. I want to do this, but I am not sure how? Can you point me in the right direction? Or preferrably give an example?

[ghettovoice]

Hello @frankhommers!
Basically any vuelayers component fires several life cycle events: created, mounted, destroyed. This events are relevant for underlying openlayers instance that is used in the component.

So for your use case, you should listen for created event on the vl-map component:

<template>
  <vl-map @created="mapCreated">
  ...
  </vl-map>
</template>

<script>
export default {
  ...
  methods: {
    /**
     * @param vm vl-map component instance
     */
    mapCreated (vm) {
       console.log(vm) // vl-map instance
       console.log(vm.$map) // ol.Map instance
    },
  },
}
</script>

Another method is based on the using of the ref attribute and life cycle promise.

<template>
  <vl-map ref="map">
  ...
  </vl-map>
</template>

<script>
export default {
  ...
  mounted () {
    this.$refs.map.$createPromise.then(vm => {
      console.log(vm) // vl-map instance
      console.log(vm.$map) // ol.Map instance
    })
  },
}
</script>

You can use this methods to get openlayers instance from any component.
There are common instance getters:

- vl-view -> vm.$view
- vl-layer-* -> vm.$layer
- vl-source-* > vm.$source
- vl-interaction-* -> vm.$interaction

[frankhommers]

Thanks for the answers! I will check them (or a colleague) tomorrow ;-)

[frankhommers]

Yes this works! Thanks!

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.