map plugin : improve styles
This commit is contained in:
parent
2b0f4f8742
commit
b47195488a
3 changed files with 6 additions and 81 deletions
File diff suppressed because one or more lines are too long
|
|
@ -117,7 +117,7 @@ export default {
|
||||||
emit('select-location', {
|
emit('select-location', {
|
||||||
lat: result.lat,
|
lat: result.lat,
|
||||||
lon: result.lon,
|
lon: result.lon,
|
||||||
displayName: result.displayName
|
displayName: result.displayName,
|
||||||
});
|
});
|
||||||
searchQuery.value = result.displayName;
|
searchQuery.value = result.displayName;
|
||||||
showResults.value = false;
|
showResults.value = false;
|
||||||
|
|
@ -188,9 +188,9 @@ export default {
|
||||||
selectFirstResult,
|
selectFirstResult,
|
||||||
navigateResults,
|
navigateResults,
|
||||||
clearSearch,
|
clearSearch,
|
||||||
focus
|
focus,
|
||||||
};
|
};
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
@ -214,6 +214,7 @@ export default {
|
||||||
font-size: 0.875rem;
|
font-size: 0.875rem;
|
||||||
background: var(--color-white);
|
background: var(--color-white);
|
||||||
transition: border-color 0.2s;
|
transition: border-color 0.2s;
|
||||||
|
color: #000;
|
||||||
}
|
}
|
||||||
|
|
||||||
.search-input:focus {
|
.search-input:focus {
|
||||||
|
|
@ -329,11 +330,11 @@ export default {
|
||||||
|
|
||||||
.result-name {
|
.result-name {
|
||||||
font-size: 0.875rem;
|
font-size: 0.875rem;
|
||||||
color: var(--color-text);
|
|
||||||
margin-bottom: 0.25rem;
|
margin-bottom: 0.25rem;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
|
color: #000;
|
||||||
}
|
}
|
||||||
|
|
||||||
.result-coords {
|
.result-coords {
|
||||||
|
|
|
||||||
|
|
@ -1,76 +0,0 @@
|
||||||
/**
|
|
||||||
* Geocoding utility using Nominatim API
|
|
||||||
* https://nominatim.openstreetmap.org/
|
|
||||||
*
|
|
||||||
* Usage policy: https://operations.osmfoundation.org/policies/nominatim/
|
|
||||||
* Rate limit: 1 request per second
|
|
||||||
*/
|
|
||||||
|
|
||||||
const NOMINATIM_URL = 'https://nominatim.openstreetmap.org/search';
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Search for an address using Nominatim
|
|
||||||
* @param {string} query - Address to search for
|
|
||||||
* @returns {Promise<Array>} Array of results with lat, lon, display_name, etc.
|
|
||||||
*/
|
|
||||||
export async function geocode(query) {
|
|
||||||
if (!query || query.trim().length < 3) {
|
|
||||||
return [];
|
|
||||||
}
|
|
||||||
|
|
||||||
try {
|
|
||||||
const params = new URLSearchParams({
|
|
||||||
q: query.trim(),
|
|
||||||
format: 'json',
|
|
||||||
addressdetails: '1',
|
|
||||||
limit: '5',
|
|
||||||
// Respectful user agent as requested by Nominatim policy
|
|
||||||
'accept-language': 'fr'
|
|
||||||
});
|
|
||||||
|
|
||||||
const response = await fetch(`${NOMINATIM_URL}?${params.toString()}`, {
|
|
||||||
headers: {
|
|
||||||
'User-Agent': 'GeoProject/1.0 (Kirby CMS Map Editor)'
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
if (!response.ok) {
|
|
||||||
throw new Error(`Nominatim API error: ${response.status}`);
|
|
||||||
}
|
|
||||||
|
|
||||||
const data = await response.json();
|
|
||||||
|
|
||||||
// Transform results to a consistent format
|
|
||||||
return data.map(result => ({
|
|
||||||
id: result.place_id,
|
|
||||||
displayName: result.display_name,
|
|
||||||
lat: parseFloat(result.lat),
|
|
||||||
lon: parseFloat(result.lon),
|
|
||||||
type: result.type,
|
|
||||||
importance: result.importance,
|
|
||||||
boundingBox: result.boundingbox
|
|
||||||
}));
|
|
||||||
|
|
||||||
} catch (error) {
|
|
||||||
console.error('Geocoding error:', error);
|
|
||||||
throw error;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Debounce function to limit API calls
|
|
||||||
* @param {Function} func - Function to debounce
|
|
||||||
* @param {number} wait - Milliseconds to wait
|
|
||||||
* @returns {Function} Debounced function
|
|
||||||
*/
|
|
||||||
export function debounce(func, wait = 500) {
|
|
||||||
let timeout;
|
|
||||||
return function executedFunction(...args) {
|
|
||||||
const later = () => {
|
|
||||||
clearTimeout(timeout);
|
|
||||||
func(...args);
|
|
||||||
};
|
|
||||||
clearTimeout(timeout);
|
|
||||||
timeout = setTimeout(later, wait);
|
|
||||||
};
|
|
||||||
}
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue