vue-maplibre-gl
Version:
Vue 3 plugin for maplibre-gl
1,386 lines • 57.8 kB
JavaScript
/*!
* vue-maplibre-gl v5.5.9
* (c) 2025 Volker Nauruhn
* @license MIT
*/
var Re = Object.defineProperty;
var Ue = (t, o, e) => o in t ? Re(t, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[o] = e;
var w = (t, o, e) => Ue(t, typeof o != "symbol" ? o + "" : o, e);
import { watch as I, defineComponent as ae, inject as $, ref as Ce, onBeforeUnmount as Se, createCommentVNode as Fe, h as R, Teleport as Ne, nextTick as Ge, warn as He, reactive as Be } from "vue";
import "maplibre-gl";
import "geojson";
function Ht(t, o = 250, e = !1) {
let i;
function n() {
const r = arguments, s = () => {
i = void 0, e !== !0 && t.apply(this, r);
};
clearTimeout(i), e === !0 && i === void 0 && t.apply(this, r), i = window.setTimeout(s, o);
}
return n.cancel = () => {
clearTimeout(i);
}, n;
}
function le(t, o) {
let e, i;
return function() {
const n = arguments, r = this;
return e || (e = !0, setTimeout(() => e = !1, o), i = t.apply(r, n)), i;
};
}
const Pe = Symbol("map"), $e = Symbol("isLoaded"), qe = Symbol("isInitialized"), Bt = Symbol("componentId"), $t = Symbol("sourceId"), qt = Symbol("sourceLayerRegistry"), Zt = Symbol("emitter"), Ze = Symbol("fitBoundsOptions");
function Wt(t) {
return Object.keys(t);
}
function Yt(t) {
return Object.keys(t);
}
var Q = /* @__PURE__ */ ((t) => (t.TOP_LEFT = "top-left", t.TOP_RIGHT = "top-right", t.BOTTOM_LEFT = "bottom-left", t.BOTTOM_RIGHT = "bottom-right", t))(Q || {});
const Ae = Object.values(Q);
function We(t, o, e) {
I(t, (i) => {
var n, r;
i && Ae.indexOf(i) === -1 || ((n = o.value) != null && n.hasControl(e) && o.value.removeControl(e), (r = o.value) == null || r.addControl(e, i));
}, { immediate: !0 });
}
const F = class F {
constructor(o, e) {
w(this, "container");
this.isAdded = o, this.container = document.createElement("div"), this.setClasses(e);
}
getDefaultPosition() {
return Q.TOP_LEFT;
}
onAdd() {
return Ge(() => this.isAdded.value = !0), this.container;
}
onRemove() {
this.isAdded.value = !1, this.container.remove();
}
setClasses(o) {
o ? (this.container.classList.remove(F.CONTROL_CLASS), this.container.classList.remove(F.CONTROL_GROUP_CLASS)) : (this.container.classList.add(F.CONTROL_CLASS), this.container.classList.add(F.CONTROL_GROUP_CLASS));
}
};
w(F, "CONTROL_CLASS", "maplibregl-ctrl"), w(F, "CONTROL_GROUP_CLASS", "maplibregl-ctrl-group");
let oe = F;
const de = /* @__PURE__ */ ae({
name: "MglCustomControl",
props: {
position: {
type: String,
validator: (t) => Ae.indexOf(t) !== -1
},
noClasses: {
type: Boolean,
default: !1
}
},
slots: Object,
setup(t, { slots: o }) {
const e = $(Pe), i = $(qe), n = Ce(!1), r = new oe(n, t.noClasses);
return We(() => t.position, e, r), I(() => t.noClasses, (s) => r.setClasses(s)), Se(() => {
var s;
return i.value && ((s = e.value) == null ? void 0 : s.removeControl(r));
}), () => {
var s;
return n.value ? R(
Ne,
{ to: r.container },
(s = o.default) == null ? void 0 : s.call(o, {})
) : Fe("custom-component");
};
}
});
var q = /* @__PURE__ */ ((t) => (t.DEFAULT = "default", t.TEXT = "text", t.MDI = "mdi", t.SIMPLE_ICON = "simple-icons", t))(q || {});
const Ye = Object.values(q), W = {
text: void 0,
mdi: {
size: 21,
viewbox: "0 0 24 24"
},
"simple-icons": {
size: 21,
viewbox: "0 0 24 24"
},
default: {
size: 0,
viewbox: "0 0 0 0"
}
}, j = /* @__PURE__ */ ae({
name: "MglButton",
props: {
type: {
type: String,
default: "default",
validator: (t) => Ye.indexOf(t) !== -1
},
path: {
type: String
},
size: Number,
viewbox: String
},
slots: Object,
setup(t, { slots: o }) {
!t.path && t.type !== "text" && He("property `path` must be set on MaplibreButton");
const e = Ce(W[t.type] || W.default);
return I(() => t.type, (i) => e.value = W[i] || W.default), () => {
var i, n;
return t.type === "text" ? R("button", { type: "button" }, (i = o.default) == null ? void 0 : i.call(o, {})) : R(
"button",
{ type: "button", class: "maplibregl-ctrl-icon" },
[
R(
"svg",
{
width: t.size || e.value.size,
height: t.size || e.value.size,
viewBox: t.viewbox || e.value.viewbox
},
R("path", { fill: "currentColor", d: t.path })
),
(n = o.default) == null ? void 0 : n.call(o, {})
]
);
};
}
});
var L = 63710088e-1, Le = {
centimeters: L * 100,
centimetres: L * 100,
degrees: 360 / (2 * Math.PI),
feet: L * 3.28084,
inches: L * 39.37,
kilometers: L / 1e3,
kilometres: L / 1e3,
meters: L,
metres: L,
miles: L / 1609.344,
millimeters: L * 1e3,
millimetres: L * 1e3,
nauticalmiles: L / 1852,
radians: 1,
yards: L * 1.0936
};
function ce(t, o, e = {}) {
const i = { type: "Feature" };
return (e.id === 0 || e.id) && (i.id = e.id), e.bbox && (i.bbox = e.bbox), i.properties = o || {}, i.geometry = t, i;
}
function Xe(t, o, e = {}) {
if (!t)
throw new Error("coordinates is required");
if (!Array.isArray(t))
throw new Error("coordinates must be an Array");
if (t.length < 2)
throw new Error("coordinates must be at least 2 numbers long");
if (!fe(t[0]) || !fe(t[1]))
throw new Error("coordinates must contain numbers");
return ce({
type: "Point",
coordinates: t
}, o, e);
}
function Je(t, o, e = {}) {
for (const n of t) {
if (n.length < 4)
throw new Error(
"Each LinearRing of a Polygon must have 4 or more Positions."
);
if (n[n.length - 1].length !== n[0].length)
throw new Error("First and last Position are not equivalent.");
for (let r = 0; r < n[n.length - 1].length; r++)
if (n[n.length - 1][r] !== n[0][r])
throw new Error("First and last Position are not equivalent.");
}
return ce({
type: "Polygon",
coordinates: t
}, o, e);
}
function Ke(t, o = "kilometers") {
const e = Le[o];
if (!e)
throw new Error(o + " units is invalid");
return t * e;
}
function Qe(t, o = "kilometers") {
const e = Le[o];
if (!e)
throw new Error(o + " units is invalid");
return t / e;
}
function pe(t) {
return t % (2 * Math.PI) * 180 / Math.PI;
}
function N(t) {
return t % 360 * Math.PI / 180;
}
function fe(t) {
return !isNaN(t) && t !== null && !Array.isArray(t);
}
function je(t) {
return t !== null && typeof t == "object" && !Array.isArray(t);
}
function Ee(t, o, e) {
if (t !== null)
for (var i, n, r, s, a, l, d, h = 0, c = 0, u, p = t.type, g = p === "FeatureCollection", m = p === "Feature", y = g ? t.features.length : 1, f = 0; f < y; f++) {
d = g ? t.features[f].geometry : m ? t.geometry : t, u = d ? d.type === "GeometryCollection" : !1, a = u ? d.geometries.length : 1;
for (var v = 0; v < a; v++) {
var M = 0, b = 0;
if (s = u ? d.geometries[v] : d, s !== null) {
l = s.coordinates;
var _ = s.type;
switch (h = 0, _) {
case null:
break;
case "Point":
if (o(
l,
c,
f,
M,
b
) === !1)
return !1;
c++, M++;
break;
case "LineString":
case "MultiPoint":
for (i = 0; i < l.length; i++) {
if (o(
l[i],
c,
f,
M,
b
) === !1)
return !1;
c++, _ === "MultiPoint" && M++;
}
_ === "LineString" && M++;
break;
case "Polygon":
case "MultiLineString":
for (i = 0; i < l.length; i++) {
for (n = 0; n < l[i].length - h; n++) {
if (o(
l[i][n],
c,
f,
M,
b
) === !1)
return !1;
c++;
}
_ === "MultiLineString" && M++, _ === "Polygon" && b++;
}
_ === "Polygon" && M++;
break;
case "MultiPolygon":
for (i = 0; i < l.length; i++) {
for (b = 0, n = 0; n < l[i].length; n++) {
for (r = 0; r < l[i][n].length - h; r++) {
if (o(
l[i][n][r],
c,
f,
M,
b
) === !1)
return !1;
c++;
}
b++;
}
M++;
}
break;
case "GeometryCollection":
for (i = 0; i < s.geometries.length; i++)
if (Ee(s.geometries[i], o) === !1)
return !1;
break;
default:
throw new Error("Unknown Geometry Type");
}
}
}
}
}
function Oe(t, o) {
var e, i, n, r, s, a, l, d, h, c, u = 0, p = t.type === "FeatureCollection", g = t.type === "Feature", m = p ? t.features.length : 1;
for (e = 0; e < m; e++) {
for (a = p ? t.features[e].geometry : g ? t.geometry : t, d = p ? t.features[e].properties : g ? t.properties : {}, h = p ? t.features[e].bbox : g ? t.bbox : void 0, c = p ? t.features[e].id : g ? t.id : void 0, l = a ? a.type === "GeometryCollection" : !1, s = l ? a.geometries.length : 1, n = 0; n < s; n++) {
if (r = l ? a.geometries[n] : a, r === null) {
if (o(
null,
u,
d,
h,
c
) === !1)
return !1;
continue;
}
switch (r.type) {
case "Point":
case "LineString":
case "MultiPoint":
case "Polygon":
case "MultiLineString":
case "MultiPolygon": {
if (o(
r,
u,
d,
h,
c
) === !1)
return !1;
break;
}
case "GeometryCollection": {
for (i = 0; i < r.geometries.length; i++)
if (o(
r.geometries[i],
u,
d,
h,
c
) === !1)
return !1;
break;
}
default:
throw new Error("Unknown Geometry Type");
}
}
u++;
}
}
function et(t, o, e) {
var i = e;
return Oe(
t,
function(n, r, s, a, l) {
i = o(
i,
n,
r,
s,
a,
l
);
}
), i;
}
function tt(t) {
return et(
t,
(o, e) => o + it(e),
0
);
}
function it(t) {
let o = 0, e;
switch (t.type) {
case "Polygon":
return me(t.coordinates);
case "MultiPolygon":
for (e = 0; e < t.coordinates.length; e++)
o += me(t.coordinates[e]);
return o;
case "Point":
case "MultiPoint":
case "LineString":
case "MultiLineString":
return 0;
}
return 0;
}
function me(t) {
let o = 0;
if (t && t.length > 0) {
o += Math.abs(ge(t[0]));
for (let e = 1; e < t.length; e++)
o -= Math.abs(ge(t[e]));
}
return o;
}
var ot = L * L / 2, ee = Math.PI / 180;
function ge(t) {
const o = t.length - 1;
if (o <= 2) return 0;
let e = 0, i = 0;
for (; i < o; ) {
const n = t[i], r = t[i + 1 === o ? 0 : i + 1], s = t[i + 2 >= o ? (i + 2) % o : i + 2], a = n[0] * ee, l = r[1] * ee, d = s[0] * ee;
e += (d - a) * Math.sin(l), i++;
}
return e * ot;
}
var rt = tt;
function X(t) {
if (!t)
throw new Error("coord is required");
if (!Array.isArray(t)) {
if (t.type === "Feature" && t.geometry !== null && t.geometry.type === "Point")
return [...t.geometry.coordinates];
if (t.type === "Point")
return [...t.coordinates];
}
if (Array.isArray(t) && t.length >= 2 && !Array.isArray(t[0]) && !Array.isArray(t[1]))
return [...t];
throw new Error("coord must be GeoJSON Point or an Array of numbers");
}
function Y(t) {
if (Array.isArray(t))
return t;
if (t.type === "Feature") {
if (t.geometry !== null)
return t.geometry.coordinates;
} else if (t.coordinates)
return t.coordinates;
throw new Error(
"coords must be GeoJSON Feature, Geometry Object or an Array"
);
}
function nt(t) {
return t.type === "Feature" ? t.geometry : t;
}
function st(t, o) {
return t.type === "FeatureCollection" ? "FeatureCollection" : t.type === "GeometryCollection" ? "GeometryCollection" : t.type === "Feature" && t.geometry !== null ? t.geometry.type : t.type;
}
function at(t, o, e, i = {}) {
const n = X(t), r = N(n[0]), s = N(n[1]), a = N(e), l = Qe(o, i.units), d = Math.asin(
Math.sin(s) * Math.cos(l) + Math.cos(s) * Math.sin(l) * Math.cos(a)
), h = r + Math.atan2(
Math.sin(a) * Math.sin(l) * Math.cos(s),
Math.cos(l) - Math.sin(s) * Math.sin(d)
), c = pe(h), u = pe(d);
return Xe([c, u], i.properties);
}
function lt(t, o, e = {}) {
const i = e.steps || 64, n = e.properties ? e.properties : !Array.isArray(t) && t.type === "Feature" && t.properties ? t.properties : {}, r = [];
for (let s = 0; s < i; s++)
r.push(
at(t, o, s * -360 / i, e).geometry.coordinates
);
return r.push(r[0]), Je([r], n);
}
var ct = lt;
class he {
constructor(o, e, i) {
w(this, "isTouchEventSupported", window !== void 0 && !!window.TouchEvent);
w(this, "plugin");
w(this, "map");
w(this, "source");
w(this, "collection");
this.plugin = o, this.map = e, this.source = i;
}
hasPolygon() {
var o;
return !!((o = this.collection) != null && o.features[0]);
}
getPolygon() {
return this.collection.features[0];
}
clonePolygon() {
return this.getPolygon().geometry.coordinates[0].map((o) => [o[0], o[1]]);
}
isNearby(o, e, i) {
const n = i ? this.plugin.options.pointerPrecision.touch : this.plugin.options.pointerPrecision.mouse, r = this.map.project(o);
return Math.sqrt((e.x - r.x) ** 2 + (e.y - r.y) ** 2) <= n;
}
getMidpoint(o, e) {
return [(o[0] + e[0]) / 2, (o[1] + e[1]) / 2];
}
clear() {
var o;
(o = this.source) == null || o.setData({ type: "FeatureCollection", features: [] });
}
render() {
var o;
if (this.source) {
if (this.plugin.options.minArea.size && ((o = this.collection) != null && o.features[0])) {
const e = this.getAreaSize(this.collection.features[0]);
this.collection.features[0].properties.area = e, this.collection.features[0].properties.tooSmall = e < this.plugin.options.minArea.size && !this.collection.features[0].properties.hasHelperVertex, this.collection.features[0].properties.minSizeLabel = this.plugin.options.minArea.label;
}
this.source.setData(this.collection ?? { type: "FeatureCollection", features: [] });
}
}
emitOnUpdate(o) {
var e, i, n, r;
o ? (i = (e = this.plugin.options).onUpdate) == null || i.call(e, o) : this.collection && ((r = (n = this.plugin.options).onUpdate) == null || r.call(n, this.collection.features[0]));
}
createCircle(o, e, i = 64) {
const n = ct(
o,
e,
{
units: "meters",
steps: i,
properties: { center: o, radius: e, meta: "circle", minSizeLabel: this.plugin.options.minArea.label }
}
);
return n.properties.area = this.getAreaSize(n), n.properties.tooSmall = n.properties.area < (this.plugin.options.minArea.size ?? -1), n;
}
// returns m²
getAreaSize(o) {
return o.properties.meta === "circle" && o.properties.radius ? Math.PI * Math.pow(o.properties.radius, 2) : rt(o);
}
isTouchEvent(o) {
return this.isTouchEventSupported ? o.originalEvent instanceof TouchEvent : !1;
}
}
const U = 11102230246251565e-32, P = 134217729, ht = (3 + 8 * U) * U;
function te(t, o, e, i, n) {
let r, s, a, l, d = o[0], h = i[0], c = 0, u = 0;
h > d == h > -d ? (r = d, d = o[++c]) : (r = h, h = i[++u]);
let p = 0;
if (c < t && u < e)
for (h > d == h > -d ? (s = d + r, a = r - (s - d), d = o[++c]) : (s = h + r, a = r - (s - h), h = i[++u]), r = s, a !== 0 && (n[p++] = a); c < t && u < e; )
h > d == h > -d ? (s = r + d, l = s - r, a = r - (s - l) + (d - l), d = o[++c]) : (s = r + h, l = s - r, a = r - (s - l) + (h - l), h = i[++u]), r = s, a !== 0 && (n[p++] = a);
for (; c < t; )
s = r + d, l = s - r, a = r - (s - l) + (d - l), d = o[++c], r = s, a !== 0 && (n[p++] = a);
for (; u < e; )
s = r + h, l = s - r, a = r - (s - l) + (h - l), h = i[++u], r = s, a !== 0 && (n[p++] = a);
return (r !== 0 || p === 0) && (n[p++] = r), p;
}
function ut(t, o) {
let e = o[0];
for (let i = 1; i < t; i++) e += o[i];
return e;
}
function Z(t) {
return new Float64Array(t);
}
const dt = (3 + 16 * U) * U, pt = (2 + 12 * U) * U, ft = (9 + 64 * U) * U * U, G = Z(4), ye = Z(8), ve = Z(12), be = Z(16), A = Z(4);
function mt(t, o, e, i, n, r, s) {
let a, l, d, h, c, u, p, g, m, y, f, v, M, b, _, C, T, S;
const x = t - n, k = e - n, z = o - r, D = i - r;
b = x * D, u = P * x, p = u - (u - x), g = x - p, u = P * D, m = u - (u - D), y = D - m, _ = g * y - (b - p * m - g * m - p * y), C = z * k, u = P * z, p = u - (u - z), g = z - p, u = P * k, m = u - (u - k), y = k - m, T = g * y - (C - p * m - g * m - p * y), f = _ - T, c = _ - f, G[0] = _ - (f + c) + (c - T), v = b + f, c = v - b, M = b - (v - c) + (f - c), f = M - C, c = M - f, G[1] = M - (f + c) + (c - C), S = v + f, c = S - v, G[2] = v - (S - c) + (f - c), G[3] = S;
let V = ut(4, G), H = pt * s;
if (V >= H || -V >= H || (c = t - x, a = t - (x + c) + (c - n), c = e - k, d = e - (k + c) + (c - n), c = o - z, l = o - (z + c) + (c - r), c = i - D, h = i - (D + c) + (c - r), a === 0 && l === 0 && d === 0 && h === 0) || (H = ft * s + ht * Math.abs(V), V += x * h + D * a - (z * d + k * l), V >= H || -V >= H)) return V;
b = a * D, u = P * a, p = u - (u - a), g = a - p, u = P * D, m = u - (u - D), y = D - m, _ = g * y - (b - p * m - g * m - p * y), C = l * k, u = P * l, p = u - (u - l), g = l - p, u = P * k, m = u - (u - k), y = k - m, T = g * y - (C - p * m - g * m - p * y), f = _ - T, c = _ - f, A[0] = _ - (f + c) + (c - T), v = b + f, c = v - b, M = b - (v - c) + (f - c), f = M - C, c = M - f, A[1] = M - (f + c) + (c - C), S = v + f, c = S - v, A[2] = v - (S - c) + (f - c), A[3] = S;
const De = te(4, G, 4, A, ye);
b = x * h, u = P * x, p = u - (u - x), g = x - p, u = P * h, m = u - (u - h), y = h - m, _ = g * y - (b - p * m - g * m - p * y), C = z * d, u = P * z, p = u - (u - z), g = z - p, u = P * d, m = u - (u - d), y = d - m, T = g * y - (C - p * m - g * m - p * y), f = _ - T, c = _ - f, A[0] = _ - (f + c) + (c - T), v = b + f, c = v - b, M = b - (v - c) + (f - c), f = M - C, c = M - f, A[1] = M - (f + c) + (c - C), S = v + f, c = S - v, A[2] = v - (S - c) + (f - c), A[3] = S;
const Ie = te(De, ye, 4, A, ve);
b = a * h, u = P * a, p = u - (u - a), g = a - p, u = P * h, m = u - (u - h), y = h - m, _ = g * y - (b - p * m - g * m - p * y), C = l * d, u = P * l, p = u - (u - l), g = l - p, u = P * d, m = u - (u - d), y = d - m, T = g * y - (C - p * m - g * m - p * y), f = _ - T, c = _ - f, A[0] = _ - (f + c) + (c - T), v = b + f, c = v - b, M = b - (v - c) + (f - c), f = M - C, c = M - f, A[1] = M - (f + c) + (c - C), S = v + f, c = S - v, A[2] = v - (S - c) + (f - c), A[3] = S;
const Ve = te(Ie, ve, 4, A, be);
return be[Ve - 1];
}
function gt(t, o, e, i, n, r) {
const s = (o - r) * (e - n), a = (t - n) * (i - r), l = s - a, d = Math.abs(s + a);
return Math.abs(l) >= dt * d ? l : -mt(t, o, e, i, n, r, d);
}
function yt(t, o) {
var e, i, n = 0, r, s, a, l, d, h, c, u = t[0], p = t[1], g = o.length;
for (e = 0; e < g; e++) {
i = 0;
var m = o[e], y = m.length - 1;
if (h = m[0], h[0] !== m[y][0] && h[1] !== m[y][1])
throw new Error("First and last coordinates in a ring must be the same");
for (s = h[0] - u, a = h[1] - p, i; i < y; i++) {
if (c = m[i + 1], l = c[0] - u, d = c[1] - p, a === 0 && d === 0) {
if (l <= 0 && s >= 0 || s <= 0 && l >= 0)
return 0;
} else if (d >= 0 && a <= 0 || d <= 0 && a >= 0) {
if (r = gt(s, l, a, d, 0, 0), r === 0)
return 0;
(r > 0 && d > 0 && a <= 0 || r < 0 && d <= 0 && a > 0) && n++;
}
h = c, a = d, s = l;
}
}
return n % 2 !== 0;
}
function vt(t, o, e = {}) {
if (!t)
throw new Error("point is required");
if (!o)
throw new Error("polygon is required");
const i = X(t), n = nt(o), r = n.type, s = o.bbox;
let a = n.coordinates;
if (s && bt(i, s) === !1)
return !1;
r === "Polygon" && (a = [a]);
let l = !1;
for (var d = 0; d < a.length; ++d) {
const h = yt(i, a[d]);
if (h === 0) return !e.ignoreBoundary;
h && (l = !0);
}
return l;
}
function bt(t, o) {
return o[0] <= t[0] && o[1] <= t[1] && o[2] >= t[0] && o[3] >= t[1];
}
var J = vt;
function wt(t, o, e = {}) {
var i = X(t), n = X(o), r = N(n[1] - i[1]), s = N(n[0] - i[0]), a = N(i[1]), l = N(n[1]), d = Math.pow(Math.sin(r / 2), 2) + Math.pow(Math.sin(s / 2), 2) * Math.cos(a) * Math.cos(l);
return Ke(
2 * Math.atan2(Math.sqrt(d), Math.sqrt(1 - d)),
e.units
);
}
var re = wt;
class Mt extends he {
constructor(e, i, n, r) {
super(e, i, n);
w(this, "_mode");
w(this, "_moveStart");
w(this, "_resizeAnker");
this.onClick = this.onClick.bind(this), this.onMouseMove = le(this.onMouseMove.bind(this), 16), this.onMouseDown = this.onMouseDown.bind(this), this.onMouseUp = this.onMouseUp.bind(this), this.setModel(r);
}
onClick(e) {
if (this._mode)
return;
if (this.hasPolygon()) {
const a = this.getPolygon();
if (J(e.lngLat.toArray(), a)) {
e.preventDefault();
return;
}
}
const i = e.lngLat.toArray(), n = this.map.unproject([e.point.x + this.plugin.options.circleMode.creationSize, e.point.y]), r = re(i, n.toArray(), { units: "meters" }), s = this.createCircle(i, r);
this.createFeatureCollection(s), this.generateVertices(), this.render(), this.emitOnUpdate();
}
onMouseDown(e) {
var n, r;
if (!((n = this.collection) != null && n.features.length) || ((r = e.points) == null ? void 0 : r.length) > 1)
return;
for (let s = 0, a = this.collection.features[1].geometry.coordinates.length; s < a; s++)
if (this.isNearby(this.collection.features[1].geometry.coordinates[s], e.point, this.isTouchEvent(e))) {
e.preventDefault(), this._resizeAnker = s, this._mode = "resize";
return;
}
const i = this.getPolygon();
J(e.lngLat.toArray(), i) && (e.preventDefault(), this._moveStart = { polygon: this.clonePolygon(), point: [...i.properties.center], start: e.lngLat }, this._mode = "move");
}
onMouseMove(e) {
var n;
if (!this._mode || !((n = this.collection) != null && n.features.length))
return;
let i;
switch (this._mode) {
case "move":
if (!this._moveStart)
return;
e.preventDefault(), i = this.getPolygon();
const r = e.lngLat.lat - this._moveStart.start.lat, s = e.lngLat.lng - this._moveStart.start.lng;
for (let l = 0, d = i.geometry.coordinates[0].length; l < d; l++)
i.geometry.coordinates[0][l][1] = this._moveStart.polygon[l][1] + r, i.geometry.coordinates[0][l][0] = this._moveStart.polygon[l][0] + s;
i.properties.center[1] = this._moveStart.point[1] + r, i.properties.center[0] = this._moveStart.point[0] + s, this.generateVertices(), this.render();
break;
case "resize":
if (!this._resizeAnker)
return;
e.preventDefault(), i = this.getPolygon();
const a = re(i.properties.center, e.lngLat.toArray(), { units: "meters" });
i.geometry.coordinates[0] = this.createCircle(i.properties.center, a).geometry.coordinates[0], i.properties.radius = a, this.generateVertices(), this.render();
break;
}
}
onMouseUp(e) {
if (this._mode)
switch (this._mode) {
case "move":
case "resize":
e.preventDefault(), this._mode = void 0, this._moveStart = void 0, this._resizeAnker = void 0, this.emitOnUpdate();
break;
}
}
generateVertices() {
if (!this.collection)
return;
const e = this.getPolygon(), i = this.createCircle(e.properties.center, e.properties.radius, 4);
this.collection.features[1].geometry.coordinates = i.geometry.coordinates[0].slice(0, -1);
}
createFeatureCollection(e) {
this.collection = {
type: "FeatureCollection",
features: [
e,
{
type: "Feature",
geometry: {
type: "MultiPoint",
coordinates: []
},
properties: { meta: "vertex" }
}
]
};
}
register() {
this.map.on("click", this.onClick), this.map.on("mousemove", this.onMouseMove), this.map.on("mousedown", this.onMouseDown), this.map.on("mouseup", this.onMouseUp), this.map.on("touchstart", this.onMouseDown), this.map.on("touchmove", this.onMouseMove), this.map.on("touchend", this.onMouseUp);
}
unregister() {
this.map.off("click", this.onClick), this.map.off("mousemove", this.onMouseMove), this.map.off("mousedown", this.onMouseDown), this.map.off("mouseup", this.onMouseUp), this.map.off("touchstart", this.onMouseDown), this.map.off("touchmove", this.onMouseMove), this.map.off("touchend", this.onMouseUp);
}
setModel(e) {
var i;
((i = e == null ? void 0 : e.properties) == null ? void 0 : i.meta) === "circle" ? (this.createFeatureCollection(e), this.generateVertices()) : this.collection = void 0, this.render();
}
onOptionsUpdate() {
var e;
(e = this.collection) != null && e.features[0] && (this.collection.features[0].properties.minSizeLabel = this.plugin.options.minArea.label);
}
}
function B(t, o) {
const e = document.createElement(t);
return e.classList.add(o), e;
}
class _t extends he {
constructor(e, i, n, r) {
super(e, i, n);
w(this, "_model");
w(this, "_container");
w(this, "_circle");
w(this, "_widthContstraint");
w(this, "_heightConstraint");
w(this, "_minSizeLabel");
this.onViewportChangeEnd = this.onViewportChangeEnd.bind(this), this.onViewportChange = le(this.onViewportChange.bind(this), 100), this._model = r, this._container = B("div", "maplibregl-draw-circle-mode"), this._widthContstraint = B("div", "maplibregl-draw-circle-mode-width-constraint"), this._heightConstraint = B("div", "maplibregl-draw-circle-mode-height-constraint"), this._circle = B("div", "maplibregl-draw-circle-mode-circle"), this._circle.innerHTML = `<svg class="maplibre-draw-min-area-pattern" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%">
<defs>
<pattern id="maplibre-draw-min-area-pattern" patternUnits="userSpaceOnUse" width="4.5" height="4.5" patternTransform="rotate(135)">
<line x1="0" y="0" x2="0" y2="4.5" stroke="currentColor" stroke-width="1" />
</pattern>
</defs>
<rect width="100%" height="100%" fill="url(#maplibre-draw-min-area-pattern)" :opacity="1" />
</svg>`, this._minSizeLabel = B("div", "maplibre-draw-circle-mode-below-min-area-size-label"), e.options.minArea.label && (this._minSizeLabel.textContent = e.options.minArea.label), this._container.appendChild(this._heightConstraint), this._heightConstraint.appendChild(this._widthContstraint), this._widthContstraint.appendChild(this._circle), this._circle.appendChild(this._minSizeLabel), this.setPadding();
}
onViewportChange() {
this._model = this.viewportToModel(), this._model.properties.tooSmall ? this._circle.classList.add("maplibregl-draw-circle-too-small") : this._circle.classList.remove("maplibregl-draw-circle-too-small");
}
onViewportChangeEnd() {
this._model = this.viewportToModel(), this.emitOnUpdate(this._model), this._model.properties.tooSmall ? this._circle.classList.add("maplibregl-draw-circle-too-small") : this._circle.classList.remove("maplibregl-draw-circle-too-small");
}
viewportToModel() {
const e = this._container.offsetLeft + this._circle.offsetLeft, i = this._container.offsetTop + this._circle.offsetTop, n = this.map.unproject([e + this._circle.offsetWidth / 2, i + this._circle.offsetHeight / 2]), r = this.map.unproject([e + this._circle.offsetWidth / 2, i]), s = n.toArray(), a = re(r.toArray(), s, { units: "meters" });
return this.createCircle(s, a);
}
register() {
this.map.getCanvasContainer().appendChild(this._container), this.map.on("dragend", this.onViewportChangeEnd), this.map.on("zoomend", this.onViewportChangeEnd), this.map.on("zoom", this.onViewportChange);
}
unregister() {
this.map.getCanvasContainer().removeChild(this._container), this.map.off("dragend", this.onViewportChangeEnd), this.map.off("zoomend", this.onViewportChangeEnd), this.map.off("zoom", this.onViewportChange);
}
setModel(e) {
(e == null ? void 0 : e.properties.meta) === "circle" ? this._model = this.createCircle(e.properties.center, e.properties.radius) : this._model = void 0;
}
setPadding() {
var i;
const e = (i = this.plugin.options.fitBoundsOptions) == null ? void 0 : i.padding;
switch (typeof e) {
case "number":
this._container.style.setProperty("--padding", `${e}px`);
break;
case "object":
let n;
for (n in e)
typeof e[n] == "number" && this._container.style.setProperty(`--padding-${n}`, `${e[n]}px`);
break;
}
}
onOptionsUpdate() {
this.plugin.options.minArea.label && (this._minSizeLabel.textContent = this.plugin.options.minArea.label);
}
}
function Ct(t, o = {}) {
var e = typeof o == "object" ? o.mutate : o;
if (!t) throw new Error("geojson is required");
var i = st(t), n = [];
switch (i) {
case "LineString":
n = ie(t, i);
break;
case "MultiLineString":
case "Polygon":
Y(t).forEach(function(s) {
n.push(ie(s, i));
});
break;
case "MultiPolygon":
Y(t).forEach(function(s) {
var a = [];
s.forEach(function(l) {
a.push(ie(l, i));
}), n.push(a);
});
break;
case "Point":
return t;
case "MultiPoint":
var r = {};
Y(t).forEach(function(s) {
var a = s.join("-");
Object.prototype.hasOwnProperty.call(r, a) || (n.push(s), r[a] = !0);
});
break;
default:
throw new Error(i + " geometry not supported");
}
return t.coordinates ? e === !0 ? (t.coordinates = n, t) : { type: i, coordinates: n } : e === !0 ? (t.geometry.coordinates = n, t) : ce({ type: i, coordinates: n }, t.properties, {
bbox: t.bbox,
id: t.id
});
}
function ie(t, o) {
var e = Y(t);
if (e.length === 2 && !we(e[0], e[1])) return e;
var i = [], n = e.length - 1, r = i.length;
i.push(e[0]);
for (var s = 1; s < n; s++) {
var a = i[i.length - 1];
e[s][0] === a[0] && e[s][1] === a[1] || (i.push(e[s]), r = i.length, r > 2 && Me(
i[r - 3],
i[r - 1],
i[r - 2]
) && i.splice(i.length - 2, 1));
}
if (i.push(e[e.length - 1]), r = i.length, (o === "Polygon" || o === "MultiPolygon") && we(e[0], e[e.length - 1]) && r < 4)
throw new Error("invalid polygon");
return o === "LineString" && r < 3 || Me(
i[r - 3],
i[r - 1],
i[r - 2]
) && i.splice(i.length - 2, 1), i;
}
function we(t, o) {
return t[0] === o[0] && t[1] === o[1];
}
function Me(t, o, e) {
var i = e[0], n = e[1], r = t[0], s = t[1], a = o[0], l = o[1], d = i - r, h = n - s, c = a - r, u = l - s, p = d * u - h * c;
return p !== 0 ? !1 : Math.abs(c) >= Math.abs(u) ? c > 0 ? r <= i && i <= a : a <= i && i <= r : u > 0 ? s <= n && n <= l : l <= n && n <= s;
}
function Te(t) {
if (!t)
throw new Error("geojson is required");
switch (t.type) {
case "Feature":
return xe(t);
case "FeatureCollection":
return St(t);
case "Point":
case "LineString":
case "Polygon":
case "MultiPoint":
case "MultiLineString":
case "MultiPolygon":
case "GeometryCollection":
return ue(t);
default:
throw new Error("unknown GeoJSON type");
}
}
function xe(t) {
const o = { type: "Feature" };
return Object.keys(t).forEach((e) => {
switch (e) {
case "type":
case "properties":
case "geometry":
return;
default:
o[e] = t[e];
}
}), o.properties = ke(t.properties), t.geometry == null ? o.geometry = null : o.geometry = ue(t.geometry), o;
}
function ke(t) {
const o = {};
return t && Object.keys(t).forEach((e) => {
const i = t[e];
typeof i == "object" ? i === null ? o[e] = null : Array.isArray(i) ? o[e] = i.map((n) => n) : o[e] = ke(i) : o[e] = i;
}), o;
}
function St(t) {
const o = { type: "FeatureCollection" };
return Object.keys(t).forEach((e) => {
switch (e) {
case "type":
case "features":
return;
default:
o[e] = t[e];
}
}), o.features = t.features.map((e) => xe(e)), o;
}
function ue(t) {
const o = { type: t.type };
return t.bbox && (o.bbox = t.bbox), t.type === "GeometryCollection" ? (o.geometries = t.geometries.map((e) => ue(e)), o) : (o.coordinates = ze(t.coordinates), o);
}
function ze(t) {
const o = t;
return typeof o[0] != "object" ? o.slice() : o.map((e) => ze(e));
}
var Pt = Te;
function At(t, o) {
var e = t[0] - o[0], i = t[1] - o[1];
return e * e + i * i;
}
function Lt(t, o, e) {
var i = o[0], n = o[1], r = e[0] - i, s = e[1] - n;
if (r !== 0 || s !== 0) {
var a = ((t[0] - i) * r + (t[1] - n) * s) / (r * r + s * s);
a > 1 ? (i = e[0], n = e[1]) : a > 0 && (i += r * a, n += s * a);
}
return r = t[0] - i, s = t[1] - n, r * r + s * s;
}
function Et(t, o) {
for (var e = t[0], i = [e], n, r = 1, s = t.length; r < s; r++)
n = t[r], At(n, e) > o && (i.push(n), e = n);
return e !== n && i.push(n), i;
}
function ne(t, o, e, i, n) {
for (var r = i, s, a = o + 1; a < e; a++) {
var l = Lt(t[a], t[o], t[e]);
l > r && (s = a, r = l);
}
r > i && (s - o > 1 && ne(t, o, s, i, n), n.push(t[s]), e - s > 1 && ne(t, s, e, i, n));
}
function Ot(t, o) {
var e = t.length - 1, i = [t[0]];
return ne(t, 0, e, o, i), i.push(t[e]), i;
}
function K(t, o, e) {
if (t.length <= 2) return t;
var i = o !== void 0 ? o * o : 1;
return t = e ? t : Et(t, i), t = Ot(t, i), t;
}
function Tt(t, o = {}) {
var e, i, n;
if (o = o ?? {}, !je(o)) throw new Error("options is invalid");
const r = (e = o.tolerance) != null ? e : 1, s = (i = o.highQuality) != null ? i : !1, a = (n = o.mutate) != null ? n : !1;
if (!t) throw new Error("geojson is required");
if (r && r < 0) throw new Error("invalid tolerance");
return a !== !0 && (t = Te(t)), Oe(t, function(l) {
xt(l, r, s);
}), t;
}
function xt(t, o, e) {
const i = t.type;
if (i === "Point" || i === "MultiPoint") return t;
if (Ct(t, { mutate: !0 }), i !== "GeometryCollection")
switch (i) {
case "LineString":
t.coordinates = K(
t.coordinates,
o,
e
);
break;
case "MultiLineString":
t.coordinates = t.coordinates.map(
(n) => K(n, o, e)
);
break;
case "Polygon":
t.coordinates = _e(
t.coordinates,
o,
e
);
break;
case "MultiPolygon":
t.coordinates = t.coordinates.map(
(n) => _e(n, o, e)
);
}
return t;
}
function _e(t, o, e) {
return t.map(function(i) {
if (i.length < 4)
throw new Error("invalid polygon");
let n = o, r = K(i, n, e);
for (; !kt(r); )
n -= n * 0.01, r = K(i, n, e);
return (r[r.length - 1][0] !== r[0][0] || r[r.length - 1][1] !== r[0][1]) && r.push(r[0]), r;
});
}
function kt(t) {
return t.length < 3 ? !1 : !(t.length === 3 && t[2][0] === t[0][0] && t[2][1] === t[0][1]);
}
var zt = Tt;
class Dt extends he {
constructor(e, i, n, r) {
super(e, i, n);
w(this, "_mode");
w(this, "_moveStart");
this.onClick = this.onClick.bind(this), this.onDoubleClick = this.onDoubleClick.bind(this), this.onMouseMove = le(this.onMouseMove.bind(this), 16), this.onMouseDown = this.onMouseDown.bind(this), this.onMouseUp = this.onMouseUp.bind(this), this.setModel(r);
}
onClick(e) {
var r;
const i = e.lngLat.toArray();
let n;
switch (this._mode) {
case "create":
if (n = this.getPolygon(), this.isNearby(n.geometry.coordinates[0][0], e.point, this.isTouchEvent(e))) {
this.getPolygon().geometry.coordinates[0].splice(1, 1), this.endCreation();
return;
}
n.geometry.coordinates[0].splice(1, 0, i), this.collection.features[1].geometry.coordinates[1] = i;
const s = n.geometry.coordinates[0].length, a = s - 2;
n.properties.hasHelperVertex && s === 5 && (n.geometry.coordinates[0].splice(a, 1), n.properties.hasHelperVertex = !1);
break;
default:
if (e.originalEvent.ctrlKey && this.collection) {
e.preventDefault();
const l = this.getPolygon(), d = l.geometry.coordinates[0].length;
if (d < 5)
return;
for (let h = 0; h < d; h++)
if (this.isNearby(l.geometry.coordinates[0][h], e.point, this.isTouchEvent(e))) {
l.geometry.coordinates[0].splice(h, 1), h === 0 && (l.geometry.coordinates[0].splice(-1, 1), l.geometry.coordinates[0].push(l.geometry.coordinates[0][0])), this.generateCollectionWithVertexes(), (r = this.source) == null || r.setData(this.collection), this.emitOnUpdate();
return;
}
}
if (this.hasPolygon() && (n = this.getPolygon(), J(e.lngLat.toArray(), n))) {
e.preventDefault();
return;
}
this.createFeatureCollection({
type: "Feature",
geometry: {
type: "Polygon",
coordinates: [[i, i, i, i]]
},
properties: { meta: "polygon", hasHelperVertex: !0 }
}), this.collection.features[1].geometry.coordinates = [i, i], this._mode = "create";
}
this.render();
}
onDoubleClick(e) {
if (!(!this._mode || !this.collection))
switch (this._mode) {
case "create":
e.preventDefault(), this.endCreation();
break;
}
}
onMouseMove(e) {
var r;
if (!this._mode || !((r = this.collection) != null && r.features.length))
return;
let i, n;
switch (this._mode) {
case "create":
e.preventDefault(), i = this.getPolygon(), n = e.lngLat.toArray();
const s = i.geometry.coordinates[0].length, a = s - 2;
if (i.geometry.coordinates[0][1] = n, i.properties.hasHelperVertex) {
const h = this.map.unproject([e.point.x + 1, e.point.y]), c = Math.abs((h.lng - n[0]) / 3);
i.geometry.coordinates[0][a] = this.calculateB(n, i.geometry.coordinates[0][0], c);
}
this.render();
break;
case "move":
if (!this._moveStart)
return;
e.preventDefault(), i = this.getPolygon();
const l = e.lngLat.lng - this._moveStart.start.lng, d = e.lngLat.lat - this._moveStart.start.lat;
for (let h = 0, c = i.geometry.coordinates[0].length; h < c; h++)
i.geometry.coordinates[0][h][0] = this._moveStart.polygon[h][0] + l, i.geometry.coordinates[0][h][1] = this._moveStart.polygon[h][1] + d;
this.generateCollectionWithVertexes(), this.render();
break;
case "move_vertex":
if (!this._moveStart)
return;
e.preventDefault(), i = this.getPolygon(), n = e.lngLat.toArray();
for (let h = 0, c = i.geometry.coordinates[0].length; h < c; h++)
if (this._moveStart.polygon[h][0] === this._moveStart.point[0] && this._moveStart.polygon[h][1] === this._moveStart.point[1]) {
i.geometry.coordinates[0][h] = n, h === 0 && (i.geometry.coordinates[0][i.geometry.coordinates[0].length - 1] = n);
break;
}
this.generateCollectionWithVertexes(), this.render();
break;
case "add_vertex":
if (!this._moveStart)
return;
e.preventDefault(), i = this.getPolygon(), n = e.lngLat.toArray();
for (let h = 0, c = i.geometry.coordinates[0].length; h < c - 1; h++) {
const u = this.getMidpoint(i.geometry.coordinates[0][h], i.geometry.coordinates[0][h + 1]);
if (u[0] === this._moveStart.point[0] && u[1] === this._moveStart.point[1]) {
i.geometry.coordinates[0].splice(h + 1, 0, u), this._moveStart = {
polygon: this.clonePolygon(),
point: u,
start: e.lngLat
}, this._mode = "move_vertex";
break;
}
}
this.generateCollectionWithVertexes(), this.render();
break;
}
}
onMouseDown(e) {
var n, r;
if (this._mode === "create" || !((n = this.collection) != null && n.features.length) || ((r = e.points) == null ? void 0 : r.length) > 1)
return;
for (let s = 0, a = this.collection.features[1].geometry.coordinates.length; s < a; s++)
if (this.isNearby(this.collection.features[1].geometry.coordinates[s], e.point, this.isTouchEvent(e))) {
e.preventDefault(), this._moveStart = {
polygon: this.clonePolygon(),
point: this.collection.features[1].geometry.coordinates[s],
start: e.lngLat
}, this._mode = "move_vertex";
return;
}
for (let s = 0, a = this.collection.features[2].geometry.coordinates.length; s < a; s++)
if (this.isNearby(this.collection.features[2].geometry.coordinates[s], e.point, this.isTouchEvent(e))) {
e.preventDefault(), this._moveStart = {
polygon: this.clonePolygon(),
point: this.collection.features[2].geometry.coordinates[s],
start: e.lngLat
}, this._mode = "add_vertex";
return;
}
const i = this.getPolygon();
J(e.lngLat.toArray(), i) && (e.preventDefault(), this._moveStart = { polygon: this.clonePolygon(), start: e.lngLat }, this._mode = "move");
}
onMouseUp(e) {
if (this._mode)
switch (this._mode) {
case "move":
case "move_vertex":
case "add_vertex":
e.preventDefault(), this._mode = void 0, this._moveStart = void 0, e.originalEvent.ctrlKey || this.emitOnUpdate();
break;
}
}
register() {
this.map.on("click", this.onClick), this.map.on("dblclick", this.onDoubleClick), this.map.on("mousemove", this.onMouseMove), this.map.on("mousedown", this.onMouseDown), this.map.on("mouseup", this.onMouseUp), this.map.on("touchstart", this.onMouseDown), this.map.on("touchmove", this.onMouseMove), this.map.on("touchend", this.onMouseUp);
}
unregister() {
this.map.off("click", this.onClick), this.map.off("dblclick", this.onDoubleClick), this.map.off("mousemove", this.onMouseMove), this.map.off("mousedown", this.onMouseDown), this.map.off("mouseup", this.onMouseUp), this.map.off("touchstart", this.onMouseDown), this.map.off("touchmove", this.onMouseMove), this.map.off("touchend", this.onMouseUp);
}
setModel(e) {
var i;
((i = e == null ? void 0 : e.properties) == null ? void 0 : i.meta) === "polygon" ? (this.createFeatureCollection(e), this.generateCollectionWithVertexes()) : this.collection = void 0, this.render();
}
onOptionsUpdate() {
var e;
(e = this.collection) != null && e.features[0] && (this.collection.features[0].properties.minSizeLabel = this.plugin.options.minArea.label);
}
createFeatureCollection(e) {
this.collection = {
type: "FeatureCollection",
features: [
e,
{
type: "Feature",
geometry: {
type: "MultiPoint",
coordinates: []
},
properties: { meta: "vertex" }
},
{
type: "Feature",
geometry: {
type: "MultiPoint",
coordinates: []
},
properties: { meta: "midpoint" }
}
]
};
}
endCreation() {
const e = this.getPolygon();
this._mode = void 0, this.collection.features[0] = zt(e, { tolerance: 1e-5, highQuality: !0 }), this.generateCollectionWithVertexes(), this.render(), this.emitOnUpdate();
}
generateCollectionWithVertexes() {
if (!this.collection)
return;
const e = this.getPolygon(), i = e.geometry.coordinates[0].length;
this.collection.features[1].geometry.coordinates = e.geometry.coordinates[0].slice(0, -1);
const n = new Array(i - 1);
for (let r = 0; r < i - 1; r++)
n[r] = this.getMidpoint(e.geometry.coordinates[0][r], e.geometry.coordinates[0][r + 1]);
this.collection.features[2].geometry.coordinates = n;
}
calculateB(e, i, n) {
const r = e[0] - i[0], s = e[1] - i[1], a = Math.sqrt(r * r + s * s), l = i[0] + n * (-s / a), d = i[1] + n * (r / a);
return [l, d];
}
}
const It = [
// ACTIVE (being drawn)
// line stroke
{
id: "gl-draw-line",
type: "line",
filter: ["all", ["==", "$type", "LineString"], ["!=", "mode", "static"]],
layout: {
"line-cap": "round",
"line-join": "round"
},
paint: {
"line-color": "#e74b3c",
"line-dasharray": [0.2, 2],
"line-width": 2
}
},
// polygon fill
{
id: "gl-draw-polygon-fill",
type: "fill",
filter: ["all", ["==", "$type", "Polygon"], ["!=", "mode", "static"]],
paint: {
"fill-color": "#3c99e7",
"fill-outline-color": "#3c99e7",
"fill-opacity": 0.1
}
},
// polygon fill below min area size
{
id: "gl-draw-polygon-fill-below-min-area-size",
type: "fill",
filter: ["all", ["==", "$type", "Polygon"], ["==", "tooSmall", !0]],
paint: {
"fill-pattern": "maplibre-draw-min-area-pattern"
}
},
// polygon label below min area size
{
id: "gl-draw-polygon-fill-below-min-area-size-label",
type: "symbol",
filter: ["all", ["==", "$type", "Polygon"], ["==", "tooSmall", !0], ["has", "minSizeLabel"]],
layout: {
"text-field": ["get", "minSizeLabel"],
"text-font": ["Open Sans Bold"],
"text-size": 24,
"text-justify": "center",
"text-anchor": "center"
},
paint: {
"text-color": "#e74b3c",
"text-halo-color": "#fff",
"text-halo-width": 3
}
},
// polygon mid points
{
id: "gl-draw-polygon-midpoint",
type: "circle",
filter: [
"all",
["==", "$type", "Point"],
["==", "meta", "midpoint"]
],
paint: {
"circle-radius": 4,
"circle-color": "#e74b3c"
}
},
// polygon outline stroke
// This doesn't style the first edge of the polygon, which uses the line stroke styling instead
{
id: "gl-draw-polygon-stroke-active",
type: "line",
filter: ["all", ["==", "$type", "Polygon"], ["!=", "mode", "static"]],
layout: {
"line-cap": "round",
"line-join": "round"
},
paint: {
"line-color": "#e74b3c",
"line-dasharray": [0.2, 2],
"line-width": 2
}
},
// vertex point halos
{
id: "gl-draw-polygon-and-line-vertex-halo-active",
type: "circle",
filter: ["all", ["==", "meta", "vertex"], ["==", "$type", "Point"], ["!=", "mode", "static"]],
paint: {
"circle-radius": 8,
"circle-color": "#FFF"
}
},
// vertex points
{
id: "gl-draw-polygon-and-line-vertex-active",
type: "circle",
filter: ["all", ["==", "meta", "vertex"], ["==", "$type", "Point"], ["!=", "mode", "static"]],
paint: {
"circle-radius": 5,
"circle-color": "#e74b3c"
}
},
// INACTIVE (static, already drawn)
// line stroke
{
id: "gl-draw-line-static",
type: "line",
filter: ["all", ["==", "$type", "LineString"], ["==", "mode", "static"]],
layout: {
"line-cap": "round",
"line-join": "round"
},
paint: {
"line-color": "#000",
"line-width": 3
}
},
// polygon fill
{
id: "gl-draw-polygon-fill-static",
type: "fill",
filter: ["all", ["==", "$type", "Polygon"], ["==", "mode", "static"]],
paint: {
"fill-color": "#000",
"fill-outline-color": "#000",
"fill-opacity": 0.1
}
},
// polygon outline
{
id: "gl-draw-polygon-stroke-static",
type: "line",
filter: ["all", ["==", "$type", "Polygon"], ["==", "mode", "static"]],
layout: {
"line-cap": "round",
"line-join": "round"
},
paint: {
"line-color": "#000",
"line-width": 3
}
}
];
var O = /* @__PURE__ */ ((t) => (t.POLYGON = "POLYGON", t.CIRCLE = "CIRCLE", t.CIRCLE_STATIC = "CIRCLE_STATIC", t))(O || {});
function Vt(t, o = {}) {
if (t.bbox != null && o.recompute !== !0)
return t.bbox;
const e = [1 / 0, 1 / 0, -1 / 0, -1 / 0];
return Ee(t, (i) => {
e[0] > i[0] && (e[0] = i[0]), e[1] > i[1] && (e[1] = i[1]), e[2] < i[0] && (e[2] = i[0]), e[3] < i[1] && (e[3] = i[1]);
}), e;
}
var Rt = Vt;
const E = class E {
constructor(o, e, i = {}) {
w(this, "map");
w(this, "_model");
w(this, "_mode");
w(this, "_modeInstance");
w(this, "_source");
w(this, "options");
this.map = o, this._model = e ? this.prepareModel(e) : void 0, this._mode = i.mode ?? O.POLYGON, this.options = {
...i,
styles: i.styles ?? It,
autoZoom: i.autoZoom ?? !0,
minArea: i.minArea ?? {},
pointerPrecision: {
mouse: 24,
touch: 36,
...i.pointerPrecision || {}
},
circleMode: {
creationSize: 75,
...i.circleMode || {}
}
}