From 84f71b6c20948026c281aa51585b8cfe5d6544d1 Mon Sep 17 00:00:00 2001 From: ftoromanoff Date: Wed, 7 Jun 2023 16:25:29 +0200 Subject: [PATCH] refactor(FeatureToolTip): update with new gestion of Style --- examples/css/example.css | 2 +- examples/js/plugins/FeatureToolTip.js | 36 ++++++++++++--------------- 2 files changed, 17 insertions(+), 21 deletions(-) diff --git a/examples/css/example.css b/examples/css/example.css index 4bdc1c8553..384c6af523 100644 --- a/examples/css/example.css +++ b/examples/css/example.css @@ -253,7 +253,7 @@ h3 { .tooltip { display: none; - background-image: linear-gradient(rgba(80, 80, 80,0.95), rgba(60, 60, 60,0.95)); + background-image: linear-gradient(rgba(167, 164, 164, 0.95), rgba(60, 60, 60,0.95)); box-shadow: -1px 2px 5px 1px rgba(0, 0, 0, 0.5); margin-top: 20px; margin-left: 20px; diff --git a/examples/js/plugins/FeatureToolTip.js b/examples/js/plugins/FeatureToolTip.js index 0dc0fcad2b..f19446ebca 100644 --- a/examples/js/plugins/FeatureToolTip.js +++ b/examples/js/plugins/FeatureToolTip.js @@ -64,42 +64,38 @@ const FeatureToolTip = (function _() { } } - function getGeometryProperties(geometry) { - return function properties() { return geometry.properties; }; - } - function fillToolTip(features, layer, options) { let content = ''; let feature; let geometry; - let style; + const style = layer.style; let fill; let stroke; let symb = ''; let prop; + const context = style.context; + for (let p = 0; p < features.length; p++) { feature = features[p]; geometry = feature.geometry; - style = (geometry.properties && geometry.properties.style) || feature.style || layer.style; - const context = { globals: {}, properties: getGeometryProperties(geometry) }; - style = style.applyContext(context); + + context.setFeature(feature); + context.setGeometry(geometry); if (feature.type === itowns.FEATURE_TYPES.POLYGON) { symb = '◼'; - if (style) { - fill = style.fill && style.fill.color; - stroke = style.stroke && ('1.25px ' + style.stroke.color); - } + fill = style.fill && style.fill.color; + stroke = style.stroke && ('1.25px ' + style.stroke.color); } else if (feature.type === itowns.FEATURE_TYPES.LINE) { symb = '━'; - fill = style && style.stroke && style.stroke.color; + fill = style.stroke && style.stroke.color; stroke = '0px'; } else if (feature.type === itowns.FEATURE_TYPES.POINT) { symb = '●'; - if (style && style.point) { // Style and style.point can be undefined if no style options were passed - fill = style.point.color; - stroke = '1.25px ' + style.point.line; + if (style.point || style.icon) { // Style and style.point can be undefined if no style options were passed + fill = (style.point && style.point.color) || (style.icon && style.icon.color); + stroke = '1.25px ' + ((style.point && style.point.line) || 'black'); } } @@ -109,10 +105,10 @@ const FeatureToolTip = (function _() { content += ''; if (geometry.properties) { - content += (geometry.properties.description || geometry.properties.name || geometry.properties.nom || layer.name || ''); + content += (geometry.properties.description || geometry.properties.name || geometry.properties.nom || geometry.properties.title || layer.name || ''); } - if (feature.type === itowns.FEATURE_TYPES.POINT) { + if (feature.type === itowns.FEATURE_TYPES.POINT && options.writeLatLong) { content += '
long ' + feature.coordinates[0].toFixed(4) + ''; content += '
lat ' + feature.coordinates[1].toFixed(4) + ''; } @@ -231,8 +227,8 @@ const FeatureToolTip = (function _() { } const opts = options || { filterAllProperties: true }; - opts.filterProperties = opts.filterProperties == undefined ? [] : opts.filterProperties; - opts.filterProperties.concat(['name', 'nom', 'style', 'description']); + opts.filterProperties = opts.filterProperties === undefined ? [] : opts.filterProperties; + opts.writeLatLong = opts.writeLatLong || false; layers.push({ layer: layer, options: opts }); layersId.push(layer.id);