search

ghettovoice / vuelayers

Web map Vue components with the power of OpenLayers
https://vuelayers.github.io/
MIT License
681 stars 230 forks source link

Access layer from selected feature(s) in InteractionSelect #382

Closed sh-aix closed 3 years ago

sh-aix commented 3 years ago

Hey there,

I need to access the layer of one or multiple selected features in InteractionSelect. With the @select listener I receive the ol.feature,but it has no link to the source layer. What would be the best way to access the corresponding layer?

Regards, Stefan

ghettovoice commented 3 years ago

Hello @sh-aix , you can filter layers that contain feature:

import { Vector as VectorLayer } from 'ol/layer'

...

const layers = this.$refs.map.getLayers().filter(layer => {
  return layer instanceof VectorLayer && 
             layer.getSource().getFeatureById(selectedFeature.getId())
})

// or if you have layer Id inside feature data properties
const layer = this.$refs.map.getLayerById(selectedFeature.get('layerId'))
sh-aix commented 3 years ago

Thanks for the quick response. I thought there might be perhaps an easier way to achieve this than iterate over all layers.

However I got the error "Cannot use import statement outside a module" when trying to import a type from the ol lib. The classes of ol are not found. Can you give me a hint how to fix this. I am using NuxtJS with VueLayers.

ghettovoice commented 3 years ago

I'm not very familiar with NuxtJS. As I know you need to define client plugin. You can try this https://github.com/WouterFlorijn/vue-stack-grid/issues/11#issuecomment-663921874.

As for feature/layer relationship: in OpenLayers in a ol/Feature there is no link to the layer/source because feature instance can be added to multiple vector sources. Not a very common case but sometimes used with it. And also this can lead to the circular dependency between feature and vector source classes. I guess this is the reason why there is no direct link.