UNPKG

@arcgis/map-components

Version:
96 lines (95 loc) 4.06 kB
/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */ import { html as h, svg as S } from "lit"; import { renderColorRampPreviewHTML as R } from "@arcgis/core/symbols/support/symbolUtils.js"; import { renderElement as C, safeStyleMap as z } from "@arcgis/lumina"; import { p as d, s as E, g as $ } from "./utils2.js"; const b = 10, p = 20, u = 10, g = 20; function v(n) { return typeof n == "number"; } function I(n = "vertical") { const e = "stroke:rgb(200, 200, 200);stroke-width:1"; return n === "vertical" ? h`<svg height=4 width=10>${S`<line style=${z(e)} x1=0 x2=10 y1=2 y2=2 />`}</svg>` : h`<svg height=10 width=10>${S`<line style=${z(e)} x1=5 x2=5 y1=0 y2=10 />`}</svg>`; } function P(n, e = "vertical") { const r = { height: `${p}px`, opacity: n?.toString() }; return h`<div class="univariate-above-below-symbol" style=${z(r)}>${I(e)}</div>`; } function w(n, e, r, s = "vertical", t) { n.infos.forEach((i, a) => { if (t && a === 2) { i.preview = C(P(r, s)); return; } else { const l = (v(i.size) ? d(i.size) : 0) + (s === "horizontal" ? g : u), f = i.preview, c = f?.tagName.toLowerCase() === "div", o = c ? f : document.createElement("div"); o.className = "univariate-above-below-symbol", s === "horizontal" ? o.style.width = `${l}px` : o.style.height = `${l}px`, !c && f && o.appendChild(f), E(o, $(e, i.label)), i.preview = o; } }); } function k(n, e = "classic") { const r = n.infos, s = r.at(0), t = r.at(-1), i = v(s.size) ? d(s.size) : 0, a = v(t.size) ? d(t.size) : 0; return e === "classic" ? (i + u) / 2 : (i - a) / 2; } function D(n, e) { if (!n) return null; const r = n.infos.map((t) => t.color), s = R( e.type === "full" ? r : e.type === "above" ? r.slice(0, 3) : r.slice(2, 5), // Last 3 colors { width: e.width ?? void 0, height: e.height ?? void 0, align: e.rampAlignment, cssEffectFilter: e.cssEffectFilter, ariaLabel: e.ariaLabel ?? void 0 } ); return s.className = "color-ramp", e.opacity != null && (s.style.opacity = e.opacity.toString()), s; } function L(n, e, r, s = "vertical") { let t = 0; const i = n.infos, a = Math.floor(i.length / 2), l = e === "full" || e === "above" ? 0 : a, f = e === "full" || e === "below" ? i.length - 1 : a; for (let c = l; c <= f; c++) if (r && c === a) t += s === "horizontal" ? b : p; else { const o = i[c].size, m = (v(o) ? d(o) : 0) + (s === "horizontal" ? g : u); t += m; } return Math.round(t); } function F(n, e, r, s = "vertical") { const t = L(n, e, r, s), i = n.infos, a = Math.floor(i.length / 2), l = e === "full" || e === "above" ? 0 : a, f = e === "full" || e === "below" ? i.length - 1 : a, c = v(i[l].size) ? i[l].size : 0, o = v(i[f].size) ? i[f].size : 0, m = e === "full" ? c + o : e === "above" ? c : o, x = r ? s === "vertical" ? p : b : 0, y = s === "vertical" ? u * (e === "full" ? 2 : 1) : g * (e === "full" ? 2 : 1); return Math.round(t - (d(m) / 2 + x / 2 + y / 2)); } function T(n, e, r, s = "vertical") { const t = n.infos; let i = t.find(({ type: l }) => l === "size-ramp"), a = t.find(({ type: l }) => l === "color-ramp"); return i && (i = { ...i }, i.infos = [...i.infos], w(i, e, r, s, !0)), a && (a = { ...a }, a.infos = [...a.infos]), s === "horizontal" && (i?.infos.reverse(), a?.infos.reverse()), { sizeRampElement: i, colorRampElement: a }; } function W(n, e, r = "vertical") { const s = n.infos; let t = s.find(({ type: a }) => a === "size-ramp"), i = s.find(({ type: a }) => a === "color-ramp"); return t && (t = { ...t }, t.infos = [...t.infos], w(t, e, null, r, !1)), i && (i = { ...i }, i.infos = [...i.infos]), r === "horizontal" && (t?.infos.reverse(), i?.infos.reverse()), { sizeRampElement: t, colorRampElement: i }; } const j = { marginLeft: "3px" }, q = { display: "table-cell", verticalAlign: "middle" }, B = { display: "flex", alignItems: "flex-start" }; export { L as a, F as b, D as c, k as d, W as e, j as f, T as g, q as h, B as u };