vue3-tmap-new
Version:
基于腾讯地图 JavaScript API GL、TypeScript 封装适用于 Vue3 的高性能地图组件库
1,309 lines (1,308 loc) • 28.9 kB
JavaScript
var q = Object.defineProperty;
var $ = (e, n, l) => n in e ? q(e, n, { enumerable: !0, configurable: !0, writable: !0, value: l }) : e[n] = l;
var h = (e, n, l) => ($(e, typeof n != "symbol" ? n + "" : n, l), l);
import { defineComponent as p, ref as I, onMounted as x, onUnmounted as f, watch as u, watchEffect as G, provide as B, h as P, inject as O, toRaw as g, render as E, computed as V } from "vue";
function U(e, n, l) {
const a = ["visualization", "tools", "geometry", ...l || []];
return new Promise((i) => {
if (window.TMap) {
i(window.TMap);
return;
}
window.tmapCallback = function() {
i(window.TMap);
}, window.__POWERED_BY_QIANKUN__ && top && (top.tmapCallback = function() {
i(TMap);
});
const o = document.createElement("script");
o.type = "text/javascript", o.src = `https://map.qq.com/api/gljs?v=${e}&key=${n}&libraries=${a.join(
","
)}&callback=tmapCallback`, document.body.appendChild(o);
});
}
function C(e, n, l, a) {
if (!l) {
e.removeControl(n);
return;
}
const i = e.getControl(n), { position: o, className: t } = l;
a[o] && i.setPosition(a[o]), i.setClassName(t);
}
const F = p({
name: "tmap-map",
props: {
version: {
type: String,
default: "1.exp"
},
mapKey: {
type: String,
default: ""
},
libraries: {
type: Array,
default: () => []
},
class: {
type: String,
default: ""
},
style: {
type: Object,
default: () => ({})
},
center: {
type: Object,
default: () => ({ lat: 40.040452, lng: 116.273486 })
},
zoom: {
type: Number,
default: 17
},
minZoom: {
type: Number,
default: 3
},
maxZoom: {
type: Number,
default: 20
},
rotation: {
type: Number,
default: 0
},
pitch: {
type: Number,
default: 0
},
scale: {
type: Number,
default: 1
},
offset: {
type: Object,
default: () => ({ x: 0, y: 0 })
},
draggable: {
type: Boolean,
default: !0
},
scrollable: {
type: Boolean,
default: !0
},
doubleClickZoom: {
type: Boolean,
default: !0
},
boundary: {
type: Object,
default: null
},
mapStyleId: {
type: String
},
baseMap: {
type: Object
},
viewMode: {
type: String,
default: "3D"
},
control: {
type: Object,
default: () => ({ scale: {}, zoom: {}, rotation: {} })
},
showControl: {
type: Boolean,
default: !0
},
events: {
type: Object,
default: () => ({})
},
includePoints: {
type: Array,
default: () => []
},
fitBoundsOptions: {
type: Object,
default: () => ({
padding: { top: 60, bottom: 60, left: 60, right: 60 },
ease: { duration: 0 }
})
}
},
setup(e) {
const n = I(null), l = I(null);
let a, i;
const o = [];
return Object.keys(e.events).forEach((t) => {
o.push(t);
}), x(async () => {
await U(e.version, e.mapKey, e.libraries), i = {
topLeft: TMap.constants.CONTROL_POSITION.TOP_LEFT,
topCenter: TMap.constants.CONTROL_POSITION.TOP_CENTER,
topRight: TMap.constants.CONTROL_POSITION.TOP_RIGHT,
centerLeft: TMap.constants.CONTROL_POSITION.CENTER_LEFT,
center: TMap.constants.CONTROL_POSITION.CENTER,
centerRight: TMap.constants.CONTROL_POSITION.CENTER_RIGHT,
bottomLeft: TMap.constants.CONTROL_POSITION.BOTTOM_LEFT,
bottomCenter: TMap.constants.CONTROL_POSITION.BOTTOM_CENTER,
bottomRight: TMap.constants.CONTROL_POSITION.BOTTOM_RIGHT
};
const t = new TMap.LatLng(e.center.lat, e.center.lng);
n.value && (a = new TMap.Map(n.value, {
center: t,
zoom: e.zoom,
minZoom: e.minZoom,
maxZoom: e.maxZoom,
rotation: e.rotation,
pitch: e.pitch,
scale: e.scale,
offset: e.offset,
draggable: e.draggable,
scrollable: e.scrollable,
doubleClickZoom: e.doubleClickZoom,
boundary: e.boundary,
mapStyleId: e.mapStyleId,
baseMap: e.baseMap,
viewMode: e.viewMode,
showControl: e.showControl
}), C(
a,
TMap.constants.DEFAULT_CONTROL_ID.SCALE,
e.control.scale,
i
), C(
a,
TMap.constants.DEFAULT_CONTROL_ID.ZOOM,
e.control.zoom,
i
), C(
a,
TMap.constants.DEFAULT_CONTROL_ID.ROTATION,
e.control.rotation,
i
), o.forEach((r) => {
a.on(r, e.events[r]);
}), l.value = a);
}), f(() => {
a && (o.forEach((t) => {
a.off(t, e.events[t]);
}), a.destroy());
}), u(
() => [e.center, e.zoom, e.rotation, e.pitch],
([t, r, s, y]) => {
a && a.easeTo(
{
// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
// @ts-ignore
center: new TMap.LatLng(t.lat, t.lng),
zoom: r,
rotation: s,
pitch: y
},
{
duration: 500
}
);
}
), u(
() => e.scale,
(t) => a && a.setScale(t)
), u(
() => e.offset,
(t) => a && a.setOffset(t)
), u(
() => e.draggable,
(t) => a && a.setDraggable(t)
), u(
() => e.scrollable,
(t) => a && a.setScrollable(t)
), u(
() => e.doubleClickZoom,
(t) => a && a.setDoubleClickZoom(t)
), u(
() => e.boundary,
(t) => a && a.setBoundary(t)
), u(
() => e.control,
(t) => {
C(
a,
TMap.constants.DEFAULT_CONTROL_ID.SCALE,
t.scale,
i
), C(
a,
TMap.constants.DEFAULT_CONTROL_ID.ZOOM,
t.zoom,
i
), C(
a,
TMap.constants.DEFAULT_CONTROL_ID.ROTATION,
t.rotation,
i
);
}
), u(
() => e.baseMap,
(t) => {
t && a && a.setBaseMap(t);
}
), G(() => {
if (l.value) {
const t = new TMap.LatLngBounds();
t && (e.includePoints.forEach((r) => {
t && t.extend(new TMap.LatLng(r.lat, r.lng));
}), t.isEmpty() || a.fitBounds(t, e.fitBoundsOptions));
}
}), B("map", l), {
map: l,
el: n,
getCenter: () => a == null ? void 0 : a.getCenter(),
getZoom: () => a == null ? void 0 : a.getZoom()
};
},
render() {
return P(
"div",
{
class: this.class,
style: { height: "100%", width: "100%", ...this.style },
ref: "el"
},
this.$slots.default && this.map ? this.$slots.default() : []
);
}
});
function S(e, n, l) {
const a = [], i = [];
Object.keys(n).forEach((o) => {
if (o.indexOf("on") === 0) {
const t = o[2].toLowerCase() + o.slice(3);
a.push(t), i.push(l.bind(null, t));
}
}), a.forEach((o, t) => {
e.on(o, i[t]);
}), f(() => {
a.forEach((o, t) => {
e.off(o, i[t]);
});
});
}
function T(e, n) {
const l = e.getLayer(n);
l && l.setMap(null);
const a = e.getLayer(`${n}_border_line`);
a && a.setMap(null);
const i = e.getLayer(`${n}_border`);
i && i.setMap(null);
}
function k(e) {
const n = {};
return Object.keys(e).forEach((l) => {
n[l] = new TMap.MarkerStyle(e[l]);
}), n;
}
function w(e) {
return e.map((n) => ({
...n,
position: new TMap.LatLng(n.position.lat, n.position.lng)
}));
}
const H = p({
name: "tmap-multi-marker",
props: {
id: {
type: String,
default: "default"
},
styles: {
type: Object,
required: !0
},
geometries: {
type: Array,
required: !0
}
},
setup(e, { attrs: n, emit: l }) {
const a = O("map");
if (!a)
return {};
const i = g(a.value);
T(i, e.id);
const o = new TMap.MultiMarker({
id: e.id,
map: i,
styles: k(e.styles),
geometries: w(e.geometries)
});
return S(o, n, l), u(
() => e.styles,
(t) => {
o.setStyles(k(t));
}
), u(
() => e.geometries,
(t) => {
o.setGeometries(w(t));
}
), f(() => {
o.setMap(null);
}), {
getStyles: o.getStyles,
moveAlong: o.moveAlong.bind(o),
stopMove: o.stopMove.bind(o),
pauseMove: o.pauseMove.bind(o),
resumeMove: o.resumeMove.bind(o),
on: o.on.bind(o)
};
},
render() {
return null;
}
});
function W(e, n, l, a, i) {
class o extends TMap.DOMOverlay {
constructor(d) {
super(d);
h(this, "content", "");
h(this, "position", null);
h(this, "extData", {});
this.content = d.content, this.position = d.position, this.extData = d.extData;
}
onInit(d) {
this.content = d.content, this.position = d.position, this.extData = d.extData;
}
onDestroy() {
this.dom.removeEventListener("click", this.onClick), this.removeAllListeners();
}
onClick() {
this.emit("click");
}
createDOM() {
const d = document.createElement("div");
if (i) {
const { cluster: v } = i;
v && E(
v({
content: this.content
})[0],
d
);
}
return d.style.position = "absolute", d;
}
updateDOM() {
if (!this.map)
return;
const d = this.map.projectToContainer(this.position), v = `${d.getX() - this.dom.children[0].clientWidth / 2}px`, Z = `${d.getY() - this.dom.children[0].clientHeight / 2}px`;
this.dom.style.transform = `translate(${v}, ${Z})`, this.emit("dom_updated");
}
}
class t extends o {
createDOM() {
const c = document.createElement("div");
if (i) {
const { marker: d } = i;
d && E(
d({
content: this.content,
extData: this.extData
})[0],
c
);
}
return c.style.position = "absolute", c;
}
}
let r = [], s = [], y = null, m = [];
e.on("cluster_changed", () => {
r.length && (r.forEach((c) => {
c.destroy();
}), r = []), s = [], e.getClusters().forEach((c) => {
if (c.geometries.length > 1) {
const d = new o({
map: n,
position: c.center,
content: c.geometries.length
});
r.push(d);
} else
s.push({
...c,
position: c.center
});
}), i != null && i.marker ? (m.forEach((c) => c.destroy()), m = [], s.forEach((c) => {
const d = new t({
map: n,
position: c.position,
content: "",
extData: { ...c, data: c.geometries }
});
m.push(d);
})) : y ? y.setGeometries(s) : l.markerStyle && (y = new TMap.MultiMarker({
map: n,
styles: {
default: new TMap.MarkerStyle(l.markerStyle)
},
geometries: s
})), a(
"change",
s.map((c) => c.geometries[0])
);
});
function b() {
r.forEach((M) => M.destroy()), m.forEach((M) => M.destroy());
}
u(
() => l.geometries,
(M) => {
(!M || M.length === 0) && b();
}
), f(() => {
b();
});
}
const K = p({
name: "tmap-marker-cluster",
props: {
id: {
type: String,
default: "default"
},
enableDefaultStyle: {
type: Boolean,
default: !0
},
minimumClusterSize: {
type: Number,
default: 2
},
geometries: {
type: Array,
required: !0
},
zoomOnClick: {
type: Boolean,
default: !0
},
gridSize: {
type: Number,
default: 60
},
averageCenter: {
type: Boolean,
default: !1
},
maxZoom: {
type: Number,
default: 20
},
markerStyle: {
type: Object
}
},
emits: ["change"],
setup(e, { slots: n, emit: l }) {
const a = O("map");
if (!a)
return {};
const i = g(a.value), o = new TMap.MarkerCluster({
id: e.id,
map: i,
enableDefaultStyle: e.enableDefaultStyle,
minimumClusterSize: e.minimumClusterSize,
geometries: w(e.geometries),
zoomOnClick: e.zoomOnClick,
gridSize: e.gridSize,
averageCenter: e.averageCenter,
maxZoom: e.maxZoom
});
return u(
() => e.geometries,
(t) => {
o.setGeometries(w(t));
}
), e.enableDefaultStyle || W(o, i, e, l, n), f(() => {
o.setMap(null);
}), {};
},
render() {
return null;
}
});
function _(e) {
const n = {};
return Object.keys(e).forEach((l) => {
n[l] = new TMap.PolylineStyle(e[l]);
}), n;
}
function D(e) {
return e.map((n) => ({
...n,
paths: n.paths.map((l) => new TMap.LatLng(l.lat, l.lng))
}));
}
const Y = p({
name: "tmap-multi-polyline",
props: {
id: {
type: String,
default: "default"
},
zIndex: {
type: Number,
default: 1
},
styles: {
type: Object,
required: !0
},
geometries: {
type: Array,
required: !0
}
},
setup(e, { attrs: n, emit: l }) {
const a = O("map");
if (!a)
return {};
const i = g(a.value);
T(i, e.id);
const o = new TMap.MultiPolyline({
id: e.id,
map: i,
zIndex: e.zIndex,
styles: _(e.styles),
geometries: D(e.geometries)
});
return S(o, n, l), u(
() => e.zIndex,
(t) => {
o.setZIndex(t);
}
), u(
() => e.styles,
(t) => {
o.setStyles(_(t));
}
), u(
() => e.geometries,
(t) => {
o.setGeometries(D(t));
}
), f(() => {
o.setMap(null);
}), {};
},
render() {
return null;
}
});
function J(e, n) {
return e.reduce((l, a) => {
const i = a[n];
return l[i] = a, l;
}, {});
}
function X(e, n) {
var l, a;
if (e.id !== n.id || e.styleId !== n.styleId || e.rank !== n.rank)
return !1;
if (e.paths.length === n.paths.length) {
if (JSON.stringify(e.paths) !== JSON.stringify(n.paths))
return !1;
} else
return !1;
if (e.properties !== void 0 && n.properties !== void 0) {
const i = Object.keys(e.properties || {}), o = Object.keys(n.properties || {});
if (i.length !== o.length)
return !1;
for (let t = i.length - 1; t >= 0; t -= 1) {
const r = i[t];
if (((l = e.properties) == null ? void 0 : l[r]) !== ((a = n.properties) == null ? void 0 : a[r]))
return !1;
}
} else if (e.properties !== n.properties)
return !1;
return !0;
}
function L(e) {
const n = {};
return Object.keys(e).forEach((l) => {
n[l] = new TMap.PolygonStyle(e[l]);
}), n;
}
function N(e) {
return e.map((n) => ({
...n,
paths: n.paths.map((l) => new TMap.LatLng(l.lat, l.lng))
}));
}
const Q = p({
name: "tmap-multi-polygon",
props: {
id: {
type: String,
default: "default"
},
zIndex: {
type: Number,
default: 1
},
styles: {
type: Object,
required: !0
},
geometries: {
type: Array,
required: !0
}
},
setup(e, { attrs: n, emit: l }) {
const a = O("map");
if (!a)
return {};
const i = g(a.value);
let o = e.geometries;
T(i, e.id);
const t = new TMap.MultiPolygon({
id: e.id,
map: i,
zIndex: e.zIndex,
styles: L(e.styles),
geometries: N(o)
});
return S(t, n, l), u(
() => e.zIndex,
(r) => {
t.setZIndex(r);
}
), u(
() => e.styles,
(r) => {
t.setStyles(L(r));
}
), u(
() => e.geometries,
(r) => {
const s = J(o, "id"), y = new Set(Object.keys(s)), m = [];
r.forEach((b) => {
s[b.id] ? (y.delete(b.id), X(s[b.id], b) || m.push(b)) : m.push(b);
}), o = r, y.size > 0 && t.remove([...y]), m.length > 0 && t.updateGeometries(N(r));
}
), B("geometry", t), f(() => {
t.setMap(null);
}), {};
},
render() {
return this.$slots.default ? this.$slots.default() : null;
}
});
function R(e) {
const n = {};
return Object.keys(e).forEach((l) => {
n[l] = new TMap.LabelStyle(e[l]);
}), n;
}
const ee = p({
name: "tmap-multi-label",
props: {
id: {
type: String,
default: "default"
},
styles: {
type: Object,
required: !0
},
geometries: {
type: Array,
required: !0
},
enableCollision: {
type: Boolean,
required: !1,
default: !1
}
},
setup(e, { attrs: n, emit: l }) {
const a = O("map");
if (!a)
return {};
const i = g(a.value);
T(i, e.id);
const o = (r) => r.map((s) => ({
...s,
position: new TMap.LatLng(s.position.lat, s.position.lng)
})), t = new TMap.MultiLabel({
id: e.id,
map: g(a.value),
styles: R(e.styles),
geometries: o(e.geometries),
enableCollision: e.enableCollision
});
return S(t, n, l), u(
() => e.styles,
(r) => {
t.setStyles(R(r));
}
), u(
() => e.geometries,
(r) => {
t.setGeometries(o(r));
}
), f(() => {
t.setMap(null);
}), {};
},
render() {
return null;
}
});
function A(e) {
const n = {};
return Object.keys(e).forEach((l) => {
n[l] = new TMap.CircleStyle(e[l]);
}), n;
}
const te = p({
name: "tmap-multi-circle",
props: {
id: {
type: String,
default: "default"
},
zIndex: {
type: Number,
default: 1
},
styles: {
type: Object,
required: !0
},
geometries: {
type: Array,
required: !0
}
},
setup(e, { attrs: n, emit: l }) {
const a = O("map");
if (!a)
return {};
const i = g(a.value);
T(i, e.id);
const o = (r) => r.map((s) => ({
...s,
center: new TMap.LatLng(s.center.lat, s.center.lng)
})), t = new TMap.MultiCircle({
id: e.id,
map: i,
styles: A(e.styles),
geometries: o(e.geometries),
zIndex: 1
});
return S(t, n, l), u(
() => e.zIndex,
(r) => {
t.setZIndex(r);
}
), u(
() => e.styles,
(r) => {
t.setStyles(A(r));
}
), u(
() => e.geometries,
(r) => {
t.setGeometries(o(r));
}
), f(() => {
t.setMap(null);
}), {};
},
render() {
return null;
}
}), j = (e) => new TMap.LatLng(e.lat, e.lng), ne = p({
name: "tmap-info-window",
props: {
id: {
type: String,
default: "default"
},
visible: {
type: Boolean,
required: !0
},
position: {
type: Object,
required: !0
},
content: {
type: String,
required: !0
},
zIndex: {
type: Number,
required: !1,
default: 0
},
offset: {
type: Object,
required: !1,
default: () => ({ x: 0, y: 0 })
},
enableCustom: {
type: Boolean,
required: !1,
default: !1
}
},
emits: ["close-click"],
setup(e, { emit: n }) {
const l = O("map");
if (!l)
return {};
const a = g(l.value);
T(a, e.id);
const i = j(e.position), o = new TMap.InfoWindow({
map: g(l.value),
position: i,
// 设置信息框位置
content: e.content,
// 设置信息框内容
zIndex: e.zIndex,
offset: e.offset,
enableCustom: e.enableCustom
});
return o.on("closeclick", () => {
n("close-click");
}), u(
() => e.visible,
(t) => {
t ? o.open() : o.close();
}
), u(
() => e.content,
(t) => {
o.setContent(t);
}
), u(
() => e.position,
(t) => {
o.setPosition(j(t));
}
), f(() => {
o.destroy();
}), {};
},
render() {
return null;
}
}), ae = p({
name: "tmap-polygon-editor",
props: {
id: {
type: String,
default: "default"
},
zIndex: {
type: Number,
default: 2
},
snappable: {
type: Boolean,
default: !0
},
drawingStyleId: {
type: String,
default: "drawing"
},
selectedStyleId: {
type: String,
default: "selected"
},
styles: {
type: Object,
required: !0
},
modelValue: {
type: Array,
required: !0
},
actionMode: {
type: Number
}
},
emits: ["update:modelValue", "select", "error"],
setup(e, { emit: n }) {
const l = O("map");
if (!l)
return {};
const a = g(l.value);
T(a, e.id);
const i = N(e.modelValue), o = new TMap.MultiPolygon({
id: e.id,
map: a,
zIndex: e.zIndex,
styles: L(e.styles),
geometries: i
}), t = new TMap.tools.GeometryEditor({
map: a,
overlayList: [
{
overlay: o,
id: e.id,
drawingStyleId: e.drawingStyleId,
selectedStyleId: e.selectedStyleId
}
],
actionMode: e.actionMode === 1 ? TMap.tools.constants.EDITOR_ACTION.INTERACT : TMap.tools.constants.EDITOR_ACTION.DRAW,
activeOverlayId: e.id,
// 激活图层
selectable: !0,
// 开启点选功能
snappable: e.snappable
// 开启吸附
});
return t.on("select", () => {
n("select", t.getSelectedList());
}), t.on("draw_complete", (r) => {
n("update:modelValue", [...e.modelValue, r]);
}), t.on("adjust_complete", (r) => {
for (let s = e.modelValue.length - 1; s >= 0; s -= 1)
if (e.modelValue[s].id === r.id) {
Object.assign(e.modelValue[s], r), n("update:modelValue", [...e.modelValue]);
break;
}
}), t.on("delete_complete", (r) => {
const s = r.map((y) => y.id);
n(
"update:modelValue",
e.modelValue.filter((y) => s.indexOf(y.id) === -1)
), n("select", t.getSelectedList());
}), t.on("split_complete", (r) => {
const s = t.getActiveOverlay();
n("update:modelValue", [
...s.overlay.getGeometries(),
...r
]), n("select", t.getSelectedList());
}), t.on("union_complete", (r) => {
const s = t.getActiveOverlay();
n("update:modelValue", [...s.overlay.getGeometries(), r]), n("select", t.getSelectedList());
}), t.on("split_fail", (r) => {
n("error", r);
}), t.on("union_fail", (r) => {
n("error", r);
}), u(
() => e.actionMode,
(r) => {
const s = r === 1 ? TMap.tools.constants.EDITOR_ACTION.INTERACT : TMap.tools.constants.EDITOR_ACTION.DRAW;
t.setActionMode(s);
}
), f(() => {
o.setMap(null);
try {
t.destroy();
} catch {
}
}), {
select: t.select.bind(t),
stop: t.stop.bind(t),
split: t.split.bind(t),
union: t.union.bind(t),
delete: t.delete.bind(t),
destroy: t.destroy.bind(t),
disable: t.disable.bind(t),
enable: t.enable.bind(t)
};
},
render() {
return null;
}
}), z = (e) => new TMap.LatLng(e.lat, e.lng), le = p({
name: "tmap-dom-overlay",
props: {
id: {
type: String,
default: "default"
},
position: {
type: Object,
required: !0
},
offset: {
type: Array,
required: !1,
default: () => [0, 0]
}
},
setup(e, { slots: n }) {
const l = O("map");
if (!l)
return {};
const a = g(l.value);
T(a, e.id);
const i = I(document.createElement("div")), o = V(() => z(z(e.position)));
class t extends TMap.DOMOverlay {
constructor(m) {
super(m);
h(this, "map");
// eslint-disable-next-line lines-between-class-members
h(this, "ele");
this.map = m.map, this.onInit(m);
}
onInit(m) {
this.ele = m.ele;
}
createDOM() {
return this.ele;
}
updateDOM() {
const m = this.map.projectToContainer(o.value), b = `${m.getX() - this.ele.clientWidth / 2 + e.offset[0]}px`, M = `${m.getY() - this.ele.clientHeight / 2 + e.offset[1]}px`;
this.ele.setAttribute(
"style",
`top: ${M}; left: ${b}; position: absolute;`
);
}
onDestroy() {
this.ele.innerHTML = "";
}
}
let r;
return x(() => {
r = new t({
map: l.value,
ele: i.value
}), r.updateDOM();
}), u(
() => e.position,
() => {
r.updateDOM();
},
{
flush: "post"
}
), f(() => {
r.onDestroy();
}), () => P(
"span",
{
ref: i
},
n.default ? n.default() : []
);
}
}), oe = p({
name: "tmap-measure-tool",
props: {
enable: {
type: Boolean,
default: !0
},
type: {
type: String
}
},
emits: {
// eslint-disable-next-line @typescript-eslint/no-unused-vars
end: (e) => !0
},
setup(e, { emit: n }) {
const l = O("map"), a = I();
a.value = new TMap.tools.MeasureTool({
map: g(l == null ? void 0 : l.value)
});
const i = async () => {
if (!e.enable)
return;
await a.value.enable();
let o;
if (e.type === "distance")
o = await a.value.measureDistance();
else if (e.type === "area")
o = await a.value.measureArea();
else {
a.value.disable();
return;
}
n("end", o), await i();
};
u(
() => [e.type, e.enable],
() => {
i();
},
{ immediate: !0 }
), u(
() => e.enable,
(o) => {
o ? a.value.enable() : a.value.disable();
}
), f(() => {
a.value.disable();
});
},
render() {
return null;
}
}), ie = p({
name: "tmap-heatmap",
props: {
/**
* 最大辐射半径，默认为50。
*/
radius: {
type: Number,
default: 50
},
/**
* 峰值高度，默认为100。
*/
height: {
type: Number,
default: 100
},
gradientColor: {
type: Object
},
/**
* 热力最弱阈值，小于该值的不显示，默认为0。
*/
min: {
type: Number,
default: 0
},
/**
* 热力最强阈值，大于该值的显示为最强色，默认为数据中的最大值。
*/
max: {
type: Number,
default: 2
},
/**
* 全局透明度，取值范围[0，1]，默认为0.8。
*/
opacity: {
type: Number,
default: 0.8
},
/**
* 是否启用自动聚合预处理，适用于万级数据量，启用后可优化运行时性能，但对数据分布略有影响。默认为false。
*/
enableAggregation: {
type: Boolean,
default: !1
},
/**
* 热力图是否呈现光照效果，默认为false。
*/
enableLighting: {
type: Boolean,
default: !1
},
/**
* 图层绘制顺序。
*/
zIndex: {
type: Number
},
/**
* 图层最小缩放层级，当地图缩放层级小于该值时该图层不显示，默认为3。
*/
minZoom: {
type: Number,
default: 3
},
/**
* 图层最大缩放层级，当地图缩放层级大于该值时该图层不显示，默认为20。
*/
maxZoom: {
type: Number,
default: 20
},
/**
* 图层底部离地高度，默认为0。
*/
offset: {
type: Number,
default: 0
},
/**
* radius(半径)、height(峰值高度)、offset(离地高度)三个参数的单位，支持’pixel’ 像素、‘meter’ 米，默认为’pixel’。
*/
distanceUnit: {
type: String,
default: "pixel"
},
points: {
type: Array,
default: () => []
}
},
setup(e) {
const n = O("map"), l = new TMap.visualization.Heat({
radius: e.radius,
height: e.height,
min: e.min,
max: e.max,
minZoom: e.minZoom,
maxZoom: e.maxZoom,
opacity: e.opacity,
offset: e.offset,
distanceUnit: e.distanceUnit,
gradientColor: e.gradientColor
}).addTo(n == null ? void 0 : n.value);
x(() => {
e.points && l.setData(e.points);
}), f(() => {
l.destroy();
}), u(
() => e.points,
(a) => {
a.length && l.setData(a);
}
);
},
render() {
return null;
}
}), re = [
F,
H,
K,
Q,
Y,
ee,
te,
ne,
ae,
// GeometryEditor,
le,
oe,
ie
], de = (e) => {
re.forEach((n) => {
e.component(n.name, n);
});
};
export {
le as DOMOverlay,
ie as Heatmap,
ne as InfoWindow,
K as MarkerCluster,
oe as MeasureTool,
te as MultiCircle,
ee as MultiLabel,
H as MultiMarker,
Q as MultiPolygon,
Y as MultiPolyline,
ae as PolygonEditor,
F as TMap,
de as default
};