@cn-map/gaode-svelte 0.0.0 → 0.0.1

package/dist/overlay/index-cluster/index-cluster.svelte

@@ -0,0 +1,135 @@
+<script lang="ts">
+  import type { MapEventProps } from '@cn-map/gaode-shared/types'
+  import type { Instance } from '../../types/index.js'
+  import { click } from '@cn-map/gaode-shared/const'
+  import { clone, eventsToProps } from '@cn-map/gaode-shared/utils'
+  import { untrack } from 'svelte'
+  import { createEventListeners } from '../../hooks/index.js'
+  import { useMapInstance } from '../../map'
+  import { omitProps, snapshot } from '../../utils/index.js'
+
+  type IndexClusterEvents = MapEventProps<AMap.IndexClusterEventType, AMap.IndexCluster>
+  interface IndexClusterExtraInitOptions {
+    /**
+     * 点标记聚合数据项
+     */
+    data: AMap.IndexClusterDataOptions[]
+    /**
+     * 地图对象
+     */
+    map?: AMap.Map
+  }
+  type IndexClusterInitOptions = AMap.IndexClusterOptions & IndexClusterExtraInitOptions & Instance<AMap.IndexCluster>
+
+  export type IndexClusterProps = IndexClusterInitOptions & IndexClusterEvents
+
+  const indexClusterEvents: AMap.IndexClusterEventType[] = [click]
+
+  let { instance = $bindable(), data, ...props }: IndexClusterProps = $props()
+
+  const map = $derived.by(useMapInstance(() => props.map))
+  const restProps = omitProps(() => props, 'map', ...eventsToProps(indexClusterEvents))
+
+  const indexCluster = $state.raw<AMap.IndexCluster>(
+    new AMap.IndexCluster(
+      null,
+      clone(
+        untrack(() => data),
+        true
+      ),
+      snapshot(restProps)
+    )
+  )
+
+  // whether the indexCluster is added to the map
+  let isMounted = $state(false)
+
+  $effect(() => {
+    instance = indexCluster
+
+    return () => {
+      instance = null
+    }
+  })
+
+  $effect(() => {
+    indexCluster.i = null
+    indexCluster.setMap(map)
+    isMounted = !!indexCluster.getMap()
+
+    return () => {
+      indexCluster.setMap(null)
+      isMounted = false
+    }
+  })
+
+  $effect(() => {
+    if (!isMounted) return
+
+    indexCluster.setData(clone(data, true))
+
+    return () => {
+      indexCluster.setData([])
+    }
+  })
+
+  function getDefaultStyles() {
+    const markerCluster = new AMap.IndexCluster()
+    const styles = markerCluster.getStyles()
+    markerCluster.setMap(null)
+
+    return styles
+  }
+
+  $effect(() => {
+    if (!isMounted) return
+    if (restProps.averageCenter !== undefined) {
+      indexCluster.setAverageCenter(restProps.averageCenter)
+    }
+  })
+
+  $effect(() => {
+    if (!isMounted) return
+    indexCluster.clusterByZoomChange = restProps.clusterByZoomChange || false
+  })
+
+  $effect(() => {
+    if (!isMounted) return
+    indexCluster.customRender = restProps.customRender || null
+  })
+
+  $effect(() => {
+    if (!isMounted) return
+    if (restProps.gridSize !== undefined) {
+      indexCluster.setGridSize(restProps.gridSize)
+    }
+  })
+
+  $effect(() => {
+    if (!isMounted) return
+    if (restProps.maxZoom !== undefined) {
+      indexCluster.setMaxZoom(restProps.maxZoom)
+    }
+  })
+
+  $effect(() => {
+    if (!isMounted) return
+    indexCluster.renderClusterMarker = restProps.renderClusterMarker || null
+  })
+
+  $effect(() => {
+    if (!isMounted) return
+    indexCluster.setRenderMarkerStyle(restProps.renderMarker || null)
+  })
+
+  $effect(() => {
+    if (!isMounted) return
+    indexCluster.setStyles(snapshot(restProps.styles) ?? getDefaultStyles())
+  })
+
+  createEventListeners<AMap.IndexClusterEventType, AMap.IndexCluster>(
+    () => indexCluster,
+    () => props,
+    indexClusterEvents
+  )
+</script>

package/dist/overlay/index-cluster/index-cluster.svelte.d.ts

