diff --git a/app/contrib/frontend/maps/static/maps/js/maps.js b/app/contrib/frontend/maps/static/maps/js/maps.js
index 2d31a501..1e12976d 100644
--- a/app/contrib/frontend/maps/static/maps/js/maps.js
+++ b/app/contrib/frontend/maps/static/maps/js/maps.js
@@ -21,11 +21,9 @@ L.tileLayer("https://tile.openstreetmap.org/{z}/{x}/{y}.png", {
'© OpenStreetMap contributors',
}).addTo(map);
-// ------------------------------------------------------------
L.control.zoom({ position: "topright" }).addTo(map);
-// --------------------------------------------------------------
L.Control.Search = L.Control.extend({
options: {
position: "topleft",
@@ -38,7 +36,7 @@ L.Control.Search = L.Control.extend({
container.insertAdjacentHTML(
"beforeend",
`
-
+
`
);
@@ -48,11 +46,10 @@ L.Control.Search = L.Control.extend({
new L.Control.Search().addTo(map);
-// --------------------------------------------------------------
let startPoint, endPoint, polylineGeoJSON;
let geojsonarray = [];
-function addMarkers(coordinates) {
+function addMarkers(coordinates, properties) {
let LeafIcon = L.Icon.extend({
options: {
iconSize: [40, 40],
@@ -68,7 +65,7 @@ function addMarkers(coordinates) {
startPoint = L.marker([coordinates[0][1], coordinates[0][0]]);
endPoint = L.marker([coordinates[coordinates.length - 1][1], coordinates[coordinates.length - 1][0]]);
- // Adiciona marcadores nos pontos inicial e final
+ // Adiciona marcadores custom nos pontos inicial e final
if (mapWrapper.dataset.mapsIconsPointA) {
let startIcon = new LeafIcon({iconUrl: mapWrapper.dataset.mapsIconsPointA})
startPoint = L.marker([coordinates[0][1], coordinates[0][0]], {icon: startIcon});
@@ -78,18 +75,20 @@ function addMarkers(coordinates) {
endPoint = L.marker([coordinates[coordinates.length - 1][1], coordinates[coordinates.length - 1][0]], {icon: endIcon});
}
- // Adiciona marcadores ao mapa
- startPoint.addTo(map);
- endPoint.addTo(map);
+ [startPoint, endPoint].forEach(marker => {
+ marker.bindPopup(
+ `Número: ${properties.ln_codigo}
` +
+ `Nome: ${properties.title}
` +
+ `Empresa responsável: ${properties.ln_empresa}
`
+ ).addTo(map);
+ });
}
function addPolyline(coordinates, properties) {
const lineColor = mapWrapper.dataset.mapsLinecolor;
- // Remove linha existente
if (polylineGeoJSON) map.removeLayer(polylineGeoJSON);
- // Adiciona linha ao mapa
polylineGeoJSON = L.geoJSON({
type: "LineString",
coordinates: coordinates,
@@ -101,20 +100,20 @@ function addPolyline(coordinates, properties) {
fillOpacity: 0.5,
},
onEachFeature: function (feature, layer) {
- const linhaNum = properties.ln_codigo.toString();
- const linhaName = properties.title.toString();
- const linhaEmpresa = properties.ln_empresa.toString();
-
- layer.bindPopup(
- "Número:\n" + linhaNum + "
" +
- "Nome:\n" + linhaName + "
" +
- "Empresa responsável:\n" + linhaEmpresa + "
"
- );
+ layer.bindPopup(
+ `Número: ${properties.ln_codigo}
` +
+ `Nome: ${properties.title}
` +
+ `Empresa responsável: ${properties.ln_empresa}
`
+ );
},
}).addTo(map);
}
-new Autocomplete("local", {
+new Autocomplete("show-all-values", {
+ clearButton: true,
+ cache: true,
+ showAllValues: true,
+
onSearch: ({ currentValue }) => {
const api = mapWrapper.dataset.mapsGeojson;
return new Promise((resolve) => {
@@ -132,33 +131,18 @@ new Autocomplete("local", {
});
resolve(result);
})
- .catch((error) => {
- console.error(error);
- });
+ .catch((error) => console.error(error));
});
},
- onResults: ({ matches, template }) => {
- return matches === 0
- ? template
- : matches
- .map((el) => {
- return `
-
- ${el.properties.title}
- `;
- })
- .join("");
- },
+ onResults: ({ matches, template }) =>
+ matches === 0 ? template : matches.map((el) => `${el.properties.title}
`).join(""),
onSubmit: ({ object }) => {
const coordinates = object.geometry.coordinates;
const properties = object.properties;
- // Adiciona marcadores nos pontos inicial e final
- addMarkers(coordinates);
-
- // Adiciona linha ao mapa
+ addMarkers(coordinates, properties);
addPolyline(coordinates, properties);
map.fitBounds(polylineGeoJSON.getBounds(), { padding: [150, 150] });
@@ -167,14 +151,13 @@ new Autocomplete("local", {
geojsonarray.push(object.properties.id);
},
- noResults: ({ currentValue, template }) =>
- template(`Sem resultados: "${currentValue}"`),
+ noResults: ({ currentValue, template }) => template(`Sem resultados: "${currentValue}"`),
onReset: () => {
// Remove marcadores e linha
- if (startPoint) map.removeLayer(startPoint);
- if (endPoint) map.removeLayer(endPoint);
- if (polylineGeoJSON) map.removeLayer(polylineGeoJSON);
+ [startPoint, endPoint, polylineGeoJSON].forEach(layer => {
+ if (layer) map.removeLayer(layer);
+ });
geojsonarray = [];
},