Add and use explicit provisions for 3 basic map functions (d3b42325) · Commits · school / Capstone Design / 02 / vue-leaflet

src/components/LControlLayers.vue

+2 −2

Original line number	Diff line number	Diff line
		@@ -9,7 +9,7 @@ export default {
		setup(props) {
		const mapRef = ref({});

		const lMethods = inject("leafLetMethods");
		const registerLayerControl = inject("registerLayerControl");
		const { options, methods } = controlSetup(props, mapRef);
		onMounted(async () => {
		const { control, setOptions } = await import(
		@@ -19,7 +19,7 @@ export default {
		mapRef.value = control.layers(null, null, options);
		propsBinder(methods, mapRef.value, props, setOptions);

		lMethods.registerLayerControl({
		registerLayerControl({
		...props,
		...methods,
		mapObject: mapRef.value,

src/components/LMap.vue

+8 −54

Original line number	Diff line number	Diff line
		@@ -19,6 +19,11 @@ import {
		debounce,
		resetWebpackIcon,
		} from "../utils.js";
		import {
		buildAddMapLayer,
		buildRegisterLayerControl,
		buildRemoveMapLayer,
		} from "../functions/map";

		export default {
		props: {
		@@ -168,13 +173,9 @@ export default {
		markerZoomAnimation: props.markerZoomAnimation,
		};

		const schematics = reactive({
		addLayer() {},
		removeLayer() {},
		registerLayerControl() {},
		});

		provide("leafLetMethods", schematics);
		provide("addMapLayer", buildAddMapLayer(blueprint));
		provide("removeMapLayer", buildRemoveMapLayer(blueprint));
		provide("registerLayerControl", buildRegisterLayerControl(blueprint));

		const eventHandlers = {
		moveEndHandler() {
		@@ -223,49 +224,6 @@ export default {
		options.crs = options.crs \|\| CRS.EPSG3857;

		const methods = {
		addLayer(layer) {
		if (layer.layerType !== undefined) {
		if (blueprint.layerControl === undefined) {
		blueprint.layersToAdd.push(layer);
		} else {
		const exist = blueprint.layersInControl.find(
		(l) => l.mapObject._leaflet_id === layer.mapObject._leaflet_id
		);
		if (!exist) {
		blueprint.layerControl.addLayer(layer);
		blueprint.layersInControl.push(layer);
		}
		}
		}
		if (layer.visible !== false) {
		blueprint.mapRef.addLayer(layer.mapObject);
		}
		},
		removeLayer(layer) {
		if (layer.layerType !== undefined) {
		if (blueprint.layerControl === undefined) {
		blueprint.layersToAdd = blueprint.layersToAdd.filter(
		(l) => l.name !== layer.name
		);
		} else {
		blueprint.layerControl.removeLayer(layer.mapObject);
		blueprint.layersInControl = blueprint.layersInControl.filter(
		(l) => l.mapObject._leaflet_id !== layer.mapObject._leaflet_id
		);
		}
		}
		blueprint.mapRef.removeLayer(layer.mapObject);
		},

		registerLayerControl(lControlLayer) {
		blueprint.layerControl = lControlLayer;
		blueprint.mapRef.addControl(lControlLayer.mapObject);
		blueprint.layersToAdd.forEach((layer) => {
		blueprint.layerControl.addLayer(layer);
		});
		blueprint.layersToAdd = [];
		},

		setZoom(newVal) {
		blueprint.mapRef.setZoom(newVal, {
		animate: props.noBlockingAnimations ? false : null,
		@@ -330,10 +288,6 @@ export default {
		},
		};

		schematics.addLayer = methods.addLayer;
		schematics.removeLayer = methods.removeLayer;
		schematics.registerLayerControl = methods.registerLayerControl;

		blueprint.mapRef = map(root.value, options);

		propsBinder(methods, blueprint.mapRef, props, setOptions);

src/components/LMarker.vue

+2 −2

Original line number	Diff line number	Diff line
		@@ -17,7 +17,7 @@ export default {
		latLng() {},
		});

		const lMethods = inject("leafLetMethods");
		const addMapLayer = inject("addMapLayer");
		const { options, methods } = markerSetup(
		props,
		mapRef,
		@@ -38,7 +38,7 @@ export default {

		mapRef.value.on("move", debounce(methods.latLngSync, 100));
		propsBinder(methods, mapRef.value, props, setOptions);
		lMethods.addLayer({ ...props, ...methods, mapObject: mapRef.value });
		addMapLayer({ ...props, ...methods, mapObject: mapRef.value });
		ready.value = true;
		});
		return { ready };

src/components/LTileLayer.vue

+2 −2

Original line number	Diff line number	Diff line
		@@ -7,7 +7,7 @@ export default {
		props,
		setup(props, context) {
		const mapRef = ref({});
		const lMethods = inject("leafLetMethods");
		const addMapLayer = inject("addMapLayer");

		const { options, methods } = tileLayerSetup(props, mapRef);

		@@ -21,7 +21,7 @@ export default {
		DomEvent.on(mapRef.value, listeners);

		propsBinder(methods, mapRef.value, props, setOptions);
		lMethods.addLayer({ ...props, ...methods, mapObject: mapRef.value });
		addMapLayer({ ...props, ...methods, mapObject: mapRef.value });
		});
		},
		render() {

src/functions/layer.js

+9 −9

Original line number	Diff line number	Diff line
		@@ -27,7 +27,8 @@ export const props = {
		};

		export const setup = (props, mapRef, context) => {
		const lMethods = inject("leafLetMethods");
		const addMapLayer = inject("addMapLayer");
		const removeMapLayer = inject("removeMapLayer");
		const options = {
		attribution: props.attribution,
		pane: props.pane,
		@@ -39,23 +40,23 @@ export const setup = (props, mapRef, context) => {
		attributionControl.removeAttribution(old).addAttribution(val);
		},
		setName() {
		lMethods.removeLayer(mapRef.value);
		removeMapLayer(mapRef.value);
		if (props.visible) {
		lMethods.addLayer(mapRef.value);
		addMapLayer(mapRef.value);
		}
		},
		setLayerType() {
		lMethods.removeLayer(mapRef.value);
		removeMapLayer(mapRef.value);
		if (props.visible) {
		lMethods.addLayer(mapRef.value);
		addMapLayer(mapRef.value);
		}
		},
		setVisible(isVisible) {
		if (mapRef.value) {
		if (isVisible) {
		lMethods.addLayer(mapRef.value);
		addMapLayer(mapRef.value);
		} else {
		lMethods.removeLayer(mapRef.value);
		removeMapLayer(mapRef.value);
		}
		}
		},
		@@ -85,7 +86,6 @@ export const setup = (props, mapRef, context) => {
		};

		provide("leafLetMethods", {
		...lMethods,
		bindTooltip: methods.bindTooltip,
		unbindTooltip: methods.unbindTooltip,
		});
		@@ -93,7 +93,7 @@ export const setup = (props, mapRef, context) => {
		onUnmounted(() => {
		methods.unbindPopup();
		methods.unbindTooltip();
		lMethods.removeLayer({ mapObject: mapRef.value });
		removeMapLayer({ mapObject: mapRef.value });
		});

		return { options, methods };