tg-map-vue3/dist/tg-map.js

封装 百度地图, Google地图, Here地图(未完成), Maptalks 的Vue3组件库

import { noop as L, typed as M, lateinit as l, path as te, throwError as S, Arrays as V, deepEqual as se } from "tg-commons";
import { Strings as G, TgMapType as D, unwrapStringEnumValue as d, loadCachedMap as ie, TgMapFactory as re, BuildInMapTypeId as z, GestureHandlingOptions as W, bindEvents as v, MapType as oe, Objects as ae, InfoWindowModeValues as ne, LatLng as y, dimen as le, ControlPosition as m, CustomControl as he, MapTypeControlType as de, TrafficLayer as pe, MapPane as x, ElementOverlay as me, BaiduMarker as q, GoogleMap as X, wrapComponentElementForGoogle as K, setTgMapConfig as ce } from "tg-map-core";
export * from "tg-map-core";
import { createCommentVNode as Z, computed as J, defineComponent as n, markRaw as ue, watch as T, createElementBlock as b, openBlock as C, mergeProps as w, createElementVNode as fe, renderSlot as f, normalizeClass as A, normalizeStyle as ye, getCurrentInstance as ve, inject as ge, onBeforeUnmount as $e, onMounted as be, toRaw as B, withDirectives as Ce, vShow as _e } from "vue";
import "tg-map-core/dist/tg-map-core.css";
function u(e, t) {
  return {
    type: String,
    default: t,
    validator: (i) => Object.values(e).includes(i)
  };
}
function ke(e, t) {
  return {
    type: String,
    default: t,
    validator: (i) => e.includes(i)
  };
}
function c(e) {
  return {
    type: e,
    required: !0
  };
}
function s(e, t) {
  return {
    type: e,
    default: t
  };
}
function tt(e) {
  const t = {};
  return Object.entries(e).forEach(([i, r]) => {
    const o = `__${i}`;
    t[i] = {
      get() {
        const a = this[o];
        return a === void 0 ? r : a;
      },
      set(a) {
        this[o] = a;
      }
      // Vue3已经不支持该属性
      // cache: false
    };
  }), t;
}
const I = {
  enumerable: !0,
  configurable: !0,
  get: L,
  set: L
};
function Te(e) {
  return Object.keys(e).forEach((t) => {
    const i = e[t];
    let r = !1;
    typeof i == "function" ? (I.get = i, I.set = L, r = !0) : typeof i == "object" && typeof i.get == "function" && (I.get = i.get, I.set = i.set, r = !0), r && (e[t] = Object.defineProperty(e, t, I));
  }), e;
}
function st(e) {
  return Te(e);
}
function E() {
  return Z();
}
function k(e, t) {
  const i = e.$options[t];
  if (i)
    for (const r of i)
      r.call(e);
}
function it(e, t) {
  for (const i of e)
    if (i.$options.name === t.name)
      return i;
}
function rt(e, t) {
  if (!e.default) return;
  const i = e.default();
  for (const r of i)
    if ((r == null ? void 0 : r.type).name === t.name)
      return r;
}
function Oe(e, t) {
  const i = {}, r = {}, o = {};
  return Object.keys(e).forEach((a) => {
    a.startsWith("on") ? i[G.pascal2kebab(a.substring(2))] = e[a] : r[a] = e[a];
  }), t && Object.keys(t).forEach((a) => {
    a.startsWith("on") && (o[G.pascal2kebab(a.substring(2))] = t[a]);
  }), {
    /** class/style/未声明的属性 等 */
    binds: r,
    /** 未声明的事件 */
    listeners: i,
    /** 声明在`props`中的事件 */
    listenerProps: o
  };
}
function g(e, t) {
  return J(() => Oe(e, t));
}
function h() {
  return Function;
}
const ot = () => {
  let e, t;
  function i(o) {
    console.log(o), e = o && o.type, t = Date.now();
  }
  function r(o) {
    ((o && o.type) !== e || Date.now() - (t ?? 0) > 1e3) && i(o);
  }
  return { eventLog: i, eventLogLess: r };
};
function R(e, t) {
  return (e == null ? void 0 : e.$options.name) === t.name;
}
function Y(e, t) {
  return R(e, t) ? e : void 0;
}
function U(e, t, i) {
  let r = t;
  for (; r; ) {
    if (R(r, e))
      return r;
    if (i && R(r, i))
      return;
    r = r.$parent;
  }
}
const j = "$map", O = "onCreate", P = "onDestroy", p = n({
  inject: [j],
  mounted() {
    k(this, O);
  },
  beforeUnmount() {
    k(this, P);
  },
  methods: {
    recreate() {
      k(this, P), k(this, O);
    }
  },
  render() {
    return E();
  }
}), Pe = {
  /** type没做响应式, 但外部可以把type作为tg-map的key, 让type修改时完全重建tg-map */
  type: u(D, D.google),
  /**
   * 当对该属性使用双向绑定时, 改变center将触发update:center又反过来触发center改变, 最终导致无限循环...
   * 当前通过setCenter()时判断center是否有改变来避免该问题, 但为了避免可能存在的问题, 另外设计了如下机制:
   * - :center-sync-delay="300": 延时同步center, 防止center的值更新过快
   * - :current-center.sync="currentCenter": 实时获取center的值
   * - :last-center.sync="center": 获取tg-map销毁时的最后的center的值, 使用这种方式可以做到type切换时保留中心点位置
   * @see AbstractMapEventMap.center-changed
   */
  center: c(y),
  /**
   * 同步center的延时
   * @default 300
   * @see center
   */
  centerSyncDelay: s(Number, 300),
  /**
   * 仅用来获取center的值, 需要设置center的值请使用`center`属性
   * @see center
   * @deprecated 用的太少, 故maptalks未实现该属性, 要实时获取中心点, 请将{@link centerSyncDelay}设为0
   */
  currentCenter: s(y),
  /**
   * 仅用于获取tg-map销毁时的最后的center的值
   * @see center
   * @deprecated 用的太少, 故maptalks未实现该属性
   */
  lastCenter: s(y),
  zoom: c(Number),
  /**
   * 该属性不会响应式更新, 要让它立即生效, 请参考{@link file://./../views/map/InfoDemo.vue#L3}
   * @see MapOptions.infoWindowMode
   */
  infoWindowMode: ke(ne),
  gestureHandling: u(W),
  fractionalZoom: s(Boolean),
  minZoom: s(Number),
  maxZoom: s(Number),
  mapStyle: s(Object),
  mapTypeId: u(z),
  /** 地图类型对象, 优先级比mapTypeId高 */
  mapType: s(Object),
  hideLogo: s(Boolean),
  onLoad: h(),
  "onUpdate:center": h(),
  "onUpdate:current-center": h(),
  "onUpdate:last-center": h(),
  "onUpdate:map-type": h(),
  "onUpdate:map-type-id": h(),
  "onUpdate:zoom": h(),
  onError: h()
}, Ie = n({
  name: "tg-map",
  provide() {
    return {
      [j]: J(() => this.map)
    };
  },
  inheritAttrs: !1,
  props: Pe,
  /** 声明事件的类型信息, 详见: {@link splitAttrs} */
  emits: void 0,
  setup(e, { attrs: t }) {
    return {
      attrs: g(t, e),
      centerSyncTimeoutId: void 0
    };
  },
  data() {
    return {
      map: M(),
      isDestroyed: !1
    };
  },
  computed: {
    propsJson() {
      return ae.toJsonSafely(this.$props);
    }
  },
  watch: {
    gestureHandling(e) {
      var t;
      e && ((t = this.map) == null || t.setGestureHandling(d(e, W)));
    },
    minZoom(e) {
      var t;
      (t = this.map) == null || t.setMinZoom(e);
    },
    maxZoom(e) {
      var t;
      (t = this.map) == null || t.setMaxZoom(e);
    },
    mapStyle(e) {
      var t;
      (t = this.map) == null || t.setMapStyle(e);
    },
    mapTypeId(e) {
      var t;
      e && ((t = this.map) == null || t.setBuildInMapTypeId(d(e, z)));
    },
    mapType(e) {
      var t;
      (t = this.map) == null || t.setMapType(e ?? oe.NORMAL);
    },
    hideLogo(e) {
      var t;
      (t = this.map) == null || t.setHideLogo(e ?? !1);
    },
    fractionalZoom(e) {
      var t;
      (t = this.map) == null || t.setFractionalZoom(e ?? !1);
    }
  },
  async mounted() {
    const e = d(this.type, D);
    try {
      await ie(e);
    } catch (o) {
      this.$emit("error", o);
      return;
    }
    if (this.isDestroyed) {
      console.warn(`tg-map(type=${e})已销毁, 不需要继续执行`);
      return;
    }
    const t = re.createMap(
      e,
      this.$refs.map,
      /* options: */
      {
        center: this.center,
        zoom: this.zoom,
        infoWindowMode: this.infoWindowMode,
        gestureHandling: d(this.gestureHandling, W),
        minZoom: this.minZoom,
        maxZoom: this.maxZoom,
        mapStyle: this.mapStyle,
        buildInMapTypeId: d(this.mapTypeId, z),
        hideLogo: this.hideLogo,
        fractionalZoom: this.fractionalZoom
      }
    );
    if (this.map = ue(t), this.mapType && t.setMapType(this.mapType), "ready" in this.attrs.listeners && console.error("地图载入完成的事件已经从ready改为了load, 请手动修改"), v(
      this.attrs.listeners,
      t,
      this.$emit,
      /* excludes: */
      ["load"]
    ), this.$emit("load", t), T([
      () => this.zoom,
      () => this.center
      //
    ], ([o, a], [_, ee]) => {
      o !== _ && t.setZoom(o), a !== ee && (t.getCenter().equals(a) || t.setCenter(a));
    }), this.attrs.listenerProps["update:center"]) {
      const o = () => this.$emit("update:center", t.getCenter());
      t.addEventListener("center-changed", () => {
        this.centerSyncDelay > 0 ? (clearTimeout(this.centerSyncTimeoutId), this.centerSyncTimeoutId = setTimeout(o, this.centerSyncDelay)) : o();
      });
    }
    this.attrs.listenerProps["update:current-center"] && (this.$emit("update:current-center", this.center), t.addEventListener("center-changed", () => {
      this.$emit("update:current-center", t.getCenter());
    })), this.attrs.listenerProps["update:zoom"] && t.addEventListener("zoom-changed", () => {
      this.$emit("update:zoom", t.getZoom());
    });
    const i = this.attrs.listenerProps["update:map-type"], r = this.attrs.listenerProps["update:map-type-id"];
    (i || r) && t.addEventListener("map-type-changed", () => {
      const o = t.getMapType();
      i && this.$emit("update:map-type", o), r && this.$emit("update:map-type-id", o.id);
    });
  },
  unmounted() {
    this.isDestroyed = !0, this.map && (this.attrs.listenerProps["update:last-center"] && this.$emit("update:last-center", this.map.getCenter()), this.attrs.listenerProps["update:center"] && (clearTimeout(this.centerSyncTimeoutId), this.$emit("update:center", this.map.getCenter())));
  },
  methods: {}
}), $ = (e, t) => {
  const i = e.__vccOpts || e;
  for (const [r, o] of t)
    i[r] = o;
  return i;
};
function Me(e, t, i, r, o, a) {
  return C(), b("div", w({ class: "tg-map" }, e.attrs.binds), [
    fe("div", {
      ref: "map",
      class: A({
        "tg-map__map": !0,
        [`tg-map__map--hide-logo-${e.type}`]: e.hideLogo
      })
    }, null, 2),
    Z("", !0),
    e.map ? f(e.$slots, "default", { key: 1 }) : Z("", !0),
    f(e.$slots, "overlay")
  ], 16);
}
const N = /* @__PURE__ */ $(Ie, [["render", Me]]), we = n({
  name: "tg-map-widget",
  props: {
    left: {
      type: [Number, String],
      default: null
    },
    top: {
      type: [Number, String],
      default: null
    },
    right: {
      type: [Number, String],
      default: null
    },
    bottom: {
      type: [Number, String],
      default: null
    }
  },
  computed: {
    topValue() {
      return this.top == null && this.bottom == null ? 0 : this.top;
    }
  },
  methods: {
    dimen: le
  }
});
function Se(e, t, i, r, o, a) {
  return C(), b("div", {
    class: A(e.$options.name),
    style: ye({ left: e.dimen(e.left), top: e.dimen(e.topValue), right: e.dimen(e.right), bottom: e.dimen(e.bottom) })
  }, [
    f(e.$slots, "default")
  ], 6);
}
const at = /* @__PURE__ */ $(we, [["render", Se]]), Le = n({
  name: "tg-custom-control",
  mixins: [p],
  props: {
    position: u(m, m.RIGHT_BOTTOM)
  },
  setup() {
    return {
      control: l()
    };
  },
  watch: {
    position() {
      this.recreate();
    }
  },
  onCreate() {
    Y(this.$parent, N) || console.warn("请将tg-custom-control放到tg-map中");
    const { $el: e } = this, t = class extends he {
      onCreateElement() {
        return e;
      }
    };
    this.control = new t(d(this.position, m)), this.$map.addCustomControl(this.control);
  },
  onDestroy() {
    this.$map.removeCustomControl(this.control);
  }
});
function xe(e, t, i, r, o, a) {
  return C(), b("div", {
    class: A(e.$options.name)
  }, [
    f(e.$slots, "default")
  ], 2);
}
const nt = /* @__PURE__ */ $(Le, [["render", xe]]), lt = n({
  name: "tg-map-type-control",
  mixins: [p],
  props: {
    position: u(m, m.TOP_LEFT),
    type: u(de),
    mapTypes: s(Array)
  },
  setup() {
    return {
      control: l()
    };
  },
  watch: {
    position(e) {
      this.control.setPosition(e);
    },
    type() {
      this.recreate();
    },
    mapTypes: {
      handler() {
        this.recreate();
      },
      deep: !0
    }
  },
  onCreate() {
    this.control = this.$map.createMapTypeControl(d(this)), this.$map.addControl(this.control);
  },
  onDestroy() {
    this.$map.removeControl(this.control);
  }
}), ht = n({
  name: "tg-scale-control",
  mixins: [p],
  props: {
    position: u(m, m.BOTTOM_RIGHT)
  },
  setup() {
    return {
      control: l()
    };
  },
  watch: {
    position(e) {
      this.control.setPosition(e);
    }
  },
  onCreate() {
    this.control = this.$map.createScaleControl(d(this)), this.$map.addControl(this.control);
  },
  onDestroy() {
    this.$map.removeControl(this.control);
  }
});
function Q() {
  var i;
  const e = (i = ve()) == null ? void 0 : i.type;
  let t = (e == null ? void 0 : e.name) ?? (e == null ? void 0 : e.__name);
  if (!t) {
    const r = e == null ? void 0 : e.__file;
    r && (t = te.basename(r, ".vue"));
  }
  return t;
}
function F() {
  const e = ge(j);
  let t, i;
  return e == null && S(`<${Q() || "unknown"}>必须作为<tg-map>的子代组件`), {
    mapRef: e,
    /** 读取map对象, 只要放在<tg-map>里面的组件(除#overlay插槽外)都能够立即读取到map对象 */
    get map() {
      return e.value ?? S("map尚未初始化");
    },
    /** 地图元素创建回调 */
    [O](r) {
      be(r), t && S(`${O}只能调用一次`), t = r;
    },
    /** 地图元素销毁回调 */
    [P](r) {
      $e(r), i && S(`${P}只能调用一次`), i = r;
    },
    /** 重新创建地图元素 */
    recreate() {
      i == null || i(), t == null || t();
    }
  };
}
const dt = n({
  name: "tg-street-view-control",
  props: {
    position: u(m, m.RIGHT_BOTTOM)
  },
  setup(e) {
    let t = l();
    const { map: i, onCreate: r, onDestroy: o } = F();
    return r(() => {
      t = i.createStreetViewControl(d(e)), i.addControl(t);
    }), o(() => {
      i.removeControl(t);
    }), T(() => e.position, (a) => {
      t.setPosition(d(a, m));
    }), E;
  }
}), pt = n({
  name: "tg-zoom-control",
  props: {
    position: u(m, m.RIGHT_BOTTOM),
    showZoomLevel: s(Boolean)
  },
  setup(e) {
    let t = l();
    const { map: i, onCreate: r, onDestroy: o } = F();
    return r(() => {
      t = i.createZoomControl(d(e)), i.addControl(t);
    }), o(() => {
      i.removeControl(t);
    }), T(() => e.position, (a) => {
      t.setPosition(d(a, m));
    }), T(() => e.showZoomLevel, (a) => {
      t.setShowZoomLevel(a ?? !0);
    }), E;
  }
}), mt = n({
  name: "tg-heatmap",
  props: {
    maxIntensity: s(Number),
    gradient: s(Object),
    opacity: s(Number),
    radius: s(Number),
    data: c(Array)
  },
  setup(e) {
    const { map: t, onCreate: i, onDestroy: r } = F();
    let o = l();
    return i(() => {
      o = t.createHeatmap(e);
    }), r(() => {
      o.remove();
    }), T(() => e.data, (a) => o.setData(a)), T(
      [() => e.maxIntensity, () => e.gradient, () => e.opacity, () => e.radius],
      () => o.setOptions(e)
    ), E;
  }
}), Ae = n({
  name: "tg-marker-clusterer",
  mixins: [p],
  // markers从this.$children中读取, 故需要省略(Omit)
  props: {
    gridSize: s(Number),
    maxZoom: s(Number),
    minClusterSize: s(Number),
    averageCenter: s(Boolean),
    styles: s(Array),
    stylesIndexCalculator: s(Function),
    zIndex: s(Number)
  },
  setup() {
    return {
      clusterer: l(),
      markers: M([]),
      pendingMarkers: M([])
    };
  },
  watch: {
    gridSize() {
      this.recreate();
    },
    maxZoom() {
      this.recreate();
    },
    minClusterSize() {
      this.recreate();
    },
    averageCenter() {
      this.recreate();
    },
    styles: {
      handler() {
        this.recreate();
      },
      deep: !0
    },
    stylesIndexCalculator() {
      this.recreate();
    },
    zIndex() {
      this.recreate();
    }
  },
  onCreate() {
    this.clusterer = this.$map.createMarkerClusterer(this);
  },
  onDestroy() {
    this.clusterer.clearMarkers(!0), this.pendingMarkers = [];
  },
  methods: {
    /** TgMarker有可能在该组件未初始化之前调用, 需要通过该方法判断 */
    isInitiated() {
      return this.clusterer != null;
    },
    performAddMarkers() {
      this.clusterer.addMarkers(this.pendingMarkers), this.pendingMarkers = [];
    },
    onAddMarker(e) {
      this.markers.push(e), this.isInitiated() && (this.pendingMarkers.length || this.$nextTick(this.performAddMarkers), this.pendingMarkers.push(e));
    },
    onRemoveMarker(e) {
      this.isInitiated() && (V.remove(this.pendingMarkers, e) || this.clusterer.removeMarker(e)), V.remove(this.markers, e);
    }
  }
});
function Be(e, t, i, r, o, a) {
  return C(), b("div", {
    class: A(e.$options.name)
  }, [
    f(e.$slots, "default")
  ], 2);
}
const Ee = /* @__PURE__ */ $(Ae, [["render", Be]]), ct = n({
  name: "tg-traffic-layer",
  mixins: [p],
  // 请直接使用v-if来控制它的显隐
  // 没有属性时, 写`{}`类型推断会有问题, 故注释掉
  // props: {} satisfies Props<{}>,
  setup() {
    return {
      layer: l()
    };
  },
  watch: {},
  onCreate() {
    this.layer = new pe(), this.$map.addLayer(this.layer);
  },
  onDestroy() {
    this.$map.removeLayer(this.layer);
  }
}), ut = n({
  name: "tg-circle",
  mixins: [p],
  inheritAttrs: !1,
  props: {
    center: c(y),
    radius: c(Number),
    clickable: s(Boolean),
    editable: s(Boolean),
    strokeColor: s(String),
    strokeOpacity: s(Number),
    strokeWeight: s(Number),
    visible: s(Boolean),
    zIndex: s(Number),
    fillColor: s(String),
    fillOpacity: s(Number),
    "onUpdate:center": h(),
    "onUpdate:radius": h()
  },
  emits: void 0,
  setup(e, { attrs: t }) {
    return {
      attrs: g(t, e),
      overlay: l(),
      emittedRadius: void 0,
      emittedCenter: void 0
    };
  },
  watch: {
    center(e) {
      if (this.emittedCenter != null) {
        const t = this.emittedCenter;
        if (this.emittedCenter = void 0, t === B(e))
          return;
      }
      this.overlay.setCenter(e);
    },
    radius(e) {
      if (this.emittedRadius != null) {
        const t = this.emittedRadius;
        if (this.emittedRadius = void 0, t === e)
          return;
      }
      this.overlay.setRadius(e);
    },
    clickable() {
      this.recreate();
    },
    editable(e) {
      this.overlay.setEditable(e);
    },
    strokeColor(e) {
      this.overlay.setStrokeColor(e);
    },
    strokeOpacity(e) {
      this.overlay.setStrokeOpacity(e);
    },
    strokeWeight(e) {
      this.overlay.setStrokeWeight(e);
    },
    fillColor(e) {
      this.overlay.setFillColor(e);
    },
    fillOpacity(e) {
      this.overlay.setFillOpacity(e);
    },
    visible(e) {
      this.overlay.setVisible(e);
    },
    zIndex(e) {
      this.overlay.setZIndex(e);
    }
  },
  onCreate() {
    this.overlay = this.$map.createCircle(this), this.$map.addOverlay(this.overlay), v(this.attrs.listeners, this.overlay, this.$emit), this.attrs.listenerProps["update:center"] && this.overlay.addEventListener("center-changed", () => {
      this.$emit("update:center", this.emittedCenter = this.overlay.getCenter());
    }), this.attrs.listenerProps["update:radius"] && this.overlay.addEventListener("radius-changed", () => {
      this.$emit("update:radius", this.emittedRadius = this.overlay.getRadius());
    });
  },
  onDestroy() {
    this.$map.removeOverlay(this.overlay);
  }
});
class Ne extends me {
  constructor(t, i, r, o) {
    super(t, i), this.content = r, this.position = o;
  }
  onCreate() {
    return this.content;
  }
  onDraw(t) {
    const i = t.fromLatLngToOverlayPoint(this.position);
    this.content.style.left = i.x + "px", this.content.style.top = i.y + "px";
  }
  setPosition(t) {
    this.position = t, this.draw();
  }
}
const De = n({
  name: "tg-element-overlay",
  mixins: [p],
  props: {
    mapPane: u(x, x.overlayMouseTarget),
    position: c(y)
  },
  setup() {
    return {
      overlay: l()
    };
  },
  watch: {
    position(e) {
      this.overlay.setPosition(e);
    },
    mapPane() {
      this.recreate();
    }
  },
  methods: {
    content() {
      return this.$el;
    }
  },
  onCreate() {
    this.overlay = new Ne(this.$map, d(this), this.content(), this.position), this.$map.addElementOverlay(this.overlay);
  },
  onDestroy() {
    this.$map.removeElementOverlay(this.overlay);
  }
});
function ze(e, t, i, r, o, a) {
  return C(), b("div", w({
    class: e.$options.name
  }, e.$attrs), [
    f(e.$slots, "default")
  ], 16);
}
const ft = /* @__PURE__ */ $(De, [["render", ze]]), We = {
  position: c(y),
  title: s(String),
  label: s(Object),
  icon: s(Object),
  clickable: s(Boolean),
  draggable: s(Boolean),
  crossOnDrag: s(Boolean),
  cursor: s(String),
  zIndex: s(Number),
  visible: s(Boolean),
  normalizePositionForBaidu: s(Boolean),
  /**
     * 是否自动添加到TgMarkerClusterer中去
     * @default true
     */
  autoAddToClusterer: s(Boolean, !0),
  "onUpdate:position": h()
}, Ze = n({
  name: "tg-marker",
  mixins: [p],
  inheritAttrs: !1,
  props: We,
  emits: void 0,
  setup(e, { attrs: t }) {
    return {
      attrs: g(t, e),
      marker: l(),
      labelOverlay: M(),
      info: M(),
      emittedPosition: void 0,
      autoAddToClustererWhenCreate: e.autoAddToClusterer
    };
  },
  watch: {
    position(e) {
      if (this.emittedPosition != null) {
        const t = this.emittedPosition;
        if (this.emittedPosition = void 0, t === B(e))
          return;
      }
      this.marker.setPosition(e);
    },
    title(e) {
      this.marker.setTitle(e);
    },
    label(e, t) {
      se(e, t) || (e ? this.marker.setLabel(e) : this.recreate());
    },
    icon(e) {
      var t;
      e ? (t = this.marker) == null || t.setIcon(e) : this.recreate();
    },
    clickable(e) {
      this.marker instanceof q ? this.recreate() : this.marker.setClickable(e);
    },
    draggable(e) {
      this.marker.setDraggable(e);
    },
    crossOnDrag() {
      this.recreate();
    },
    cursor() {
      this.recreate();
    },
    zIndex(e) {
      this.marker instanceof q ? this.recreate() : this.marker.setZIndex(e);
    },
    visible(e) {
      this.marker.setVisible(e);
    },
    normalizePositionForBaidu() {
      this.recreate();
    },
    autoAddToClusterer() {
      this.recreate();
    }
  },
  onCreate() {
    this.marker = this.$map.createMarker(this), this.labelOverlay && this.marker.attachLabelOverlay(this.labelOverlay.overlay), this.$clusterer() && this.autoAddToClusterer ? this.$clusterer().onAddMarker(this.marker) : this.$map.addOverlay(this.marker), this.autoAddToClustererWhenCreate = this.autoAddToClusterer, this.info && this.info.show && this.info.overlay.open(this.marker), v(this.attrs.listeners, this.marker, this.$emit), this.attrs.listenerProps["update:position"] && this.marker.addEventListener("dragend", (e) => {
      this.$emit("update:position", this.emittedPosition = e.position);
    });
  },
  onDestroy() {
    this.$clusterer() && this.autoAddToClustererWhenCreate ? this.$clusterer().onRemoveMarker(this.marker) : this.$map.removeOverlay(this.marker);
  },
  methods: {
    recreate() {
      k(this, P), this.labelOverlay && this.marker.attachLabelOverlay(void 0), this.info && this.info.overlay.close(), k(this, O);
    },
    $clusterer() {
      return Y(this.$parent, Ee);
    },
    onAddLabel(e) {
      this.labelOverlay = e, this.marker && this.marker.attachLabelOverlay(e.overlay);
    },
    onRemoveLabel(e) {
      this.marker.attachLabelOverlay(void 0), this.labelOverlay = void 0;
    },
    onAddInfo(e) {
      this.info = e, this.marker && e.show && e.overlay.open(this.marker);
    },
    onRemoveInfo(e) {
      e.overlay.close(), this.info = void 0;
    },
    onInfoShowChanged(e, t) {
      t ? e.overlay.open(this.marker) : e.overlay.close();
    }
  }
});
function Re(e, t, i, r, o, a) {
  return f(e.$slots, "default");
}
const H = /* @__PURE__ */ $(Ze, [["render", Re]]), Ue = n({
  name: "tg-info-box",
  mixins: [p],
  inheritAttrs: !1,
  props: {
    show: c(Boolean),
    position: s(y),
    offset: s(Object),
    maxWidth: s(Number),
    borderClass: s(String),
    zIndex: s(Number),
    disableAutoPan: s(Boolean),
    "onUpdate:show": h()
  },
  emits: void 0,
  setup(e, { attrs: t }) {
    return {
      attrs: g(t, e),
      overlay: l()
    };
  },
  watch: {
    show(e) {
      this.$marker() ? this.$marker().onInfoShowChanged(this, e) : e ? this.overlay.open() : this.overlay.close();
    },
    position(e) {
      this.overlay.setPosition(e);
    },
    offset() {
      this.recreate();
    },
    maxWidth(e) {
      this.overlay.setMaxWidth(e);
    },
    borderClass() {
      this.recreate();
    },
    zIndex(e) {
      this.overlay.setZIndex(e);
    },
    disableAutoPan() {
      this.recreate();
    }
  },
  onCreate() {
    this.overlay = this.$map.createInfoBox(this.getOptions()), this.$marker() ? this.$marker().onAddInfo(this) : this.show && this.overlay.open(), this.attrs.listenerProps["update:show"] && this.overlay.addEventListener("closeclick", () => {
      this.$emit("update:show", !1);
    }), v(this.attrs.listeners, this.overlay, this.$emit);
  },
  onDestroy() {
    this.$marker() ? this.$marker().onRemoveInfo(this) : this.overlay.close();
  },
  methods: {
    getOptions() {
      return {
        content: this.content(),
        position: this.position,
        offset: this.offset,
        zIndex: this.zIndex,
        maxWidth: this.maxWidth,
        borderClass: this.borderClass,
        disableAutoPan: this.disableAutoPan
      };
    },
    content() {
      return this.$map instanceof X ? K(this.$el, "google-info-container") : this.$el;
    },
    $marker() {
      return U(H, this.$parent, N);
    },
    open(e) {
      this.overlay.open(e);
    },
    close() {
      this.overlay.close();
    }
  }
});
function je(e, t, i, r, o, a) {
  return C(), b("div", w({
    class: e.$options.name
  }, e.attrs.binds), [
    f(e.$slots, "default")
  ], 16);
}
const yt = /* @__PURE__ */ $(Ue, [["render", je]]), Fe = n({
  name: "tg-info-window",
  mixins: [p],
  inheritAttrs: !1,
  props: {
    show: c(Boolean),
    position: s(y),
    maxWidth: s(Number),
    offset: s(Object),
    disableAutoPan: s(Boolean),
    "onUpdate:show": h()
  },
  emits: void 0,
  setup(e, { attrs: t }) {
    return {
      attrs: g(t, e),
      overlay: l()
    };
  },
  watch: {
    show(e) {
      this.$marker() ? this.$marker().onInfoShowChanged(this, e) : e ? this.overlay.open() : this.overlay.close();
    },
    position(e) {
      this.overlay.setPosition(e);
    },
    maxWidth() {
      this.recreate();
    },
    offset() {
      this.recreate();
    },
    disableAutoPan() {
      this.recreate();
    }
  },
  methods: {
    content() {
      return this.$map instanceof X ? K(this.$el, "google-info-container") : this.$el;
    },
    $marker() {
      return U(H, this.$parent, N);
    },
    getOptions() {
      return {
        content: this.content(),
        position: this.position,
        maxWidth: this.maxWidth,
        offset: this.offset,
        disableAutoPan: this.disableAutoPan
      };
    }
  },
  onCreate() {
    this.overlay = this.$map.createInfoWindow(this.getOptions()), this.$marker() ? this.$marker().onAddInfo(this) : this.show && this.overlay.open(), this.overlay.addEventListener("open", () => {
      this.$emit("update:show", !0);
    }), this.overlay.addEventListener("close", () => {
      this.$emit("update:show", !1);
    }), v(this.attrs.listeners, this.overlay, this.$emit);
  },
  onDestroy() {
    this.$marker() ? this.$marker().onRemoveInfo(this) : this.overlay.close();
  }
});
function He(e, t, i, r, o, a) {
  return Ce((C(), b("div", w({
    class: e.$options.name
  }, e.attrs.binds), [
    f(e.$slots, "default")
  ], 16)), [
    [_e, e.show]
  ]);
}
const vt = /* @__PURE__ */ $(Fe, [["render", He]]), Ve = n({
  name: "tg-label",
  mixins: [p],
  inheritAttrs: !1,
  props: {
    position: s(y),
    offset: s(Object),
    zIndex: s(Number),
    mapPane: u(x)
  },
  emits: void 0,
  setup(e, { attrs: t }) {
    return {
      attrs: g(t),
      overlay: l()
    };
  },
  watch: {
    position(e) {
      this.overlay.setPosition(e);
    },
    offset(e) {
      var t;
      (t = this.overlay) == null || t.setOffset(e);
    },
    zIndex(e) {
      this.overlay.setZIndex(e);
    },
    visible(e) {
      this.overlay.setVisible(e);
    },
    mapPane() {
      this.recreate();
    }
  },
  methods: {
    content() {
      return this.$el;
    },
    marker() {
      var e;
      return (e = this.$marker()) == null ? void 0 : e.marker;
    },
    $marker() {
      return U(H, this.$parent, N);
    },
    getOptions() {
      return {
        content: this.content(),
        position: this.position,
        offset: this.offset,
        zIndex: this.zIndex,
        mapPane: d(this.mapPane, x)
      };
    }
  },
  onCreate() {
    this.overlay = this.$map.createLabel(this.getOptions()), this.$marker() ? this.$marker().onAddLabel(this) : this.$map.addOverlay(this.overlay), v(this.attrs.listeners, this.overlay, this.$emit);
  },
  onDestroy() {
    this.$marker() ? this.$marker().onRemoveLabel(this) : this.$map.removeOverlay(this.overlay);
  }
});
function Ge(e, t, i, r, o, a) {
  return C(), b("div", w({
    class: e.$options.name
  }, e.attrs.binds), [
    f(e.$slots, "default")
  ], 16);
}
const gt = /* @__PURE__ */ $(Ve, [["render", Ge]]), qe = {
  paths: c(Array),
  clickable: s(Boolean),
  editable: s(Boolean),
  strokeColor: s(String),
  strokeOpacity: s(Number),
  strokeWeight: s(Number),
  visible: s(Boolean),
  zIndex: s(Number),
  fillColor: s(String),
  fillOpacity: s(Number),
  "onUpdate:paths": h()
}, $t = n({
  name: "tg-polygon",
  mixins: [p],
  inheritAttrs: !1,
  props: qe,
  emits: void 0,
  setup(e, { attrs: t }) {
    return {
      attrs: g(t, e),
      overlay: l(),
      emittedPaths: void 0
    };
  },
  watch: {
    paths: {
      handler(e) {
        if (this.emittedPaths != null) {
          const t = this.emittedPaths;
          if (this.emittedPaths = void 0, t.length === e.length && t.every((i, r) => i === B(e[r])))
            return;
        }
        this.overlay.setPaths(e);
      },
      deep: !0
    },
    clickable() {
      this.recreate();
    },
    editable(e) {
      this.overlay.setEditable(e);
    },
    strokeColor(e) {
      this.overlay.setStrokeColor(e);
    },
    strokeOpacity(e) {
      this.overlay.setStrokeOpacity(e);
    },
    strokeWeight(e) {
      this.overlay.setStrokeWeight(e);
    },
    fillColor(e) {
      this.overlay.setFillColor(e);
    },
    fillOpacity(e) {
      this.overlay.setFillOpacity(e);
    },
    visible(e) {
      this.overlay.setVisible(e);
    },
    zIndex(e) {
      this.overlay.setZIndex(e);
    }
  },
  onCreate() {
    this.overlay = this.$map.createPolygon(this), this.$map.addOverlay(this.overlay), v(this.attrs.listeners, this.overlay, this.$emit), this.attrs.listenerProps["update:paths"] && this.overlay.addEventListener("paths-edited", () => {
      this.$emit("update:paths", this.emittedPaths = this.overlay.getPaths());
    });
  },
  onDestroy() {
    this.$map.removeOverlay(this.overlay);
  }
}), bt = n({
  name: "tg-polyline",
  mixins: [p],
  inheritAttrs: !1,
  props: {
    path: c(Array),
    icons: s(Array),
    clickable: s(Boolean),
    editable: s(Boolean),
    strokeColor: s(String),
    strokeOpacity: s(Number),
    strokeWeight: s(Number),
    visible: s(Boolean),
    zIndex: s(Number),
    "onUpdate:path": h()
  },
  emits: void 0,
  setup(e, { attrs: t }) {
    return {
      attrs: g(t, e),
      overlay: l(),
      emittedPath: void 0
    };
  },
  watch: {
    path: {
      handler(e) {
        if (this.emittedPath != null) {
          const t = this.emittedPath;
          if (this.emittedPath = void 0, t === B(e))
            return;
        }
        this.overlay.setPath(e);
      },
      deep: !0
    },
    icons: {
      handler() {
        this.recreate();
      },
      deep: !0
    },
    clickable() {
      this.recreate();
    },
    editable(e) {
      this.overlay.setEditable(e);
    },
    strokeColor(e) {
      this.overlay.setStrokeColor(e);
    },
    strokeOpacity(e) {
      this.overlay.setStrokeOpacity(e);
    },
    strokeWeight(e) {
      this.overlay.setStrokeWeight(e);
    },
    visible(e) {
      this.overlay.setVisible(e);
    },
    zIndex(e) {
      this.overlay.setZIndex(e);
    }
  },
  onCreate() {
    this.overlay = this.$map.createPolyline(this), this.$map.addOverlay(this.overlay), v(this.attrs.listeners, this.overlay, this.$emit), this.attrs.listenerProps["update:path"] && this.overlay.addEventListener("path-edited", () => {
      this.$emit("update:path", this.emittedPath = this.overlay.getPath());
    });
  },
  onDestroy() {
    this.overlay.remove();
  }
}), Ct = n({
  name: "tg-rectangle",
  mixins: [p],
  inheritAttrs: !1,
  props: {
    bounds: c(Object),
    clickable: s(Boolean),
    editable: s(Boolean),
    strokeColor: s(String),
    strokeOpacity: s(Number),
    strokeWeight: s(Number),
    visible: s(Boolean),
    zIndex: s(Number),
    fillColor: s(String),
    fillOpacity: s(Number),
    "onUpdate:bounds": h()
  },
  emits: void 0,
  setup(e, { attrs: t }) {
    return {
      attrs: g(t, e),
      overlay: l(),
      emittedBounds: void 0
    };
  },
  watch: {
    bounds(e) {
      if (this.emittedBounds != null) {
        const t = this.emittedBounds;
        if (this.emittedBounds = void 0, t.equals(e))
          return;
      }
      this.overlay.setBounds(e);
    },
    clickable() {
      this.recreate();
    },
    editable(e) {
      this.overlay.setEditable(e);
    },
    strokeColor(e) {
      this.overlay.setStrokeColor(e);
    },
    strokeOpacity(e) {
      this.overlay.setStrokeOpacity(e);
    },
    strokeWeight(e) {
      this.overlay.setStrokeWeight(e);
    },
    fillColor(e) {
      this.overlay.setFillColor(e);
    },
    fillOpacity(e) {
      this.overlay.setFillOpacity(e);
    },
    visible(e) {
      this.overlay.setVisible(e);
    },
    zIndex(e) {
      this.overlay.setZIndex(e);
    }
  },
  onCreate() {
    this.overlay = this.$map.createRectangle(this), this.$map.addOverlay(this.overlay), v(this.attrs.listeners, this.overlay, this.$emit), this.attrs.listenerProps["update:bounds"] && this.overlay.addEventListener("bounds-changed", () => {
      this.$emit("update:bounds", this.emittedBounds = this.overlay.getBounds());
    });
  },
  onDestroy() {
    this.$map.removeOverlay(this.overlay);
  }
}), Xe = ["beforeUpdate", "updated"], _t = {
  install(e, t = {}) {
    if (t.enable !== !1) {
      const i = n({
        beforeCreate() {
          const r = Q() ?? "", a = (t.nameRegex || /^[A-Z]/).test(r) ? (_) => {
            t.hookNames ? t.hookNames.includes(_) && console.debug("[lifecycle]", r, _) : Xe.includes(_) || console.debug("[lifecycle]", r, _);
          } : L;
          a("beforeCreate"), this.__life_impl = a;
        },
        created() {
          this.__life("created");
        },
        beforeMount() {
          this.__life("beforeMount");
        },
        mounted() {
          this.__life("mounted");
        },
        beforeUpdate() {
          this.__life("beforeUpdate");
        },
        updated() {
          this.__life("updated");
        },
        beforeUnmount() {
          this.__life("beforeUnmount");
        },
        unmounted() {
          this.__life("unmounted");
        },
        methods: {
          __life(r) {
            this.__life_impl(r);
          }
        },
        onCreate() {
          this.__life("onCreate");
        },
        onDestroy() {
          this.__life("onDestroy");
        }
      });
      e.mixin(i);
    }
  }
}, kt = {
  install(e, t) {
    ce(t);
    const i = e.config.optionMergeStrategies;
    i[O] = i[P] = (r, o) => r ? [...new Set([].concat(r, o))] : Array.isArray(o) ? o : [o];
  }
};
export {
  _t as LifecycleLogPlugin,
  O as MIXIN_HOOK_CREATE,
  P as MIXIN_HOOK_DESTROY,
  j as MIXIN_MAP_NAME,
  p as MapMixin,
  ut as TgCircle,
  nt as TgCustomControl,
  ft as TgElementOverlay,
  mt as TgHeatmap,
  yt as TgInfoBox,
  vt as TgInfoWindow,
  gt as TgLabel,
  N as TgMap,
  lt as TgMapTypeControl,
  at as TgMapWidget,
  H as TgMarker,
  Ee as TgMarkerClusterer,
  $t as TgPolygon,
  bt as TgPolyline,
  Ct as TgRectangle,
  ht as TgScaleControl,
  dt as TgStreetViewControl,
  ct as TgTrafficLayer,
  pt as TgZoomControl,
  k as callHook,
  tt as computedSaveOnThis,
  E as createEmptyVNode,
  Te as createPropertyObject,
  st as createPropertyObjectTyped,
  kt as default,
  h as eventProp,
  rt as extractVNodeFromSlotsByComponent,
  U as findAncestorComponentByType,
  it as findByComponentType,
  R as isComponentByType,
  s as optionalProp,
  c as requiredProp,
  Y as safeAsComponent,
  Oe as splitAttrs,
  u as stringEnumProp,
  ke as stringUnionPropFromValues,
  ot as useEventLogMethods,
  g as useSplittedAttrs,
  F as useTgMapInner
};
//# sourceMappingURL=tg-map.js.map