fix(views/geomap): tooltip not showing

This commit is contained in:
Elian Doran 2025-07-06 21:28:55 +03:00
parent 06fa59239c
commit ff6b4effbd
No known key found for this signature in database
2 changed files with 13 additions and 17 deletions

View File

@ -112,7 +112,6 @@ enum State {
export default class GeoView extends ViewMode<MapData> {
private args: ViewModeArgs;
private $root: JQuery<HTMLElement>;
private $container!: JQuery<HTMLElement>;
private map?: Map;
@ -125,7 +124,6 @@ export default class GeoView extends ViewMode<MapData> {
constructor(args: ViewModeArgs) {
super(args, "geoMap");
this.args = args;
this.$root = $(TPL);
this.$container = this.$root.find(".geo-map-container");
this.spacedUpdate = new SpacedUpdate(() => this.onSave(), 5_000);

View File

@ -2,7 +2,6 @@ import markerIcon from "leaflet/dist/images/marker-icon.png";
import markerIconShadow from "leaflet/dist/images/marker-shadow.png";
import { marker, latLng, divIcon, Map, type Marker } from "leaflet";
import type FNote from "../../../entities/fnote.js";
import note_tooltip from "../../../services/note_tooltip.js";
import openContextMenu from "./context_menu.js";
import server from "../../../services/server.js";
import { moveMarker } from "./editing.js";
@ -11,7 +10,7 @@ let gpxLoaded = false;
export default function processNoteWithMarker(map: Map, note: FNote, location: string) {
const [lat, lng] = location.split(",", 2).map((el) => parseFloat(el));
const icon = buildIcon(note.getIcon(), note.getColorClass(), note.title);
const icon = buildIcon(note.getIcon(), note.getColorClass(), note.title, note.noteId);
const newMarker = marker(latLng(lat, lng), {
icon,
@ -36,13 +35,6 @@ export default function processNoteWithMarker(map: Map, note: FNote, location: s
openContextMenu(note.noteId, e.originalEvent);
});
const el = newMarker.getElement();
if (el) {
const $el = $(el);
$el.attr("data-href", `#${note.noteId}`);
note_tooltip.setupElementTooltip($($el));
}
return newMarker;
}
@ -76,13 +68,19 @@ export async function processNoteWithGpxTrack(map: Map, note: FNote) {
return track;
}
function buildIcon(bxIconClass: string, colorClass?: string, title?: string) {
function buildIcon(bxIconClass: string, colorClass?: string, title?: string, noteIdLink?: string) {
let html = /*html*/`\
<img class="icon" src="${markerIcon}" />
<img class="icon-shadow" src="${markerIconShadow}" />
<span class="bx ${bxIconClass} ${colorClass ?? ""}"></span>
<span class="title-label">${title ?? ""}</span>`;
if (noteIdLink) {
html = `<div data-href="#root/${noteIdLink}">${html}</div>`;
}
return divIcon({
html: /*html*/`\
<img class="icon" src="${markerIcon}" />
<img class="icon-shadow" src="${markerIconShadow}" />
<span class="bx ${bxIconClass} ${colorClass ?? ""}"></span>
<span class="title-label">${title ?? ""}</span>`,
html,
iconSize: [25, 41],
iconAnchor: [12, 41]
});