Compare commits

...

2 commits

Author SHA1 Message Date
Yohan Boniface
3720ccff01
feat: add minimal "raw" icon shape (#2597)
Some checks are pending
Test & Docs / tests (postgresql, 3.10) (push) Waiting to run
Test & Docs / tests (postgresql, 3.12) (push) Waiting to run
Test & Docs / lint (push) Waiting to run
Basically, it means "no shape".


![image](https://github.com/user-attachments/assets/7ddaf76a-2128-49fc-8664-754b09d2b9ef)

It's a 48x48 max square (but if image is smaller it will stay smaller),
popup and tooltip always centered.

Let's see how this will be used and add more controls if needed later
(like size, center position…).

Also I've added a small border to the default white round icon, so it's
visible even on a white background.

(Not sure why the flower size is 47.8 instead of 48, cf screenshot,
sounds like a Leaflet rounding issue…)

cf #125
2025-04-04 16:08:04 +02:00
Yohan Boniface
9e5c985d6c feat: add minimal "raw" icon shape 2025-04-04 12:02:46 +02:00
5 changed files with 33 additions and 4 deletions

View file

@ -528,6 +528,7 @@ i.info {
display: inline-block;
color: black;
font-weight: bold;
overflow: hidden;
}
.umap-pictogram-choice img {
vertical-align: middle;

View file

@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg version="1.1" id="circle" width="15" height="15" viewBox="0 0 15 15" sodipodi:docname="marker.svg" inkscape:version="1.3.2 (091e20ef0f, 2023-11-25, custom)" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
<svg version="1.1" id="circle" width="15" height="15" viewBox="0 0 15 15" sodipodi:docname="marker.svg" inkscape:version="1.4.1 (93de688d07, 2025-03-30)" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
<defs id="defs1" />
<sodipodi:namedview id="namedview1" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:showpageshadow="2" inkscape:pageopacity="0.0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1" inkscape:zoom="53.666667" inkscape:cx="7.4906832" inkscape:cy="7.5" inkscape:window-width="1920" inkscape:window-height="1011" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" inkscape:current-layer="circle" />
<path d="M14,7.5c0,3.5899-2.9101,6.5-6.5,6.5S1,11.0899,1,7.5S3.9101,1,7.5,1S14,3.9101,14,7.5z" id="path1" style="fill:#ffffff" />
<sodipodi:namedview id="namedview1" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:showpageshadow="2" inkscape:pageopacity="0.0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1" inkscape:zoom="23.966903" inkscape:cx="7.8232888" inkscape:cy="5.9665616" inkscape:window-width="1920" inkscape:window-height="1011" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" inkscape:current-layer="circle" />
<path d="M14,7.5c0,3.5899-2.9101,6.5-6.5,6.5S1,11.0899,1,7.5S3.9101,1,7.5,1S14,3.9101,14,7.5z" id="path1" style="fill:#ffffff;stroke:#3e4444;stroke-opacity:1;stroke-width:0.5;stroke-dasharray:none" />
</svg>

Before

Width:  |  Height:  |  Size: 1 KiB

After

Width:  |  Height:  |  Size: 1.1 KiB

View file

@ -15,6 +15,8 @@ export function getClass(name) {
return Ball
case 'Drop':
return Drop
case 'Raw':
return Raw
default:
return DefaultIcon
}
@ -152,6 +154,17 @@ const Circle = BaseIcon.extend({
},
})
const Raw = DefaultIcon.extend({
default_options: {
iconSize: new L.Point(48, 48),
popupAnchor: new L.Point(0, 0),
tooltipAnchor: new L.Point(0, 0),
className: 'umap-raw-icon',
},
_getColor: () => 'transparent',
})
const Drop = DefaultIcon.extend({
default_options: {
iconAnchor: new L.Point(16, 42),

View file

@ -214,6 +214,7 @@ export const SCHEMA = {
['Circle', translate('Circle')],
['Drop', translate('Drop')],
['Ball', translate('Ball')],
['Raw', translate('None')],
],
default: 'Default',
},

View file

@ -892,7 +892,21 @@ a.umap-control-caption,
.umap-edit-enabled .readonly {
cursor: not-allowed;
}
.leaflet-container .umap-raw-icon img {
max-height: 48px !important;
max-width: 48px !important;
}
.umap-raw-icon {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-content: center;
overflow: hidden;
}
.umap-raw-icon.umap-icon-active {
box-shadow: var(--block-shadow);
}
/* ********************************* */
/* Ajax loader */