Add per-stand-type icons
With-Icons-Drawn-By: Käthe
This commit is contained in:
parent
d666f15b00
commit
f3adeb7482
GPG key ID:
A851D929D52FB93F
9 changed files with 338 additions and 16 deletions
25
images/icons/barrel.svg
Normal file
25
images/icons/barrel.svg
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="-14 -17 128 128">
|
||||
<!-- shadow -->
|
||||
<!-- barrel -->
|
||||
<path style="stroke-width:32px;stroke:white;fill:white" d="M 20 10 A 30 10 0 0 1 80 10 L 80 60 A 30 10 0 0 1 20 60 L 20 10" />
|
||||
<!-- legs -->
|
||||
<line x1="35" y1="67" x2="30" y2="96" style="stroke:white;stroke-width:32px;stroke-linecap:round;"/>
|
||||
<line x1="65" y1="67" x2="70" y2="96" style="stroke:white;stroke-width:32px;stroke-linecap:round;"/>
|
||||
<line x1="30" y1="95" x2="70" y2="95" style="stroke:white;stroke-width:16px;"/>
|
||||
|
||||
<!-- barrel top -->
|
||||
<ellipse cx="50" cy="10" rx="30" ry="10" style="fill:none;stroke:black;stroke-width:12px"/>
|
||||
<!-- barrel walls -->
|
||||
<line x1="20" y1="10" x2="20" y2="60" style="stroke:black;stroke-width:12px;"/>
|
||||
<line x1="80" y1="10" x2="80" y2="60" style="stroke:black;stroke-width:12px;"/>
|
||||
<!-- barrel mid -->
|
||||
<path d="M 20 35 A 30 10 180 0 0 80 35 50" style="stroke:black;stroke-width:8px;fill:none;" />
|
||||
<!-- barrel bottom -->
|
||||
<path d="M 20 60 A 30 10 180 0 0 80 60 50" style="stroke:black;stroke-width:12px;fill:none;" />
|
||||
<!-- legs -->
|
||||
<line x1="35" y1="70" x2="30" y2="96" style="stroke:black;stroke-width:12px;stroke-linecap:round;"/>
|
||||
<line x1="65" y1="70" x2="70" y2="96" style="stroke:black;stroke-width:12px;stroke-linecap:round;"/>
|
||||
<line x1="35" y1="70" x2="70" y2="96" style="stroke:black;stroke-width:6px;"/>
|
||||
<line x1="65" y1="70" x2="30" y2="96" style="stroke:black;stroke-width:6px;"/>
|
||||
<line x1="30" y1="95" x2="70" y2="95" style="stroke:black;stroke-width:6px;"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
4
images/icons/castle.svg
Normal file
4
images/icons/castle.svg
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 105 105">
|
||||
<path d="M 43 85 25 85 25 45 20 40 20 20 35 20 35 30 45 30 45 20 60 20 60 30 70 30 70 20 85 20 85 40 80 45 80 85 62 85 62 65 A 9.5 9.5 0 0 0 43 65 z" style="stroke:white;stroke-width:12px;stroke-linecap:round;fill:none" />
|
||||
<path d="M 43 85 25 85 25 45 20 40 20 20 35 20 35 30 45 30 45 20 60 20 60 30 70 30 70 20 85 20 85 40 80 45 80 85 62 85 62 65 A 9.5 9.5 0 0 0 43 65 z" style="fill:black;" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 495 B |
51
images/icons/decommissioned-stands.svg
Normal file
51
images/icons/decommissioned-stands.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 12 KiB |
51
images/icons/fruit-tree.svg
Normal file
51
images/icons/fruit-tree.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 8.6 KiB |
51
images/icons/hook.svg
Normal file
51
images/icons/hook.svg
Normal file
|
|
@ -0,0 +1,51 @@
|
|||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
width="181.5726mm"
|
||||
height="354.91153mm"
|
||||
viewBox="0 0 181.5726 354.91153"
|
||||
version="1.1"
|
||||
id="svg2571"
|
||||
inkscape:version="1.1 (c4e8f9e, 2021-05-24)"
|
||||
sodipodi:docname="hook.svg"
|
||||
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">
|
||||
<sodipodi:namedview
|
||||
id="namedview2573"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:document-units="mm"
|
||||
showgrid="false"
|
||||
fit-margin-top="5"
|
||||
fit-margin-left="5"
|
||||
fit-margin-right="5"
|
||||
fit-margin-bottom="5"
|
||||
inkscape:zoom="0.53540264"
|
||||
inkscape:cx="-80.313388"
|
||||
inkscape:cy="842.3567"
|
||||
inkscape:window-width="1299"
|
||||
inkscape:window-height="822"
|
||||
inkscape:window-x="213"
|
||||
inkscape:window-y="38"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="layer1" />
|
||||
<defs
|
||||
id="defs2568" />
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(-104.1125,74.459786)">
|
||||
<path
|
||||
style="fill:#000000;stroke-width:0.192424"
|
||||
d="m 160.37959,275.08155 c -2.62863,-0.32085 -5.58266,-0.90782 -8.37045,-1.66322 -1.23846,-0.33559 -6.03369,-2.21069 -7.36829,-2.88125 -2.052,-1.03101 -6.56439,-4.02057 -8.15787,-5.40475 -4.63316,-4.02463 -9.69224,-9.90013 -12.37267,-14.36934 -1.71798,-2.86446 -2.6094,-4.75603 -5.03904,-10.69273 -3.16007,-7.72148 -4.07605,-10.34476 -5.54309,-15.875 -0.3369,-1.27 -0.77254,-2.87193 -0.96809,-3.55984 -0.69731,-2.45305 -1.70818,-6.86857 -2.10368,-9.18892 -0.22104,-1.29682 -0.57634,-3.07193 -0.78955,-3.94469 -1.08313,-4.43373 -0.5527,-9.8755 1.36057,-13.9583 4.48056,-9.56127 14.85924,-14.4294 25.10671,-11.77629 2.25055,0.58266 5.85195,2.41685 7.75359,3.94887 3.17757,2.55996 5.61078,6.01168 6.89289,9.7782 0.46314,1.36059 1.38383,5.46307 1.9068,8.49643 0.3608,2.09277 2.73721,11.09468 3.53046,13.37348 0.69443,1.99491 3.87616,9.84528 4.41289,10.888 0.49281,0.95743 2.32751,3.07373 3.20763,3.69994 0.57906,0.412 0.94273,0.49245 2.58321,0.57144 3.10298,0.14942 6.26816,-0.25802 15.44042,-1.98757 12.07769,-2.2774 18.53234,-3.73753 23.12639,-5.23152 3.92307,-1.27579 10.50586,-4.83733 13.80259,-7.46773 3.24827,-2.59176 9.19653,-9.11858 11.86867,-13.02314 2.20433,-3.22099 3.374,-5.78492 4.74035,-10.39087 1.21739,-4.10383 1.61496,-6.45498 2.14024,-12.65703 0.82294,-9.71673 -0.2561,-22.4389 -2.4273,-28.61828 -0.55967,-1.5929 -2.39422,-5.38431 -2.91355,-6.02141 -0.13091,-0.1606 -1.40699,-1.19825 -2.83574,-2.3059 -1.42875,-1.10765 -3.37704,-2.65884 -4.32954,-3.44709 -3.07063,-2.54109 -4.94406,-3.62577 -10.1978,-5.90426 -5.9069,-2.56181 -11.98376,-6.12148 -17.22266,-10.08867 -0.79375,-0.60108 -2.91523,-2.06756 -4.71439,-3.25888 -4.19455,-2.77739 -5.7393,-4.02236 -9.9099,-7.98676 -1.00545,-0.95573 -2.50351,-2.33221 -3.32902,-3.05884 -2.00698,-1.76655 -3.2453,-3.34366 -5.15727,-6.56825 -2.74576,-4.630781 -3.29887,-6.211642 -4.10677,-11.737874 l -0.47823,-3.271212 -0.0258,-22.224999 c -0.0233,-20.104687 0.006,-22.484638 0.31108,-24.946504 l 0.33688,-2.721504 -2.57882,-3.028373 c -1.41835,-1.665605 -2.88188,-3.394386 -3.2523,-3.841736 -0.37042,-0.44735 -1.54677,-1.847227 -2.61412,-3.110838 -5.646,-6.684199 -9.92476,-13.685534 -15.32808,-25.0813473 -2.73671,-5.771809 -4.21787,-9.37915 -5.09606,-12.411363 -0.36782,-1.27 -0.74417,-2.5688637 -0.83633,-2.8863637 -0.55262,-1.903801 -1.17598,-6.158374 -1.35328,-9.236363 -0.20841,-3.618265 -0.14589,-5.193125 0.32086,-8.081818 0.64304,-3.979736 0.81433,-4.668817 2.33669,-9.400163 0.54466,-1.692741 2.97145,-6.53759 4.15891,-8.302867 3.11426,-4.629649 9.45685,-11.015976 14.47758,-14.57742 3.0979,-2.19749 3.75708,-2.582987 7.10883,-4.15737 7.62352,-3.580913 18.45776,-5.423011 28.48981,-4.844001 2.79544,0.161342 4.67239,0.392039 8.07079,0.991995 0.635,0.112103 2.41012,0.550976 3.9447,0.975273 3.25256,0.899303 9.0379,3.43267 11.04813,4.837921 1.99061,1.391539 5.72166,4.430405 6.57119,5.352115 0.84315,0.914775 3.22806,4.05043 4.45632,5.859122 0.96612,1.422692 3.72991,6.933197 4.18919,8.352516 0.18836,0.582083 0.59642,1.703582 0.9068,2.492219 0.96762,2.458647 2.04152,7.447419 2.38377,11.07369 0.44202,4.683623 0.10385,11.827615 -0.77882,16.452272 -0.15149,0.79375 -0.33341,1.832841 -0.40428,2.309091 -0.36788,2.4725067 -2.50792,9.96408069 -3.76051,13.1643807 -2.46022,6.285713 -7.95663,15.6435383 -12.11014,20.6179323 -2.39411,2.867283 -5.80625,7.110682 -5.98245,7.439908 -0.0977,0.18264 -0.20642,1.784571 -0.24148,3.559849 -0.0541,2.742153 -0.13993,3.514998 -0.57026,5.13683 -0.2786,1.04998 -0.76081,2.452433 -1.0716,3.116563 l -0.56507,1.20751 0.17089,3.522073 c 0.094,1.937141 0.17388,10.893375 0.1775,19.902741 l 0.007,16.380668 1.20265,1.045389 c 0.66146,0.574964 2.37163,1.81736 3.80038,2.76088 1.42875,0.943521 3.59352,2.463274 4.8106,3.37723 3.88738,2.919183 6.02086,4.137639 11.38172,6.500237 7.5626,3.332921 12.3374,6.313981 19.52643,12.191001 1.07155,0.87599 3.11931,2.48194 4.55056,3.56878 5.9618,4.52713 10.11032,9.91649 14.4018,18.70954 1.97651,4.04975 3.20486,7.2868 4.38117,11.54546 1.26385,4.57552 2.27981,9.81304 2.79945,14.43182 0.59088,5.25175 0.6772,6.36006 0.90938,11.67588 0.2402,5.49958 0.0567,13.16766 -0.41887,17.50177 -0.10297,0.93855 -0.28292,2.61564 -0.3999,3.72689 -1.29321,12.28687 -5.14783,24.43101 -10.81058,34.05909 -4.82102,8.19693 -12.98508,17.76482 -21.69085,25.42065 -7.04221,6.1929 -19.38725,13.08662 -28.95985,16.17175 -7.53574,2.42869 -18.48356,4.85416 -35.40989,7.84501 -8.56027,1.51258 -16.33832,1.91348 -22.5098,1.16024 z M 190.95162,-8.9752233 c 0.79167,-1.4025187 1.6215,-2.9748717 1.84408,-3.4941147 0.55358,-1.291463 1.65385,-5.226575 2.0493,-7.329335 0.34212,-1.819214 0.47981,-6.29397 0.20224,-6.572912 -0.30241,-0.303911 -5.32259,-0.15444 -7.05477,0.210048 -2.08189,0.438075 -2.3242,0.569888 -4.1053,2.233236 -1.34337,1.254563 -1.475,1.44346 -1.475,2.116712 0,0.406574 0.22636,1.366763 0.50303,2.133758 0.99311,2.753108 6.09306,13.2526417 6.43723,13.2526417 0.0879,0 0.80753,-1.147516 1.59919,-2.550034 z"
|
||||
id="path4255" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 6.2 KiB |
4
images/icons/ladder.svg
Normal file
4
images/icons/ladder.svg
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 100 100">
|
||||
<path d="M 42 10 L 42 90 M 58 10 L 58 90 M 42 20 L 58 20 M 42 35 L 58 35 M 42 50 L 58 50 M 42 65 L 58 65 M 42 80 L 58 80" style="stroke:white;stroke-width:20px;stroke-linecap:round;" />
|
||||
<path d="M 42 10 L 42 90 M 58 10 L 58 90 M 42 20 L 58 20 M 42 35 L 58 35 M 42 50 L 58 50 M 42 65 L 58 65 M 42 80 L 58 80" style="stroke:black;stroke-width:8px;stroke-linecap:round;" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 470 B |
51
images/icons/outhouse.svg
Normal file
51
images/icons/outhouse.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 8.3 KiB |
51
images/icons/shack.svg
Normal file
51
images/icons/shack.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 7 KiB |
66
map.html
66
map.html
|
|
@ -136,12 +136,34 @@
|
|||
line-height: 18px;
|
||||
color: #555;
|
||||
}
|
||||
.legend i {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
float: left;
|
||||
margin-right: 8px;
|
||||
opacity: 0.7;
|
||||
.legend-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
.legend-item:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.legend-line {
|
||||
display: inline-block;
|
||||
width: 28px;
|
||||
height: 0;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.legend-line.road {
|
||||
border-top: 6px solid #8b5a2b;
|
||||
}
|
||||
.legend-line.trail {
|
||||
border-top: 3px solid #800000;
|
||||
}
|
||||
.legend-line.shooting_lane {
|
||||
border-top: 3px dashed #000000;
|
||||
}
|
||||
.legend-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
object-fit: contain;
|
||||
}
|
||||
/* END legend */
|
||||
</style>
|
||||
|
|
@ -363,7 +385,19 @@
|
|||
|
||||
for (let stand of data.stands) {
|
||||
if (stand.location) {
|
||||
const marker = L.marker(stand.location).addTo(map);
|
||||
const icon = L.icon({
|
||||
iconUrl: `images/icons/${stand.type}.svg`,
|
||||
iconSize: [16, 16],
|
||||
iconAnchor: [8, 16],
|
||||
popupAnchor: [0, -12],
|
||||
});
|
||||
const marker = L.marker(stand.location, {icon}).addTo(map);
|
||||
map.on('zoom', () => {
|
||||
icon.options.iconSize = [map.getZoom() * 8 - 104, map.getZoom() * 8 - 104];
|
||||
icon.options.iconAnchor = [icon.options.iconSize[0] / 2, icon.options.iconSize[1]];
|
||||
icon.options.popupAnchor = [0, -icon.options.iconSize[1] * 3 / 4];
|
||||
marker.setIcon(icon);
|
||||
});
|
||||
const popupContentWrapper = document.createElement('div');
|
||||
popupContentWrapper.classList.add('popup');
|
||||
let attributesString = '<dl>';
|
||||
|
|
@ -391,15 +425,15 @@
|
|||
legend.onAdd = function (map) {
|
||||
const div = L.DomUtil.create('div', 'legend');
|
||||
div.innerHTML = `
|
||||
<i class="road"></i> Road<br>
|
||||
<i class="trail"></i> Trail<br>
|
||||
<i class="shooting_lane"></i> Shooting lane<br>
|
||||
<i class="castle"></i> Castle stand<br>
|
||||
<i class="ladder"></i> Ladder stand<br>
|
||||
<i class="barrel"></i> Barrel stand<br>
|
||||
<i class="shack"></i> Shack<br>
|
||||
<i class="outhouse"></i> Outhouse<br>
|
||||
<i class="fruit tree"></i> Fruit tree
|
||||
<div class="legend-item"><span class="legend-line road"></span>Road</div>
|
||||
<div class="legend-item"><span class="legend-line trail"></span>Trail</div>
|
||||
<div class="legend-item"><span class="legend-line shooting_lane"></span>Shooting lane</div>
|
||||
<div class="legend-item"><img class="legend-icon" src="images/icons/castle.svg" alt="Castle icon">Castle stand</div>
|
||||
<div class="legend-item"><img class="legend-icon" src="images/icons/ladder.svg" alt="Ladder icon">Ladder stand</div>
|
||||
<div class="legend-item"><img class="legend-icon" src="images/icons/barrel.svg" alt="Barrel icon">Barrel stand</div>
|
||||
<div class="legend-item"><img class="legend-icon" src="images/icons/shack.svg" alt="Shack icon">Shack</div>
|
||||
<div class="legend-item"><img class="legend-icon" src="images/icons/outhouse.svg" alt="Outhouse icon">Outhouse</div>
|
||||
<div class="legend-item"><img class="legend-icon" src="images/icons/fruit-tree.svg" alt="Fruit tree icon">Fruit tree</div>
|
||||
`;
|
||||
return div;
|
||||
};
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue