add: paint deposit on click

dev
rrr-marble 4 years ago
parent cf50333b59
commit ea03af41d0

@ -57,7 +57,8 @@ export default {
map.value.addSource('samples', {
'type': 'vector',
"tiles": ["http://localhost:8080/martin/public.geodata/{z}/{x}/{y}.pbf"]
"tiles": ["http://localhost:8080/martin/public.geodata/{z}/{x}/{y}.pbf"],
'promoteId': 'fadr',
});
map.value.addLayer({
@ -68,7 +69,12 @@ export default {
'paint': {
'circle-stroke-width': 1,
'circle-stroke-color': '#FFFFFF',
'circle-color': '#1a9641',
'circle-color': [
'case',
['boolean', ['feature-state', 'beenClicked'], false],
'#ffff00',
'#1a9641'
],
'circle-opacity': 0.8,
'circle-radius': 16
}
@ -83,8 +89,6 @@ export default {
map.value.on('mouseover', 'samples-layer', (e) => {
// Change the cursor style as a UI indicator.
map.value.getCanvas().style.cursor = 'pointer';
});
map.value.on('mouseleave', 'samples-layer', (e) => {
@ -105,7 +109,33 @@ export default {
fadr = currentFadr["fadr"] == fadr["fadr"] ?
{ "fadr": "Any" } :
fadr;
// check if we need to remove any old paint
if (currentFadr["fadr"] !== "Any") {
map.value.setFeatureState(
{
source: 'samples',
sourceLayer: 'public.geodata',
id: currentFadr["fadr"]
},
{ beenClicked: false }
);
};
// check if we need to apply any new paint
if (fadr["fadr"] !== "Any") {
map.value.setFeatureState(
{
source: 'samples',
sourceLayer: 'public.geodata',
id: fadr["fadr"]
},
{ beenClicked: true }
);
};
currentFadr = fadr;
context.emit('mapClick', fadr);
});
});