@@ -0,0 +1,18 @@
+import type { MapEventProps } from '@cn-map/gaode-shared/types';
+import type { Instance } from '../../types/index.ts';
+type IndexClusterEvents = MapEventProps<AMap.IndexClusterEventType, AMap.IndexCluster>;
+interface IndexClusterExtraInitOptions {
+    /**
+     * 点标记聚合数据项
+     */
+    data: AMap.IndexClusterDataOptions[];
+    /**
+     * 地图对象
+     */
+    map?: AMap.Map;
+}
+type IndexClusterInitOptions = AMap.IndexClusterOptions & IndexClusterExtraInitOptions & Instance<AMap.IndexCluster>;
+export type IndexClusterProps = IndexClusterInitOptions & IndexClusterEvents;
+declare const IndexCluster: import("svelte").Component<IndexClusterProps, {}, "instance">;
+type IndexCluster = ReturnType<typeof IndexCluster>;
+export default IndexCluster;

package/dist/overlay/index-cluster/index.d.ts

@@ -0,0 +1,2 @@
+export { default as IndexCluster } from './index-cluster.svelte';
+export type { IndexClusterProps } from './index-cluster.svelte';

package/dist/overlay/index-cluster/index.js

@@ -0,0 +1 @@
+export { default as IndexCluster } from './index-cluster.svelte';

package/dist/overlay/index.d.ts

@@ -0,0 +1,17 @@
+export { BezierCurve, type BezierCurveProps } from './bezier-curve';
+export { Circle, type CircleProps } from './circle';
+export { CircleMarker, type CircleMarkerProps } from './circle-marker';
+export { ContextMenu, type ContextMenuProps } from './context-menu';
+export { ElasticMarker, type ElasticMarkerProps } from './elastic-marker';
+export { Ellipse, type EllipseProps } from './ellipse';
+export { IndexCluster, type IndexClusterProps } from './index-cluster';
+export { InfoWindow, type InfoWindowProps } from './info-window';
+export { LabelMarker, type LabelMarkerProps } from './label-marker';
+export { Marker, type MarkerProps } from './marker';
+export { MarkerCluster, type MarkerClusterProps } from './marker-cluster';
+export { MassMarks, type MassMarksProps } from './mass-marks';
+export { OverlayGroup, type OverlayGroupProps } from './overlay-group';
+export { Polygon, type PolygonProps } from './polygon';
+export { Polyline, type PolylineProps } from './polyline';
+export { Rectangle, type RectangleProps } from './rectangle';
+export { Text, type TextProps } from './text';

package/dist/overlay/index.js

@@ -0,0 +1,17 @@
+export { BezierCurve } from './bezier-curve';
+export { Circle } from './circle';
+export { CircleMarker } from './circle-marker';
+export { ContextMenu } from './context-menu';
+export { ElasticMarker } from './elastic-marker';
+export { Ellipse } from './ellipse';
+export { IndexCluster } from './index-cluster';
+export { InfoWindow } from './info-window';
+export { LabelMarker } from './label-marker';
+export { Marker } from './marker';
+export { MarkerCluster } from './marker-cluster';
+export { MassMarks } from './mass-marks';
+export { OverlayGroup } from './overlay-group';
+export { Polygon } from './polygon';
+export { Polyline } from './polyline';
+export { Rectangle } from './rectangle';
+export { Text } from './text';

package/dist/overlay/info-window/index.d.ts

@@ -0,0 +1,2 @@
+export { default as InfoWindow } from './info-window.svelte';
+export type { InfoWindowProps } from './info-window.svelte';

package/dist/overlay/info-window/index.js

@@ -0,0 +1 @@
+export { default as InfoWindow } from './info-window.svelte';

package/dist/overlay/info-window/info-window.svelte

