UNPKG

@tuoyuan/map-adapter-tmap

Version:

天地图适配器

117 lines (116 loc) 5.02 kB
var u = Object.defineProperty; var x = (i, s, t) => s in i ? u(i, s, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[s] = t; var c = (i, s, t) => x(i, typeof s != "symbol" ? s + "" : s, t); import { BasePolyline as w, Position as L, Pixel as m, getDPI as v, pxToPt as P, Bounds as T } from "@tuoyuan/map-adapter-lib"; class z extends w { constructor(t, e) { super(t._top, e, { labelBasePlacement: "right-bottom" }); c(this, "_ctx"); /** 天地图polyline实例 */ c(this, "polylineInstance"); c(this, "labelInstance"); this._ctx = t, this.renderPolyline(), this.renderLabel(), this.addListener((n, l) => { this._ctx._top.options.dev && (console.groupCollapsed("[Polyline.event]", n), console.log("payload: ", l), console.groupEnd()); }); } initEvent() { ["click", "dblclick", "rightclick"].forEach((e) => { this.polylineInstance.on(e, (n) => { this.emit(e, { e: n.originEvent, position: new L(n.lnglat.lng, n.lnglat.lat), pixel: new m(n.containerPoint.x, n.containerPoint.y), data: this.data }); }); }); } renderLabel() { var a, r, d, h, p, y, _, b, g, I, f; if (this.labelInstance && this._ctx._map.removeOverLay(this.labelInstance), !((a = this._label) != null && a.text)) return; const t = v(), e = super.findClosestPointToCentroid(this._path), n = (p = (h = (d = (r = this._label).getRealOffset) == null ? void 0 : d.call(r, { // 天地图label容器左右内边距10px,自定义容器上下容器内边距2px padding: [2, 10, 2, 10] })) == null ? void 0 : h.toArray) == null ? void 0 : p.call(h), l = new this._ctx.TMap.Point( n[0] - 12, // 天地图label 横向偏移量 n[1] + 15 // 天地图label 纵向偏移量 ), o = { text: `<div style="line-height: 1.2; padding: 2px 0; font-size: ${(y = this._label) == null ? void 0 : y.fontSize}px">${((_ = this._label) == null ? void 0 : _.text) || ""}</div>`, position: new this._ctx.TMap.LngLat(e == null ? void 0 : e.longitude, e == null ? void 0 : e.latitude), offset: l }; this.labelInstance = new this._ctx.TMap.Label(o), this.labelInstance.setBorderLine(0), this.labelInstance.setFontColor((b = this._style.label) == null ? void 0 : b.color), this.labelInstance.setFontSize(P((g = this._style.label) == null ? void 0 : g.fontSize, t)), this.labelInstance.setBackgroundColor((I = this._style.label) == null ? void 0 : I.backgroundColor), ((f = this._label) == null ? void 0 : f.visible) === !1 && this.labelInstance.hide(), this._ctx._map.addOverLay(this.labelInstance), this.initEvent(); } renderPolyline() { var e, n, l, o; this.polylineInstance && this._ctx._map.removeOverLay(this.polylineInstance); const t = this._path.map((a) => this._ctx.TMap.LngLat(a.longitude, a.latitude)); this.polylineInstance = new this._ctx.TMap.Polyline(t, { color: (e = this._style.line) == null ? void 0 : e.color, weight: (n = this._style.line) == null ? void 0 : n.width, opacity: (l = this._style.line) == null ? void 0 : l.opacity, lineStyle: (o = this._style.line) == null ? void 0 : o.style }), this._ctx._map.addOverLay(this.polylineInstance); } remove() { this.closeInfoWindow(), this.getInstances().forEach((t) => this._ctx._map.removeOverLay(t)); } panTo() { const t = this.getBounds(), e = T.getCenter(t); this._ctx._map.panTo(this._ctx.TMap.LngLat(e.longitude, e.latitude)); } getInstances() { return [this.polylineInstance, this.labelInstance].filter((e) => !!e); } setName(t) { super.setName(t); } setPath(t) { super.setPath(t); const e = t.map((n) => this._ctx.TMap.LngLat(n[0], n[1])); this.polylineInstance.setLngLats(e); } setStyle(t) { super.setStyle(t), this.renderPolyline(), this.renderLabel(); } show() { var t; super.show(), this.polylineInstance.setOpacity(((t = this._style.line) == null ? void 0 : t.opacity) ?? 1); } hidden() { super.hidden(), this.polylineInstance.setOpacity(0); } 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); } openInfoWindow(t) { let e = ""; t.url ? e = `<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>` : e = `<div style="width:${t.size.width}px; height:${t.size.height}px;"> ${t.html} </div>`; const n = new this._ctx.TMap.InfoWindow(); n.setContent(e), this.polylineInstance.openInfoWindow(n); } closeInfoWindow() { this.polylineInstance.closeInfoWindow(); } } export { z as TMapPolyline };