feat: add LGeoJson

<script>

import { onMounted, ref, inject } from "vue";

import { remapEvents, propsBinder } from "../utils.js";

import { props, setup as geoJSONSetup } from "../functions/geoJSON";

import { render } from "../functions/layer";

export default {

  props,

  setup(props, context) {

    const leafletRef = ref({});

    const ready = ref(false);

    const addLayer = inject("addLayer");

    const { methods, options } = geoJSONSetup(props, leafletRef);

    onMounted(async () => {

      const { geoJSON, DomEvent, setOptions } = await import(

        "leaflet/dist/leaflet-src.esm"

      );

      leafletRef.value = geoJSON(props.geojson, options);

      const listeners = remapEvents(context.attrs);

      DomEvent.on(leafletRef.value, listeners);

      propsBinder(methods, leafletRef.value, props, setOptions);

      addLayer({

        ...props,

        ...methods,

        leafletObject: leafletRef.value,

      });

      ready.value = true;

    });

    return render(ready, context);

  },

};

</script>

import {

  props as layerGroupProps,

  setup as layerGroupSetup,

} from "./layerGroup";

export const props = {

  ...layerGroupProps,

  geojson: {

    type: [Object, Array],

    default: () => ({}),

  },

};

export const setup = (props, leafletRef) => {

  const { options: layerOptions, methods: layerGroupMethods } = layerGroupSetup(

    props,

    leafletRef

  );

  const options = {

    ...layerOptions,

    ...props,

  };

  const methods = {

    ...layerGroupMethods,

    setGeojson(newVal) {

      leafletRef.value.clearLayers();

      leafletRef.value.addData(newVal);

    },

    getGeoJSONData() {

      return leafletRef.value.toGeoJSON();

    },

    getBounds() {

      return leafletRef.value.getBounds();

    },

  };

  return { options, methods };

};