@tuoyuan/map-adapter-tmap
Version:
天地图适配器
157 lines (156 loc) • 6.45 kB
JavaScript
var b = Object.defineProperty;
var _ = (r, h, t) => h in r ? b(r, h, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[h] = t;
var l = (r, h, t) => _(r, typeof h != "symbol" ? h + "" : h, t);
import { BaseMarker as u, Pixel as L, pxToPt as w, getDPI as x, Size as v } from "@tuoyuan/map-adapter-lib";
class M extends u {
constructor(t, e) {
super(t._top, e, {
basePlacement: "right-bottom",
labelBasePlacement: "right-bottom"
});
l(this, "_ctx");
l(this, "currentLngLat");
/** 天地图marker实例 */
l(this, "iconInstance");
l(this, "labelInstance");
l(this, "busInstance");
// 组件实例 信息窗口内
l(this, "app");
l(this, "container");
this._ctx = t, this.currentLngLat = new t.TMap.LngLat(e == null ? void 0 : e.position[0], e == null ? void 0 : e.position[1]), this.iconInstance = new this._ctx.TMap.Marker(this.currentLngLat), this.renderIcon(), this.renderLabel(), this.addListener((n, s) => {
this._ctx._top.options.dev && (console.groupCollapsed("[Marker.event]", n), console.log("payload: ", s), console.groupEnd());
});
}
initEvent() {
["click", "dblclick"].forEach((e) => {
this.iconInstance.on(e, (n) => {
this.emit(e, {
e: n.originalEvent,
position: this._position,
pixel: new L(n.containerPoint.x, n.containerPoint.y),
data: this.data
});
});
});
}
renderIcon() {
var n, s, a, i;
this.iconInstance && this._ctx._map.removeOverLay(this.iconInstance);
const t = (n = this._icon) == null ? void 0 : n.getRealOffset(), e = new this._ctx.TMap.Icon({
iconUrl: (s = this._icon) == null ? void 0 : s.image,
iconSize: new this._ctx.TMap.Point((a = this._icon) == null ? void 0 : a.size.width, (i = this._icon) == null ? void 0 : i.size.height),
iconAnchor: new this._ctx.TMap.Point(-((t == null ? void 0 : t.x) ?? 0), -((t == null ? void 0 : t.y) ?? 0))
});
this.iconInstance = new this._ctx.TMap.Marker(this.currentLngLat, {
icon: e
}), this._ctx._map.addOverLay(this.iconInstance), this.initEvent();
}
renderLabel() {
var s, a, i, c, I, o, d, p, g, f;
if (this.labelInstance && this._ctx._map.removeOverLay(this.labelInstance), !((s = this._label) != null && s.text)) return;
const t = (I = (c = (i = (a = this._label).getRealOffset) == null ? void 0 : i.call(a, {
// 天地图label容器左右内边距10px，自定义容器上下容器内边距2px
padding: [2, 10, 2, 10]
})) == null ? void 0 : c.toArray) == null ? void 0 : I.call(c), e = new this._ctx.TMap.Point(
t[0] - 12,
// 天地图label 横向偏移量
t[1] + 12
// 天地图label 纵向偏移量
), n = {
text: `<div style="line-height: 1.2; padding: 2px 0; font-size: ${(o = this._label) == null ? void 0 : o.fontSize}px">${((d = this._label) == null ? void 0 : d.text) || ""}</div>`,
position: this.currentLngLat,
offset: e
};
this.labelInstance = new this._ctx.TMap.Label(n), this.labelInstance.setBorderLine(0), this.labelInstance.setFontColor((p = this._label) == null ? void 0 : p.color), this.labelInstance.setBackgroundColor((g = this._label) == null ? void 0 : g.backgroundColor), ((f = this._label) == null ? void 0 : f.visible) === !1 && this.labelInstance.hide(), this._ctx._map.addOverLay(this.labelInstance);
}
setName(t) {
super.setName(t);
}
setIcon(t) {
super.setIcon(t), this.iconInstance.getIcon().setIconUrl(t);
}
// 更改icon 位置
setPosition(t) {
super.setPosition(t), this.currentLngLat = this._ctx.TMap.LngLat(t[0], t[1]), this.iconInstance.setLngLat(this.currentLngLat), this.setLabelPosition(t);
}
// 更改label 位置
setLabelPosition(t) {
this.currentLngLat = this._ctx.TMap.LngLat(t[0], t[1]), this.labelInstance.setLngLat(this.currentLngLat);
}
setLabel(t) {
var e;
super.setLabel(t), (e = this.labelInstance) == null || e.setLabel(t);
}
setFontSize(t) {
var e;
(e = this.labelInstance) == null || e.setFontSize(w(t, x()));
}
setBackgroundColor(t) {
var e;
(e = this.labelInstance) == null || e.setBackgroundColor(t);
}
openInfoWindow(t) {
var e, n, s;
if (t.url) {
const a = `
<div style="width:${t.size.width}px; height:${t.size.height}px; padding:10px;">
<iframe src=${t.url}
width="100%"
height="100%"
frameborder="0"
scrolling="auto">
</iframe>
</div>
`, i = new this._ctx.TMap.InfoWindow({});
i.setContent(a), this.iconInstance.openInfoWindow(i);
} else {
const a = `
<div :closeButton="false" style="width:${t.size.width}px; height:${t.size.height}px; overflow: hidden; pointer-events: none;">
${t.html}
</div>
`, i = new this._ctx.TMap.InfoWindow();
i.setContent(a);
const c = t.placement ?? "top";
if (t.placement) {
const I = ((n = (e = this._icon) == null ? void 0 : e.getRealOffset) == null ? void 0 : n.call(e)) ?? new L(0, 0), o = ((s = this._icon) == null ? void 0 : s.size) ?? new v(0, 0);
let d = I.x + o.width / 2, p = 20 + t.size.height / 2 + o.height / 2;
c.includes("left") && (d += -t.size.width / 2 - o.width / 2 - 10), c.includes("right") && (d += t.size.width / 2 + o.width / 2 + 10), c.includes("top") && (p += -t.size.height / 2 - o.height / 2 - 10), c.includes("bottom") && (p += t.size.height / 2 + o.height / 2 + 10);
const g = new this._ctx.TMap.Point(d, p);
i.setOffset(g);
}
this.iconInstance.openInfoWindow(i);
}
}
closeInfoWindow() {
this.iconInstance.closeInfoWindow();
}
setStyle(t) {
super.setStyle(t), this.renderIcon(), this.renderLabel();
}
hidden() {
super.hidden(), this.iconInstance.setOpacity(0);
}
show() {
super.show(), this.iconInstance.setOpacity(1);
}
showLabel() {
var t, e;
super.showLabel(), (e = (t = this.labelInstance) == null ? void 0 : t.show) == null || e.call(t);
}
hiddenLabel() {
var t, e;
super.hiddenLabel(), (e = (t = this.labelInstance) == null ? void 0 : t.hide) == null || e.call(t);
}
getInstances() {
return [this.iconInstance, this.labelInstance].filter((e) => !!e);
}
remove() {
this.closeInfoWindow(), this.getInstances().forEach((t) => this._ctx._map.removeOverLay(t));
}
panTo() {
this._ctx._map.panTo(this.currentLngLat);
}
}
export {
M as TMapMarker
};