allow auto-downgrade for newer map versions and expand external icon detection to include SVGs and paths.

This commit is contained in:
Richard Standow 2026-02-27 10:30:22 +00:00
parent 647b0d4513
commit 743d45c318
3 changed files with 42 additions and 24 deletions

View file

@ -6,7 +6,7 @@ function drawMarkers() {
const rescale = +markers.attr("rescale");
const pinned = +markers.attr("pinned");
const markersData = pinned ? pack.markers.filter(({pinned}) => pinned) : pack.markers;
const markersData = pinned ? pack.markers.filter(({ pinned }) => pinned) : pack.markers;
const html = markersData.map(marker => drawMarker(marker, rescale));
markers.html(html.join(""));
@ -36,13 +36,13 @@ const getPin = (shape = "bubble", fill = "#fff", stroke = "#000") => {
};
function drawMarker(marker, rescale = 1) {
const {i, icon, x, y, dx = 50, dy = 50, px = 12, size = 30, pin, fill, stroke} = marker;
const { i, icon, x, y, dx = 50, dy = 50, px = 12, size = 30, pin, fill, stroke } = marker;
const id = `marker${i}`;
const zoomSize = rescale ? Math.max(rn(size / 5 + 24 / scale, 2), 1) : size;
const viewX = rn(x - zoomSize / 2, 1);
const viewY = rn(y - zoomSize, 1);
const isExternal = icon.startsWith("http") || icon.startsWith("data:image");
const isExternal = icon.startsWith("http") || icon.startsWith("data:image") || icon.includes(".svg") || icon.includes("/");
return /* html */ `
<svg id="${id}" viewbox="0 0 30 30" width="${zoomSize}" height="${zoomSize}" x="${viewX}" y="${viewY}">

View file

@ -1,5 +1,7 @@
"use strict";
const isExternalIcon = (icon) => icon && (icon.startsWith("http") || icon.startsWith("data:image") || icon.includes(".svg") || icon.includes("/"));
function drawMilitary() {
TIME && console.time("drawMilitary");
@ -56,14 +58,14 @@ const drawRegiments = function (regiments, s) {
.attr("text-rendering", "optimizeSpeed")
.attr("x", d => x(d) - size)
.attr("y", d => d.y)
.text(d => (d.icon.startsWith("http") || d.icon.startsWith("data:image") ? "" : d.icon));
.text(d => (isExternalIcon(d.icon) ? "" : d.icon));
g.append("image")
.attr("class", "regimentImage")
.attr("x", d => x(d) - h)
.attr("y", d => y(d))
.attr("height", h)
.attr("width", h)
.attr("href", d => (d.icon.startsWith("http") || d.icon.startsWith("data:image") ? d.icon : ""));
.attr("href", d => (isExternalIcon(d.icon) ? d.icon : ""));
};
const drawRegiment = function (reg, stateId) {
@ -109,14 +111,14 @@ const drawRegiment = function (reg, stateId) {
.attr("text-rendering", "optimizeSpeed")
.attr("x", x1 - size)
.attr("y", reg.y)
.text(reg.icon.startsWith("http") || reg.icon.startsWith("data:image") ? "" : reg.icon);
.text(isExternalIcon(reg.icon) ? "" : reg.icon);
g.append("image")
.attr("class", "regimentImage")
.attr("x", x1 - h)
.attr("y", y1)
.attr("height", h)
.attr("width", h)
.attr("href", reg.icon.startsWith("http") || reg.icon.startsWith("data:image") ? reg.icon : "");
.attr("href", isExternalIcon(reg.icon) ? reg.icon : "");
};
// move one regiment to another