feat: add dead tree symbology, icon, and map layer support for nature assets

This commit is contained in:
kdeterme 2026-10-09 14:31:17 +02:00
parent e65c402395
commit 095161872d
8 changed files with 88 additions and 24 deletions

View file

@ -264,21 +264,30 @@
naturetree_regional: { naturetree_regional: {
thematic: 'nature', thematic: 'nature',
color: '#1d4ed8', color: '#1d4ed8',
iconUrl: '/static/assets/nature_tree_icon_regional.svg?v=20261009a', iconUrl: '/static/assets/nature_tree_icon_regional.svg?v=20261009_round',
iconSize: 56, iconSize: 56,
iconClass: 'bi-tree-fill', iconClass: 'bi-tree',
glyphCodepoint: 'f5e1', glyphCodepoint: 'f5e1',
mapImage: 'icon-nature-regional', mapImage: 'icon-nature-regional',
}, },
naturetree_remarkable: { naturetree_remarkable: {
thematic: 'nature', thematic: 'nature',
color: '#d97706', color: '#d97706',
iconUrl: '/static/assets/nature_tree_icon_remarkable.svg?v=20261009a', iconUrl: '/static/assets/nature_tree_icon_remarkable.svg?v=20261009_round',
iconSize: 56, iconSize: 56,
iconClass: 'bi-tree-fill', iconClass: 'bi-tree',
glyphCodepoint: 'f5e1', glyphCodepoint: 'f5e1',
mapImage: 'icon-nature-remarkable', mapImage: 'icon-nature-remarkable',
}, },
naturetree_dead: {
thematic: 'nature',
color: '#6b7280',
iconUrl: '/static/assets/nature_tree_icon_dead.svg?v=20261009_round',
iconSize: 56,
iconClass: 'bi-tree',
glyphCodepoint: 'f5e1',
mapImage: 'icon-nature-dead',
},
naturetree: { naturetree: {
thematic: 'nature', thematic: 'nature',
color: '#2e7d32', color: '#2e7d32',
@ -597,7 +606,12 @@
// 3. Specific asset_type override // 3. Specific asset_type override
if (assetType === 'naturetree' || (thematic === 'nature' && (assetType === 'naturetree' || !assetType))) { if (assetType === 'naturetree' || (thematic === 'nature' && (assetType === 'naturetree' || !assetType))) {
const isRemarkable = item.is_remarkable === true || item.is_remarkable === 'true'; const isDead = item.is_dead === true || item.is_dead === 'true' || item.is_dead === 1 ||
item.vitality === 'dead' || item.status === 'dead' || item.status === 'archived';
if (isDead && ASSET_TYPE_OVERRIDES.naturetree_dead) {
return Object.assign({}, ASSET_TYPE_OVERRIDES.naturetree_dead);
}
const isRemarkable = item.is_remarkable === true || item.is_remarkable === 'true' || item.is_remarkable === 1;
const isRegional = item.management_type === 'regional' || const isRegional = item.management_type === 'regional' ||
(typeof item.managing_authority === 'string' && (item.managing_authority.toLowerCase().includes('région') || item.managing_authority.toLowerCase().includes('mobilité'))); (typeof item.managing_authority === 'string' && (item.managing_authority.toLowerCase().includes('région') || item.managing_authority.toLowerCase().includes('mobilité')));
if (isRemarkable && ASSET_TYPE_OVERRIDES.naturetree_remarkable) { if (isRemarkable && ASSET_TYPE_OVERRIDES.naturetree_remarkable) {
@ -692,6 +706,7 @@
nature: injected.nature || THEMATIC_CONFIG.nature.iconUrl, nature: injected.nature || THEMATIC_CONFIG.nature.iconUrl,
natureregional: injected.natureregional || (ASSET_TYPE_OVERRIDES.naturetree_regional && ASSET_TYPE_OVERRIDES.naturetree_regional.iconUrl), natureregional: injected.natureregional || (ASSET_TYPE_OVERRIDES.naturetree_regional && ASSET_TYPE_OVERRIDES.naturetree_regional.iconUrl),
natureremarkable: injected.natureremarkable || (ASSET_TYPE_OVERRIDES.naturetree_remarkable && ASSET_TYPE_OVERRIDES.naturetree_remarkable.iconUrl), natureremarkable: injected.natureremarkable || (ASSET_TYPE_OVERRIDES.naturetree_remarkable && ASSET_TYPE_OVERRIDES.naturetree_remarkable.iconUrl),
naturedead: injected.naturedead || (ASSET_TYPE_OVERRIDES.naturetree_dead && ASSET_TYPE_OVERRIDES.naturetree_dead.iconUrl),
structures: injected.structures || THEMATIC_CONFIG.structures.iconUrl, structures: injected.structures || THEMATIC_CONFIG.structures.iconUrl,
roaddrain: injected.roaddrain || ASSET_TYPE_OVERRIDES.roaddrain.iconUrl, roaddrain: injected.roaddrain || ASSET_TYPE_OVERRIDES.roaddrain.iconUrl,
roadconcreteblockset: injected.roadconcreteblockset || ASSET_TYPE_OVERRIDES.roadconcreteblockset.iconUrl, roadconcreteblockset: injected.roadconcreteblockset || ASSET_TYPE_OVERRIDES.roadconcreteblockset.iconUrl,
@ -717,8 +732,6 @@
{ name: 'icon-trafficlightradarpole', codepoint: 'f4e0', color: '#e53935' }, { name: 'icon-trafficlightradarpole', codepoint: 'f4e0', color: '#e53935' },
{ name: 'icon-sign', codepoint: 'f82b', color: '#0022ff' }, { name: 'icon-sign', codepoint: 'f82b', color: '#0022ff' },
{ name: 'icon-nature', codepoint: 'f5e1', color: '#2e7d32' }, { name: 'icon-nature', codepoint: 'f5e1', color: '#2e7d32' },
{ name: 'icon-nature-regional', codepoint: 'f5e1', color: '#1d4ed8' },
{ name: 'icon-nature-remarkable', codepoint: 'f5e1', color: '#d97706' },
{ name: 'icon-naturebench', codepoint: 'f5e1', color: '#2e7d32' }, { name: 'icon-naturebench', codepoint: 'f5e1', color: '#2e7d32' },
{ name: 'icon-natureplanter', codepoint: 'f3ce', color: '#d97706' }, { name: 'icon-natureplanter', codepoint: 'f3ce', color: '#d97706' },
{ name: 'icon-naturerwiasset', codepoint: 'f30b', color: '#0277bd' }, { name: 'icon-naturerwiasset', codepoint: 'f30b', color: '#0277bd' },
@ -814,6 +827,17 @@
['==', ['slice', ['get', 'code'], 0, 7], 'CSE-BAC'], ['==', ['slice', ['get', 'code'], 0, 7], 'CSE-BAC'],
], 'icon-natureplanter', ], 'icon-natureplanter',
['==', ['get', 'asset_type'], 'naturebench'], 'icon-naturebench', ['==', ['get', 'asset_type'], 'naturebench'], 'icon-naturebench',
['all',
['any', ['==', ['get', 'asset_type'], 'naturetree'], ['==', ['get', 'thematic'], 'nature']],
['any',
['==', ['get', 'is_dead'], true],
['==', ['get', 'is_dead'], 'true'],
['==', ['get', 'is_dead'], 1],
['==', ['get', 'status'], 'dead'],
['==', ['get', 'status'], 'archived'],
['==', ['get', 'vitality'], 'dead']
]
], 'icon-nature-dead',
['all', ['all',
['any', ['==', ['get', 'asset_type'], 'naturetree'], ['==', ['get', 'thematic'], 'nature']], ['any', ['==', ['get', 'asset_type'], 'naturetree'], ['==', ['get', 'thematic'], 'nature']],
['any', ['==', ['get', 'is_remarkable'], true], ['==', ['get', 'is_remarkable'], 'true'], ['==', ['get', 'is_remarkable'], 1]] ['any', ['==', ['get', 'is_remarkable'], true], ['==', ['get', 'is_remarkable'], 'true'], ['==', ['get', 'is_remarkable'], 1]]

View file

@ -0,0 +1,20 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="64" height="64" aria-hidden="true">
<defs>
<linearGradient id="foliage-dead" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#9ca3af"/>
<stop offset="100%" stop-color="#4b5563"/>
</linearGradient>
<linearGradient id="trunk-dead" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#78716c"/>
<stop offset="100%" stop-color="#57534e"/>
</linearGradient>
</defs>
<ellipse cx="24" cy="24" rx="12" ry="10" fill="url(#foliage-dead)"/>
<ellipse cx="40" cy="24" rx="12" ry="10" fill="url(#foliage-dead)"/>
<ellipse cx="32" cy="18" rx="13" ry="11" fill="url(#foliage-dead)"/>
<ellipse cx="32" cy="29" rx="15" ry="10" fill="url(#foliage-dead)"/>
<rect x="28" y="30" width="8" height="24" rx="2" fill="url(#trunk-dead)"/>
<rect x="25" y="54" width="14" height="5" rx="2" fill="#44403c"/>
</svg>

After

Width:  |  Height:  |  Size: 928 B

View file

@ -4,9 +4,9 @@
<stop offset="0%" stop-color="#60a5fa"/> <stop offset="0%" stop-color="#60a5fa"/>
<stop offset="100%" stop-color="#1d4ed8"/> <stop offset="100%" stop-color="#1d4ed8"/>
</linearGradient> </linearGradient>
<linearGradient id="trunk-reg" x1="0" y1="0" x2="0" y2="1"> <linearGradient id="trunk" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#64748b"/> <stop offset="0%" stop-color="#8d6e63"/>
<stop offset="100%" stop-color="#334155"/> <stop offset="100%" stop-color="#5d4037"/>
</linearGradient> </linearGradient>
</defs> </defs>
@ -15,6 +15,6 @@
<ellipse cx="32" cy="18" rx="13" ry="11" fill="url(#foliage-reg)"/> <ellipse cx="32" cy="18" rx="13" ry="11" fill="url(#foliage-reg)"/>
<ellipse cx="32" cy="29" rx="15" ry="10" fill="url(#foliage-reg)"/> <ellipse cx="32" cy="29" rx="15" ry="10" fill="url(#foliage-reg)"/>
<rect x="28" y="30" width="8" height="24" rx="2" fill="url(#trunk-reg)"/> <rect x="28" y="30" width="8" height="24" rx="2" fill="url(#trunk)"/>
<rect x="25" y="54" width="14" height="5" rx="2" fill="#1e293b"/> <rect x="25" y="54" width="14" height="5" rx="2" fill="#4e342e"/>
</svg> </svg>

Before

Width:  |  Height:  |  Size: 921 B

After

Width:  |  Height:  |  Size: 913 B

View file

@ -4,7 +4,7 @@
<stop offset="0%" stop-color="#fbbf24"/> <stop offset="0%" stop-color="#fbbf24"/>
<stop offset="100%" stop-color="#d97706"/> <stop offset="100%" stop-color="#d97706"/>
</linearGradient> </linearGradient>
<linearGradient id="trunk-rem" x1="0" y1="0" x2="0" y2="1"> <linearGradient id="trunk" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#8d6e63"/> <stop offset="0%" stop-color="#8d6e63"/>
<stop offset="100%" stop-color="#5d4037"/> <stop offset="100%" stop-color="#5d4037"/>
</linearGradient> </linearGradient>
@ -15,6 +15,6 @@
<ellipse cx="32" cy="18" rx="13" ry="11" fill="url(#foliage-rem)"/> <ellipse cx="32" cy="18" rx="13" ry="11" fill="url(#foliage-rem)"/>
<ellipse cx="32" cy="29" rx="15" ry="10" fill="url(#foliage-rem)"/> <ellipse cx="32" cy="29" rx="15" ry="10" fill="url(#foliage-rem)"/>
<rect x="28" y="30" width="8" height="24" rx="2" fill="url(#trunk-rem)"/> <rect x="28" y="30" width="8" height="24" rx="2" fill="url(#trunk)"/>
<rect x="25" y="54" width="14" height="5" rx="2" fill="#4e342e"/> <rect x="25" y="54" width="14" height="5" rx="2" fill="#4e342e"/>
</svg> </svg>

Before

Width:  |  Height:  |  Size: 921 B

After

Width:  |  Height:  |  Size: 913 B

View file

@ -824,6 +824,12 @@ $(document).ready(function () {
$('#unified-table').bootstrapTable({ $('#unified-table').bootstrapTable({
columns: buildColumns(), columns: buildColumns(),
rowStyle: function (row) {
if (row && (row.is_dead || row.vitality === 'dead' || row.status === 'dead' || row.status === 'archived')) {
return { classes: 'text-muted opacity-75' };
}
return {};
},
height: calcHeight(), height: calcHeight(),
search: false, search: false,
pagination: true, pagination: true,
@ -2754,6 +2760,8 @@ function loadTableData(features) {
is_remarkable: p.is_remarkable || false, is_remarkable: p.is_remarkable || false,
scientific_name: p.scientific_name || '', scientific_name: p.scientific_name || '',
vernacular_name: p.vernacular_name || '', vernacular_name: p.vernacular_name || '',
is_dead: p.is_dead || false,
vitality: p.vitality || '',
lon: p.lon, lon: p.lon,
lat: p.lat, lat: p.lat,
length: Number.isFinite(length) ? length : 0, length: Number.isFinite(length) ? length : 0,

View file

@ -153,6 +153,11 @@ function loadUnifiedMapIcons(map) {
.then(data => { if (!map.hasImage('icon-nature-remarkable')) map.addImage('icon-nature-remarkable', data); }) .then(data => { if (!map.hasImage('icon-nature-remarkable')) map.addImage('icon-nature-remarkable', data); })
.catch(e => console.warn('unified_map_layers: could not load nature remarkable icon', e)); .catch(e => console.warn('unified_map_layers: could not load nature remarkable icon', e));
} }
if (iconUrls.naturedead && !map.hasImage('icon-nature-dead')) {
loadNormalisedIcon(iconUrls.naturedead, 56)
.then(data => { if (!map.hasImage('icon-nature-dead')) map.addImage('icon-nature-dead', data); })
.catch(e => console.warn('unified_map_layers: could not load nature dead icon', e));
}
// structures: dedicated bridge/tunnel SVG (52 px) // structures: dedicated bridge/tunnel SVG (52 px)
if (iconUrls.structures && !map.hasImage('icon-structures')) { if (iconUrls.structures && !map.hasImage('icon-structures')) {
@ -224,7 +229,12 @@ function loadUnifiedMapIcons(map) {
// ── Bootstrap Icons glyph SDF icons (recoloured by icon-color) ────────── // ── Bootstrap Icons glyph SDF icons (recoloured by icon-color) ──────────
// codepoints and colors derived from AssetSymbology (single source of truth) // codepoints and colors derived from AssetSymbology (single source of truth)
const FILE_ICON_NAMES = new Set(Object.keys(iconUrls).map(k => 'icon-' + k)); const FILE_ICON_NAMES = new Set([
...Object.keys(iconUrls).map(k => 'icon-' + k),
'icon-nature-regional',
'icon-nature-remarkable',
'icon-nature-dead',
]);
const GLYPH_ICONS = (typeof AssetSymbology !== 'undefined') const GLYPH_ICONS = (typeof AssetSymbology !== 'undefined')
? AssetSymbology.getGlyphIcons() ? AssetSymbology.getGlyphIcons()
@ -234,8 +244,6 @@ function loadUnifiedMapIcons(map) {
{ name: 'icon-trafficlightsequipment', codepoint: 'f1d5', color: '#331110' }, { name: 'icon-trafficlightsequipment', codepoint: 'f1d5', color: '#331110' },
{ name: 'icon-sign', codepoint: 'f82b', color: '#0022ff' }, { name: 'icon-sign', codepoint: 'f82b', color: '#0022ff' },
{ name: 'icon-nature', codepoint: 'f5e1', color: '#2e7d32' }, { name: 'icon-nature', codepoint: 'f5e1', color: '#2e7d32' },
{ name: 'icon-nature-regional', codepoint: 'f5e1', color: '#1d4ed8' },
{ name: 'icon-nature-remarkable', codepoint: 'f5e1', color: '#d97706' },
{ name: 'icon-structures', codepoint: 'f876', color: '#6d4c41' }, { name: 'icon-structures', codepoint: 'f876', color: '#6d4c41' },
{ name: 'icon-its', codepoint: 'f1d5', color: '#0288d1' }, { name: 'icon-its', codepoint: 'f1d5', color: '#0288d1' },
{ name: 'icon-clean', codepoint: 'f78a', color: '#5e5e5e' }, { name: 'icon-clean', codepoint: 'f78a', color: '#5e5e5e' },

View file

@ -1353,9 +1353,10 @@
trafficlightelectricalcabinet: "{% static 'assets/electrical-panel.png' %}", trafficlightelectricalcabinet: "{% static 'assets/electrical-panel.png' %}",
publiclighting: "{% static 'assets/public_lamp_post_icon.svg' %}?v=20260521c", publiclighting: "{% static 'assets/public_lamp_post_icon.svg' %}?v=20260521c",
publiclightingelectricalcabinet: "{% static 'assets/electrical-panel.png' %}", publiclightingelectricalcabinet: "{% static 'assets/electrical-panel.png' %}",
nature: "{% static 'assets/nature_tree_icon.svg' %}?v=20260521a", nature: "{% static 'assets/nature_tree_icon.svg' %}?v=20261009_round",
natureregional: "{% static 'assets/nature_tree_icon_regional.svg' %}?v=20261009a", natureregional: "{% static 'assets/nature_tree_icon_regional.svg' %}?v=20261009_round",
natureremarkable: "{% static 'assets/nature_tree_icon_remarkable.svg' %}?v=20261009a", natureremarkable: "{% static 'assets/nature_tree_icon_remarkable.svg' %}?v=20261009_round",
naturedead: "{% static 'assets/nature_tree_icon_dead.svg' %}?v=20261009_round",
structures: "{% static 'assets/structures_bridge_tunnel_icon.svg' %}?v=20260522b", structures: "{% static 'assets/structures_bridge_tunnel_icon.svg' %}?v=20260522b",
roaddrain: "{% static 'assets/roaddrain_grille_icon.svg' %}?v=20260521a", roaddrain: "{% static 'assets/roaddrain_grille_icon.svg' %}?v=20260521a",
speedbump: "{% static 'assets/road_speedbump_icon.svg' %}?v=20260920", speedbump: "{% static 'assets/road_speedbump_icon.svg' %}?v=20260920",
@ -1372,7 +1373,7 @@
<script src="{% static 'common/base_script.js' %}"></script> <script src="{% static 'common/base_script.js' %}"></script>
<script src="{% static 'common/base_map.js' %}"></script> <script src="{% static 'common/base_map.js' %}"></script>
<script src="{% static 'assets/sign_panels_shared.js' %}?v=20260703c"></script> <script src="{% static 'assets/sign_panels_shared.js' %}?v=20260703c"></script>
<script src="{% static 'assets/asset_symbology.js' %}?v=20261009_tree_icons"></script> <script src="{% static 'assets/asset_symbology.js' %}?v=20261009_round_trees_v2"></script>
<script src="{% static 'assets/unified_map_layers.js' %}?v=20261009_tree_icons"></script> <script src="{% static 'assets/unified_map_layers.js' %}?v=20261009_round_trees_v2"></script>
<script src="{% static 'assets/unified_index.js' %}?v=20261009_basemap"></script> <script src="{% static 'assets/unified_index.js' %}?v=20261009_round_trees_v2"></script>
{% endblock script %} {% endblock script %}

View file

@ -721,6 +721,8 @@ def nature_assets_geojson(request):
"is_remarkable": obj.get('is_remarkable', False), "is_remarkable": obj.get('is_remarkable', False),
"scientific_name": obj.get('scientific_name') or '', "scientific_name": obj.get('scientific_name') or '',
"vernacular_name": obj.get('vernacular_name') or '', "vernacular_name": obj.get('vernacular_name') or '',
"is_dead": bool(obj.get('is_dead') or obj.get('vitality') == 'dead' or obj.get('status') in ('dead', 'archived')),
"vitality": obj.get('vitality') or '',
} }
} }
@ -916,7 +918,8 @@ def nature_assets_geojson(request):
'category_name', 'model_name', 'color', 'geojson', 'category_name', 'model_name', 'color', 'geojson',
'category_id', 'model_id', 'location_lon', 'location_lat', 'category_id', 'model_id', 'location_lon', 'location_lat',
'managing_authority', 'management_type', 'is_remarkable', 'managing_authority', 'management_type', 'is_remarkable',
'scientific_name', 'vernacular_name' 'scientific_name', 'vernacular_name',
'is_dead', 'vitality'
) )
.order_by('code') .order_by('code')
)[:MAX_ASSET_FEATURES + 1] )[:MAX_ASSET_FEATURES + 1]