vue3-openlayers
Version:
OpenLayers Wrapper for Vue3
81 lines (80 loc) • 1.81 kB
JavaScript
import { getCurrentInstance, inject, onMounted, isRef } from "vue";
const COMMON_EVENTS = ["change", "error", "propertychange"];
const LAYER_EVENTS = [
"change:extent",
"change:maxResolution",
"change:maxZoom",
"change:minResolution",
"change:minZoom",
"change:opacity",
"change:source",
"change:visible",
"change:zIndex",
"postrender",
"prerender",
"sourceready"
];
const TILE_SOURCE_EVENTS = [
"tileloadend",
"tileloaderror",
"tileloadstart"
];
const IMAGE_SOURCE_EVENTS = [
"imageloadend",
"imageloaderror",
"imageloadstart"
];
const VECTOR_SOURCE_EVENTS = [
"addfeature",
"changefeature",
"clear",
"featuresloadend",
"featuresloaderror",
"featuresloadstart",
"removefeature"
];
function useOpenLayersEvents(feature, eventNames) {
const instance = getCurrentInstance();
let globalOptions = {
debug: false
};
if (instance) {
globalOptions = inject("ol-options", globalOptions);
}
function updateOpenLayersEventHandlers() {
[...COMMON_EVENTS, ...eventNames].forEach((eventName) => {
let unwrappedFeature;
if (isRef(feature)) {
unwrappedFeature = feature.value;
} else {
unwrappedFeature = feature;
}
unwrappedFeature.on(eventName, (...args) => {
if (globalOptions?.debug) {
console.debug("[Vue3-OpenLayers Debug] EVENT", eventName, {
eventName,
args,
source: feature
});
}
instance?.emit(eventName, ...args);
});
});
}
if (instance) {
onMounted(() => {
updateOpenLayersEventHandlers();
});
}
return {
updateOpenLayersEventHandlers
};
}
export {
COMMON_EVENTS,
IMAGE_SOURCE_EVENTS,
LAYER_EVENTS,
TILE_SOURCE_EVENTS,
VECTOR_SOURCE_EVENTS,
useOpenLayersEvents
};