sascha
/
Notes
mirror of https://github.com/TriliumNext/Notes
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat(geomap): add labels to markers

pull/1017/head
Elian Doran 2025-01-21 19:33:12 +07:00
parent 08722d5935
commit 6b906a91d7
No known key found for this signature in database
1 changed files with 20 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/public/app/widgets/type_widgets/geo_map.ts
Unescape Escape View File

@ -10,8 +10,6 @@ import { t } from "../../services/i18n.js";
import attributes from "../../services/attributes.js"; import attributes from "../../services/attributes.js";
import asset_path from "../../../../services/asset_path.js"; import asset_path from "../../../../services/asset_path.js";
const ICON_WIDTH = 30;
const TPL = `\ const TPL = `\
<div class="note-detail-geo-map note-detail-printable"> <div class="note-detail-geo-map note-detail-printable">
<style> <style>
@ -31,6 +29,7 @@ const TPL = `\
position: relative; position: relative;
background: transparent; background: transparent;
border: 0; border: 0;
overflow: visible;
} }
.geo-map-container .leaflet-div-icon .icon-shadow { .geo-map-container .leaflet-div-icon .icon-shadow {
@ -40,7 +39,7 @@ const TPL = `\
z-index: -1; z-index: -1;
} }
.geo-map-container .leaflet-div-icon span { .geo-map-container .leaflet-div-icon .bx {
position: absolute; position: absolute;
top: 3px; top: 3px;
left: 2px; left: 2px;
@ -50,6 +49,23 @@ const TPL = `\
border-radius: 50%; border-radius: 50%;
font-size: 17px; font-size: 17px;
} }
.geo-map-container .leaflet-div-icon .title-label {
display: block;
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%);
font-size: 0.75rem;
height: 1rem;
color: black;
width: 100px;
text-align: center;
text-overflow: ellipsis;
text-shadow: -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white, 1px 1px 0 white;
white-space: no-wrap;
overflow: hidden;
}
</style> </style>
</div>`; </div>`;
@ -163,6 +179,7 @@ export default class GeoMapTypeWidget extends TypeWidget {
<img class="icon" src="${asset_path}/node_modules/leaflet/dist/images/marker-icon.png" /> <img class="icon" src="${asset_path}/node_modules/leaflet/dist/images/marker-icon.png" />
<img class="icon-shadow" src="${asset_path}/node_modules/leaflet/dist/images/marker-shadow.png" /> <img class="icon-shadow" src="${asset_path}/node_modules/leaflet/dist/images/marker-shadow.png" />
<span class="bx ${childNote.getIcon()}"></span> <span class="bx ${childNote.getIcon()}"></span>
<span class="title-label">${childNote.title}</span>
`, `,
iconSize: [ 25, 41 ], iconSize: [ 25, 41 ],
iconAnchor: [ 12, 41 ] iconAnchor: [ 12, 41 ]