@@ -0,0 +1,88 @@
+<script lang="ts">
+  import type { MapEventProps } from '@cn-map/gaode-shared/types'
+  import type { Snippet } from 'svelte'
+  import type { Instance } from '../../types/index.js'
+  import { close, open } from '@cn-map/gaode-shared/const'
+  import { eventsToProps } from '@cn-map/gaode-shared/utils'
+  import { onDestroy } from 'svelte'
+  import { createEventListeners } from '../../hooks/index.js'
+  import { useMapInstance } from '../../map'
+  import { omitProps, snapshot } from '../../utils/index.js'
+  import { CustomContent, useDOMOverlayAttributes } from '../dom-overlay'
+
+  type InfoWindowAttributes = Omit<InfoWindowInitOptions, 'map' | 'instance'>
+  type InfoWindowEvents<ExtData> = MapEventProps<AMap.InfoWindowEventType, AMap.InfoWindow<ExtData>>
+  type InfoWindowInitOptions<ExtData = any> = AMap.InfoWindowOptions<ExtData> & Instance<AMap.InfoWindow<ExtData>>
+
+  export type InfoWindowProps<ExtData = any> = InfoWindowInitOptions<ExtData>
+    & InfoWindowEvents<ExtData> & { children?: Snippet }
+
+  const infoWindowEvents: AMap.InfoWindowEventType[] = [close, open]
+
+  let { instance = $bindable(), children, ...props }: InfoWindowProps = $props()
+
+  const map = $derived.by(useMapInstance(() => props.map))
+  const restProps = omitProps(() => props, 'map', ...eventsToProps(infoWindowEvents))
+
+  const infoWindow = $state.raw<AMap.InfoWindow>(new AMap.InfoWindow(snapshot(restProps)))
+
+  $effect(() => {
+    instance = infoWindow
+
+    return () => {
+      instance = null
+    }
+  })
+
+  $effect(() => {
+    if (!map) return
+
+    map.add(infoWindow)
+
+    return () => {
+      map.remove(infoWindow)
+    }
+  })
+
+  const rest = omitProps(
+    () => restProps,
+    'anchor',
+    'content',
+    'offset',
+    'orientation',
+    'position',
+    'rotate',
+    'size',
+    'visible',
+    'zIndex',
+    'extData'
+  )
+
+  $effect(() => {
+    infoWindow.setExtData(snapshot(restProps.extData))
+  })
+
+  $effect(() => {
+    infoWindow.setOptions(snapshot(rest))
+  })
+
+  useDOMOverlayAttributes<AMap.InfoWindow, InfoWindowAttributes, AMap.InfoWindowEventType>(
+    () => infoWindow,
+    restProps,
+    () => children
+  )
+
+  createEventListeners<AMap.InfoWindowEventType, AMap.InfoWindow>(
+    () => infoWindow,
+    () => props,
+    infoWindowEvents
+  )
+
+  onDestroy(() => infoWindow.destroy())
+</script>
+
+{#if children}
+  <CustomContent instance={infoWindow}>
+    {@render children()}
+  </CustomContent>
+{/if}

package/dist/overlay/info-window/info-window.svelte.d.ts

@@ -0,0 +1,11 @@
+import type { MapEventProps } from '@cn-map/gaode-shared/types';
+import type { Snippet } from 'svelte';
+import type { Instance } from '../../types/index.ts';
+type InfoWindowEvents<ExtData> = MapEventProps<AMap.InfoWindowEventType, AMap.InfoWindow<ExtData>>;
+type InfoWindowInitOptions<ExtData = any> = AMap.InfoWindowOptions<ExtData> & Instance<AMap.InfoWindow<ExtData>>;
+export type InfoWindowProps<ExtData = any> = InfoWindowInitOptions<ExtData> & InfoWindowEvents<ExtData> & {
+    children?: Snippet;
+};
+declare const InfoWindow: import("svelte").Component<InfoWindowProps<any>, {}, "instance">;
+type InfoWindow = ReturnType<typeof InfoWindow>;
+export default InfoWindow;

package/dist/overlay/label-marker/index.d.ts

@@ -0,0 +1,2 @@
+export { default as LabelMarker } from './label-marker.svelte';
+export type { LabelMarkerProps } from './label-marker.svelte';

package/dist/overlay/label-marker/index.js

@@ -0,0 +1 @@
+export { default as LabelMarker } from './label-marker.svelte';

package/dist/overlay/label-marker/label-marker.svelte

@@ -0,0 +1,149 @@
+<script lang="ts" generics="ExtData">
+  import type { MapEventProps } from '@cn-map/gaode-shared/types'
+  import type { Instance } from '../../types/index.js'
+  import {
+    click,
+    mouseDown,
+    mouseMove,
+    mouseOut,
+    mouseOver,
+    mouseUp,
+    touchEnd,
+    touchMove,
+    touchStart,
+  } from '@cn-map/gaode-shared/const'
+  import { eventsToProps } from '@cn-map/gaode-shared/utils'
+  import { createEventListeners } from '../../hooks/index.js'
+  import { useLabelsLayerInstance } from '../../layer/labels-layer/context'
+  import { omitProps, snapshot } from '../../utils/index.js'
+
+  type LabelMarkerEvents<ExtData> = MapEventProps<AMap.LabelMarkerEventType, AMap.LabelMarker<ExtData>>
+  interface LabelMarkerExtraInitOptions {
+    /**
+     * 是否置顶
+     */
+    isTop?: boolean
+  }
+  type LabelMarkerInitOptions<ExtData = any> = AMap.LabelMarkerOptions<ExtData>
+    & LabelMarkerExtraInitOptions
+    & Instance<AMap.LabelMarker<ExtData>>
+
+  export type LabelMarkerProps<ExtData = any> = LabelMarkerInitOptions<ExtData> & LabelMarkerEvents<ExtData>
+
+  const labelMarkerEvents: AMap.LabelMarkerEventType[] = [
+    click,
+    mouseMove,
+    mouseOver,
+    mouseOut,
+    mouseDown,
+    mouseUp,
+    touchStart,
+    touchMove,
+    touchEnd,
+  ]
+
+  let { instance = $bindable(), ...props }: LabelMarkerProps = $props()
+
+  const restProps = omitProps(() => props, ...eventsToProps(labelMarkerEvents))
+
+  const getLabelsLayer = useLabelsLayerInstance()
+
+  const labelMarker = $state.raw<AMap.LabelMarker<ExtData>>(new AMap.LabelMarker(restProps))
+
+  $effect(() => {
+    instance = labelMarker
+
+    return () => {
+      instance = null
+    }
+  })
+
+  $effect(() => {
+    const labelsLayer = getLabelsLayer()
+    if (!labelsLayer) return
+
+    labelsLayer.add(labelMarker)
+
+    return () => {
+      labelsLayer.remove(labelMarker)
+    }
+  })
+
+  $effect(() => {
+    labelMarker.setCursor(restProps.cursor)
+  })
+
+  $effect(() => {
+    labelMarker.setExtData(snapshot(restProps.extData))
+  })
+
+  $effect(() => {
+    labelMarker.setIcon(snapshot(restProps.icon))
+  })
+
+  $effect(() => {
+    if (restProps.name !== undefined) {
+      labelMarker.setName(restProps.name)
+    }
+  })
+
+  $effect(() => {
+    labelMarker.setOpacity(restProps.opacity)
+  })
+
+  $effect(() => {
+    labelMarker.setOrientation(restProps.orientation)
+  })
+
+  $effect(() => {
+    if (restProps.position !== undefined) {
+      labelMarker.setPosition(snapshot(restProps.position))
+    }
+  })
+
+  $effect(() => {
+    if (restProps.rank !== undefined) {
+      labelMarker.setRank(restProps.rank)
+    }
+  })
+
+  $effect(() => {
+    labelMarker.setRichText(snapshot(restProps.richText))
+  })
+
+  $effect(() => {
+    if (restProps.rotation !== undefined) {
+      labelMarker.setRotation(restProps.rotation)
+    }
+  })
+
+  $effect(() => {
+    if (restProps.text !== undefined) {
+      labelMarker.setText(snapshot(restProps.text))
+    }
+  })
+
+  $effect(() => {
+    labelMarker.setTop(restProps.isTop)
+  })
+
+  $effect(() => {
+    labelMarker.setVisible(restProps.visible)
+  })
+
+  $effect(() => {
+    labelMarker.setZooms(snapshot(restProps.zooms))
+  })
+
+  $effect(() => {
+    if (restProps.zIndex !== undefined) {
+      labelMarker.setzIndex(restProps.zIndex)
+    }
+  })
+
+  createEventListeners<AMap.LabelMarkerEventType, AMap.LabelMarker<ExtData>>(
+    () => labelMarker,
+    () => props,
+    labelMarkerEvents
+  )
+</script>

package/dist/overlay/label-marker/label-marker.svelte.d.ts

@@ -0,0 +1,35 @@
+import type { MapEventProps } from '@cn-map/gaode-shared/types';
+import type { Instance } from '../../types/index.ts';
+type LabelMarkerEvents<ExtData> = MapEventProps<AMap.LabelMarkerEventType, AMap.LabelMarker<ExtData>>;
+interface LabelMarkerExtraInitOptions {
+    /**
+     * 是否置顶
+     */
+    isTop?: boolean;
+}
+type LabelMarkerInitOptions<ExtData = any> = AMap.LabelMarkerOptions<ExtData> & LabelMarkerExtraInitOptions & Instance<AMap.LabelMarker<ExtData>>;
+export type LabelMarkerProps<ExtData = any> = LabelMarkerInitOptions<ExtData> & LabelMarkerEvents<ExtData>;
+declare function $$render<ExtData>(): {
+    props: LabelMarkerProps;
+    exports: {};
+    bindings: "instance";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<ExtData> {
+    props(): ReturnType<typeof $$render<ExtData>>['props'];
+    events(): ReturnType<typeof $$render<ExtData>>['events'];
+    slots(): ReturnType<typeof $$render<ExtData>>['slots'];
+    bindings(): "instance";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <ExtData>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<ExtData>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<ExtData>['props']>, ReturnType<__sveltets_Render<ExtData>['events']>, ReturnType<__sveltets_Render<ExtData>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<ExtData>['bindings']>;
+    } & ReturnType<__sveltets_Render<ExtData>['exports']>;
+    <ExtData>(internal: unknown, props: ReturnType<__sveltets_Render<ExtData>['props']> & {}): ReturnType<__sveltets_Render<ExtData>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const LabelMarker: $$IsomorphicComponent;
+type LabelMarker<ExtData> = InstanceType<typeof LabelMarker<ExtData>>;
+export default LabelMarker;

package/dist/overlay/marker/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Marker } from './marker.svelte';
+export type { MarkerProps } from './marker.svelte';

package/dist/overlay/marker/index.js

@@ -0,0 +1 @@
+export { default as Marker } from './marker.svelte';

package/dist/overlay/marker/marker.svelte

@@ -0,0 +1,67 @@
+<script lang="ts" generics="ExtData">
+  import type { MapEventProps } from '@cn-map/gaode-shared/types'
+  import type { Snippet } from 'svelte'
+  import type { Instance } from '../../types/index.js'
+  import type { MarkerExtraInitOptions } from './use-attributes.svelte'
+  import { eventsToProps } from '@cn-map/gaode-shared/utils'
+  import { onDestroy } from 'svelte'
+  import { createEventListeners } from '../../hooks/index.js'
+  import { useMapInstance } from '../../map'
+  import { omitProps, snapshot } from '../../utils/index.js'
+  import { CustomContent, domOverlayEvents } from '../dom-overlay'
+  import { useMarkerAttributes } from './use-attributes.svelte'
+
+  type MarkerEvents<ExtData> = MapEventProps<AMap.MarkerEventType, AMap.Marker<ExtData>>
+  type MarkerInitOptions<ExtData> = AMap.MarkerOptions<ExtData>
+    & MarkerExtraInitOptions
+    & Instance<AMap.Marker<ExtData>>
+
+  export type MarkerProps<ExtData = any> = MarkerInitOptions<ExtData> & MarkerEvents<ExtData> & { children?: Snippet }
+
+  const markerEvents: AMap.MarkerEventType[] = domOverlayEvents
+
+  let { instance = $bindable(), children, ...props }: MarkerProps = $props()
+
+  const map = $derived.by(useMapInstance(() => props.map))
+  const restProps = omitProps(() => props, 'map', ...eventsToProps(markerEvents))
+
+  const marker = $state.raw<AMap.Marker<ExtData>>(new AMap.Marker(snapshot(restProps)))
+
+  $effect(() => {
+    instance = marker
+
+    return () => {
+      instance = null
+    }
+  })
+
+  $effect(() => {
+    if (!map) return
+
+    map.add(marker)
+
+    return () => {
+      map.remove(marker)
+    }
+  })
+
+  useMarkerAttributes(
+    () => marker,
+    restProps,
+    () => children
+  )
+
+  createEventListeners<AMap.MarkerEventType, AMap.Marker<ExtData>>(
+    () => marker,
+    () => props,
+    markerEvents
+  )
+
+  onDestroy(() => marker.destroy())
+</script>
+
+{#if children}
+  <CustomContent instance={marker}>
+    {@render children()}
+  </CustomContent>
+{/if}

package/dist/overlay/marker/marker.svelte.d.ts

@@ -0,0 +1,33 @@
+import type { MapEventProps } from '@cn-map/gaode-shared/types';
+import type { Snippet } from 'svelte';
+import type { Instance } from '../../types/index.ts';
+import type { MarkerExtraInitOptions } from './use-attributes.svelte';
+type MarkerEvents<ExtData> = MapEventProps<AMap.MarkerEventType, AMap.Marker<ExtData>>;
+type MarkerInitOptions<ExtData> = AMap.MarkerOptions<ExtData> & MarkerExtraInitOptions & Instance<AMap.Marker<ExtData>>;
+export type MarkerProps<ExtData = any> = MarkerInitOptions<ExtData> & MarkerEvents<ExtData> & {
+    children?: Snippet;
+};
+declare function $$render<ExtData>(): {
+    props: MarkerProps;
+    exports: {};
+    bindings: "instance";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<ExtData> {
+    props(): ReturnType<typeof $$render<ExtData>>['props'];
+    events(): ReturnType<typeof $$render<ExtData>>['events'];
+    slots(): ReturnType<typeof $$render<ExtData>>['slots'];
+    bindings(): "instance";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <ExtData>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<ExtData>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<ExtData>['props']>, ReturnType<__sveltets_Render<ExtData>['events']>, ReturnType<__sveltets_Render<ExtData>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<ExtData>['bindings']>;
+    } & ReturnType<__sveltets_Render<ExtData>['exports']>;
+    <ExtData>(internal: unknown, props: ReturnType<__sveltets_Render<ExtData>['props']> & {}): ReturnType<__sveltets_Render<ExtData>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const Marker: $$IsomorphicComponent;
+type Marker<ExtData> = InstanceType<typeof Marker<ExtData>>;
+export default Marker;

package/dist/overlay/marker/use-attributes.svelte.d.ts

@@ -0,0 +1,13 @@
+import type { Accessor } from '@cn-map/gaode-shared/types';
+import type { Snippet } from 'svelte';
+import type { Instance } from '../../types/index.ts';
+export interface MarkerExtraInitOptions {
+    /**
+     * 是否置顶
+     */
+    isTop?: boolean;
+}
+export declare const markerEvents: AMap.MarkerEventType[];
+type MarkerAttributes<ExtData = any> = Omit<AMap.MarkerOptions<ExtData> & MarkerExtraInitOptions & Instance<AMap.Marker<ExtData>>, 'map' | 'instance'>;
+export declare function useMarkerAttributes<ExtData = any>(marker: Accessor<AMap.Marker<ExtData>>, props: MarkerAttributes<ExtData>, children?: Accessor<Snippet | undefined>): void;
+export {};

package/dist/overlay/marker/use-attributes.svelte.js

@@ -0,0 +1,58 @@
+import { omitProps, snapshot } from "../../utils/index.js";
+import { domOverlayEvents, useDOMOverlayAttributes } from '../dom-overlay';
+export const markerEvents = domOverlayEvents;
+export function useMarkerAttributes(marker, props, children) {
+    const rest = omitProps(() => props, [
+        'anchor',
+        'content',
+        'offset',
+        'orientation',
+        'position',
+        'rotate',
+        'size',
+        'visible',
+        'zIndex',
+        'clickable',
+        'cursor',
+        'draggable',
+        'extData',
+        'icon',
+        'label',
+        'title',
+        'isTop',
+    ]);
+    $effect(() => {
+        marker().setClickable(props.clickable);
+    });
+    $effect(() => {
+        marker().setCursor(props.cursor);
+    });
+    $effect(() => {
+        if (props.draggable !== undefined) {
+            marker().setDraggable(props.draggable);
+        }
+    });
+    $effect(() => {
+        marker().setExtData(snapshot(props.extData));
+    });
+    $effect(() => {
+        marker().setIcon(snapshot(props.icon));
+    });
+    $effect(() => {
+        if (props.label !== undefined) {
+            marker().setLabel(snapshot(props.label));
+        }
+    });
+    $effect(() => {
+        if (props.title !== undefined) {
+            marker().setTitle(snapshot(props.title));
+        }
+    });
+    $effect(() => {
+        marker().setTop(props.isTop);
+    });
+    $effect(() => {
+        marker().setOptions(snapshot(rest));
+    });
+    useDOMOverlayAttributes(marker, props, children);
+}