user01/MapAssignFlag
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Make name tooltip permanent and 1.2x larger

Browse Source 
- Add permanent: true to tooltip (always visible speech bubble)
- Add CSS class flag-marker-tooltip with 1.2em font size
- Use white-space: nowrap to prevent word wrapping
This commit is contained in:
user01
2026-05-15 18:56:27 +09:00
parent a801274e5f
commit b87d6302d3
1 changed files with 3 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
index.html
View File

@@ -185,6 +185,7 @@ body { font-family: 'Segoe UI', sans-serif; display: flex; height: 100vh; color:
} }
.help-text { font-size: 12px; color: #718096; margin-top: 6px; } .help-text { font-size: 12px; color: #718096; margin-top: 6px; }
.flag-marker-tooltip { font-size: 1.2em !important; padding: 6px 12px !important; white-space: nowrap; }
</style> </style>
</head> </head>
<body> <body>
@@ -594,7 +595,7 @@ map.on('click', (e) => {
const { lat, lng } = e.latlng; const { lat, lng } = e.latlng;
const displayNum = flag.number || flags.indexOf(flag) + 1; const displayNum = flag.number || flags.indexOf(flag) + 1;
const marker = L.marker([lat, lng], { icon: makeNumIcon(displayNum), draggable: true }).addTo(map); const marker = L.marker([lat, lng], { icon: makeNumIcon(displayNum), draggable: true }).addTo(map);
if (flag.name) marker.bindTooltip(esc(flag.name), { direction: 'right', offset: [10, 0] }); if (flag.name) marker.bindTooltip(esc(flag.name), { permanent: true, direction: 'right', offset: [10, 0], className: 'flag-marker-tooltip' });
marker.on('dragend', () => { marker.on('dragend', () => {
const p = marker.getLatLng(); flag.lat = p.lat; flag.lng = p.lng; const p = marker.getLatLng(); flag.lat = p.lat; flag.lng = p.lng;
scheduleGeocode(flag); renderList(); scheduleGeocode(flag); renderList();
@@ -646,7 +647,7 @@ document.getElementById('file-input').addEventListener('change', async (e) => {
if (!isNaN(lat) && !isNaN(lng)) { if (!isNaN(lat) && !isNaN(lng)) {
const displayNum = flag.number || flags.indexOf(flag) + 1; const displayNum = flag.number || flags.indexOf(flag) + 1;
const marker = L.marker([lat, lng], { icon: makeNumIcon(displayNum), draggable: true }).addTo(map); const marker = L.marker([lat, lng], { icon: makeNumIcon(displayNum), draggable: true }).addTo(map);
if (flag.name) marker.bindTooltip(esc(flag.name), { direction: 'right', offset: [10, 0] }); if (flag.name) marker.bindTooltip(esc(flag.name), { permanent: true, direction: 'right', offset: [10, 0], className: 'flag-marker-tooltip' });
marker.on('dragend', () => { marker.on('dragend', () => {
const p = marker.getLatLng(); flag.lat = p.lat; flag.lng = p.lng; const p = marker.getLatLng(); flag.lat = p.lat; flag.lng = p.lng;
scheduleGeocode(flag); renderList(); scheduleGeocode(flag); renderList();