Compare commits

..
2 Commits
Author SHA1 Message Date
livio 56211e4b25 Fix parcel coordinates and map controls 2026-09-11 18:46:56 +02:00
livio 8997f1b728 Add stable cascading cadastral search and fullscreen map UI 2026-09-11 09:45:47 +02:00
11 changed files with 8953 additions and 381 deletions

No files matched your search

+382 -92
View File
@@ -1,104 +1,145 @@
@page "/" @page "/"
@inject IJSRuntime JS @inject IJSRuntime JS
@inject PreciseLocationService LocationService @inject PreciseLocationService LocationService
@inject CadastralCatalogService CatalogService
@implements IAsyncDisposable @implements IAsyncDisposable
<PageTitle>LME Mappe Catastali</PageTitle> <PageTitle>LME Mappe Catastali</PageTitle>
<div class="map-app"> <div class="map-app">
<aside class="tool-panel"> <section class="map-stage">
<section class="brand"> <div id="map"></div>
<header class="map-toolbar">
<div class="app-identity">
<strong>LME Catasto</strong>
<span>@Status</span>
</div>
<button class="toolbar-button" @onclick='() => SelectTab(ActiveTab == "search" ? "map" : "search")'>Cerca</button>
</header>
<div class="map-search @(ActiveTab == "search" ? "is-open" : null)">
<input @bind="SearchText" @bind:event="oninput" placeholder="Localita, indirizzo o coordinate" />
<button @onclick="SearchLocation">Vai</button>
</div>
<div class="gps-overlay @(ActiveTab == "search" ? "search-open" : null)">
<div class="gps-state">
<span id="gpsState">GPS non attivo</span>
<strong id="parcelState">Nessuna particella selezionata</strong>
</div>
<button class="gps-main" @onclick="ToggleGps">@(GpsActive ? "Ferma GPS" : "Avvia GPS")</button>
<button class="gps-center" @onclick="CenterOnGps" aria-label="Centra posizione">Centra</button>
</div>
@if (ActiveTab is not "map" and not "search")
{
<aside class="tool-sheet">
<div class="sheet-header">
<div> <div>
<p class="eyebrow">Catasto, rilievi e progetti</p> <p class="eyebrow">@PanelEyebrow</p>
<h1>LME Mappe Catastali</h1> <h1>@PanelTitle</h1>
</div> </div>
<span class="status">@Status</span> <button class="close-button" @onclick='() => SelectTab("map")' aria-label="Chiudi pannello">×</button>
</section>
<section class="panel-section">
<h2>Ricerca libera</h2>
<div class="input-row">
<input @bind="SearchText" @bind:event="oninput" placeholder="Indirizzo, localita, coordinate..." />
<button @onclick="SearchLocation">Cerca</button>
</div> </div>
</section>
<section class="panel-section"> @if (ActiveTab == "cadastre")
<h2>Particella catastale</h2> {
<div class="field-grid"> <section class="panel-content">
<label> <label>
Regione Regione
<input @bind="CadastralRegion" placeholder="Lombardia" /> <select value="@SelectedRegionFile" @onchange="OnRegionChanged">
<option value="">Seleziona regione</option>
@foreach (var region in Regions)
{
<option value="@region.DataFile">@region.Name</option>
}
</select>
</label> </label>
<label> <label>
Comune Comune
<input @bind="CadastralMunicipality" placeholder="Milano" /> <select value="@SelectedMunicipalityCode" @onchange="OnMunicipalityChanged" disabled="@(Municipalities.Count == 0)">
</label> <option value="">Seleziona comune</option>
<label> @foreach (var municipality in Municipalities)
Codice catastale {
<input @bind="CadastralMunicipalityCode" placeholder="F205" /> <option value="@municipality.Code">@municipality.Name (@municipality.Code)</option>
}
</select>
</label> </label>
<label> <label>
Foglio Foglio
<input @bind="CadastralSheet" placeholder="12" /> <select value="@SelectedSheet" @onchange="OnSheetChanged" disabled="@(Sheets.Count == 0 || CatalogBusy)">
<option value="">Seleziona foglio</option>
@foreach (var sheet in Sheets)
{
<option value="@sheet">@DisplaySheet(sheet)</option>
}
</select>
</label> </label>
<label> <label>
Particella Particella
<input @bind="CadastralParcel" placeholder="345" /> <select value="@SelectedParcelNumber" @onchange="OnParcelChanged" disabled="@(Parcels.Count == 0 || CatalogBusy)">
<option value="">Seleziona particella</option>
@foreach (var parcel in Parcels)
{
<option value="@parcel.Number">@parcel.Number</option>
}
</select>
</label> </label>
</div>
<div class="button-row">
<button @onclick="LocateParcel">Vai alla zona</button>
<button @onclick="ExportCadastralImage">Scarica vista</button>
</div>
<p class="hint">Il layer ufficiale WMS dell'Agenzia delle Entrate e' attivo; la selezione geometrica precisa della particella sara' collegata al servizio WFS/API.</p>
</section>
<section class="panel-section"> @if (!string.IsNullOrWhiteSpace(CatalogMessage))
{
<div class="catalog-progress">
<span>@CatalogMessage</span>
@if (CatalogFraction.HasValue)
{
<progress value="@CatalogFraction.Value" max="1"></progress>
}
</div>
}
<button class="primary-command" @onclick="LocateParcel" disabled="@(SelectedParcel is null || CatalogBusy)">Mostra particella sulla mappa</button>
<div class="service-note">
<strong>Mappa pubblica ufficiale</strong>
<p>I confini visualizzati arrivano dai servizi WMS/WFS open data dell'Agenzia delle Entrate e non richiedono CAPTCHA.</p>
</div>
</section>
}
else if (ActiveTab == "projects")
{
<section class="panel-content">
<h2>File GIS</h2> <h2>File GIS</h2>
<label class="file-picker"> <label class="file-picker">
<span>Carica KML, KMZ o GeoJSON</span> <span>Carica KML, KMZ o GeoJSON</span>
<input id="gisFileInput" type="file" accept=".kml,.kmz,.geojson,.json,application/vnd.google-earth.kml+xml,application/vnd.google-earth.kmz,application/geo+json" /> <input id="gisFileInput" type="file" accept=".kml,.kmz,.geojson,.json,application/vnd.google-earth.kml+xml,application/vnd.google-earth.kmz,application/geo+json" />
</label> </label>
<div class="button-row"> <div class="button-row">
<button @onclick="FitImportedLayers">Inquadra file</button> <button @onclick="FitImportedLayers">Inquadra</button>
<button @onclick="ClearImportedLayers">Pulisci file</button> <button class="secondary-command" @onclick="ClearImportedLayers">Pulisci</button>
</div> </div>
</section>
<section class="panel-section">
<h2>Progetti e POI</h2> <h2>Progetti e POI</h2>
<div class="input-row"> <label>
Nome
<input @bind="ProjectName" @bind:event="oninput" placeholder="Nome progetto o POI" /> <input @bind="ProjectName" @bind:event="oninput" placeholder="Nome progetto o POI" />
<button @onclick="AddProjectMarker">Aggiungi</button> </label>
</div> <button class="primary-command" @onclick="AddProjectMarker">Aggiungi POI al centro mappa</button>
<div class="button-row"> <div class="button-row">
<button @onclick="EnableDrawTools">Disegna</button> <button @onclick="EnableDrawTools">Disegna</button>
<button @onclick="SaveWorkspace">Salva</button> <button @onclick="SaveWorkspace">Salva</button>
<button @onclick="LoadWorkspace">Carica</button> <button @onclick="LoadWorkspace">Carica</button>
</div> </div>
<button class="danger-command" @onclick="ClearDrawings">Elimina disegni e POI</button>
</section> </section>
}
<section class="panel-section live-section"> else if (ActiveTab == "settings")
<h2>GPS dal vivo</h2> {
<div class="gps-readout"> <section class="panel-content">
<span id="gpsState">GPS non attivo</span> <h2>Visualizzazione</h2>
<strong id="parcelState">Fuori da poligoni caricati</strong>
</div>
<div class="button-row">
<button @onclick="StartGps">Segui posizione</button>
<button @onclick="StopGps">Stop</button>
<button @onclick="CenterOnGps">Centra</button>
</div>
<label class="toggle-line">
<input type="checkbox" checked @onchange="ToggleTrail" />
Registra percorso
</label>
</section>
<section class="panel-section">
<h2>Livelli</h2>
<div class="field-grid compact">
<label> <label>
Sfondo Sfondo
<select @onchange="ChangeBaseLayer"> <select @onchange="ChangeBaseLayer">
@@ -110,7 +151,6 @@
Trasparenza catasto Trasparenza catasto
<input type="range" min="0" max="1" step="0.05" value="0.75" @onchange="ChangeCadastreOpacity" /> <input type="range" min="0" max="1" step="0.05" value="0.75" @onchange="ChangeCadastreOpacity" />
</label> </label>
</div>
<div class="layer-toggles"> <div class="layer-toggles">
@foreach (var layer in CadastralLayers) @foreach (var layer in CadastralLayers)
{ {
@@ -120,28 +160,80 @@
</label> </label>
} }
</div> </div>
<h2>GPS e percorso</h2>
<label class="toggle-line">
<input type="checkbox" checked @onchange="ToggleTrail" />
Registra la traccia mentre cammini
</label>
<h2>Servizi Agenzia delle Entrate</h2>
<div class="service-note protected-service">
<strong>Download documenti e fogli ufficiali</strong>
<p>Il CAPTCHA o l'accesso SPID/CIE vengono gestiti direttamente dal sito dell'Agenzia. Per sicurezza l'app non tenta di aggirarli.</p>
<button class="primary-command" @onclick="OpenOfficialGeoportal">Apri Geoportale catastale</button>
<button class="secondary-command" @onclick="OpenOfficialReservedArea">Apri Area riservata per download</button>
</div>
<button class="secondary-command" @onclick="ExportCadastralImage">Apri vista WMS corrente</button>
<footer>Dati catastali: Agenzia delle Entrate, licenza CC BY 4.0. App indipendente.</footer>
</section> </section>
}
<footer>
Dati catastali: Agenzia delle Entrate, licenza CC BY 4.0. App indipendente.
</footer>
</aside> </aside>
}
<section class="map-stage">
<div id="map"></div>
<div id="mapInfo" class="map-info">Pronto</div> <div id="mapInfo" class="map-info">Pronto</div>
<nav class="bottom-tabs" aria-label="Sezioni principali">
<button class="@(ActiveTab == "map" || ActiveTab == "search" ? "active" : null)" @onclick='() => SelectTab("map")'>Mappa</button>
<button class="@(ActiveTab == "cadastre" ? "active" : null)" @onclick='() => SelectTab("cadastre")'>Catasto</button>
<button class="@(ActiveTab == "projects" ? "active" : null)" @onclick='() => SelectTab("projects")'>Progetti</button>
<button class="@(ActiveTab == "settings" ? "active" : null)" @onclick='() => SelectTab("settings")'>Impostazioni</button>
</nav>
</section> </section>
</div> </div>
@code { @code {
private string SearchText { get; set; } = ""; private string ActiveTab { get; set; } = "map";
private string CadastralRegion { get; set; } = ""; private string SearchText { get; set; } = string.Empty;
private string CadastralMunicipality { get; set; } = ""; private string ProjectName { get; set; } = string.Empty;
private string CadastralMunicipalityCode { get; set; } = "";
private string CadastralSheet { get; set; } = "";
private string CadastralParcel { get; set; } = "";
private string ProjectName { get; set; } = "";
private string Status { get; set; } = "online"; private string Status { get; set; } = "online";
private string SelectedRegionFile { get; set; } = string.Empty;
private string SelectedMunicipalityCode { get; set; } = string.Empty;
private string SelectedSheet { get; set; } = string.Empty;
private string SelectedParcelNumber { get; set; } = string.Empty;
private string CatalogMessage { get; set; } = string.Empty;
private double? CatalogFraction { get; set; }
private bool CatalogBusy { get; set; }
private bool GpsActive { get; set; }
private CancellationTokenSource? CatalogCancellation { get; set; }
private IReadOnlyList<RegionOption> Regions { get; set; } = [];
private IReadOnlyList<MunicipalityOption> Municipalities { get; set; } = [];
private IReadOnlyList<string> Sheets { get; set; } = [];
private IReadOnlyList<ParcelOption> Parcels { get; set; } = [];
private MunicipalityOption? SelectedMunicipality =>
Municipalities.FirstOrDefault(item => item.Code == SelectedMunicipalityCode);
private ParcelOption? SelectedParcel =>
Parcels.FirstOrDefault(item => item.Number == SelectedParcelNumber);
private string PanelTitle => ActiveTab switch
{
"cadastre" => "Ricerca catastale",
"projects" => "Progetti e dati",
"settings" => "Impostazioni",
_ => string.Empty
};
private string PanelEyebrow => ActiveTab switch
{
"cadastre" => "Regione, Comune, Foglio, Particella",
"projects" => "KML, KMZ, GeoJSON e POI",
"settings" => "Mappa, GPS e servizi ufficiali",
_ => string.Empty
};
private readonly List<CadastralLayer> CadastralLayers = private readonly List<CadastralLayer> CadastralLayers =
[ [
@@ -153,6 +245,18 @@
new("acque", "Acque", false) new("acque", "Acque", false)
]; ];
protected override async Task OnInitializedAsync()
{
try
{
Regions = await CatalogService.GetRegionsAsync();
}
catch (Exception error)
{
CatalogMessage = $"Catalogo Comuni non disponibile: {error.Message}";
}
}
protected override async Task OnAfterRenderAsync(bool firstRender) protected override async Task OnAfterRenderAsync(bool firstRender)
{ {
if (firstRender) if (firstRender)
@@ -161,55 +265,241 @@
} }
} }
private Task SearchLocation() => JS.InvokeVoidAsync("lmeMap.search", SearchText).AsTask(); private async Task SelectTab(string tab)
private Task LocateParcel()
{ {
var label = $"{CadastralRegion} {CadastralMunicipality} foglio {CadastralSheet} particella {CadastralParcel}".Trim(); ActiveTab = tab;
return JS.InvokeVoidAsync("lmeMap.locateParcelArea", CadastralRegion, CadastralMunicipality, CadastralMunicipalityCode, CadastralSheet, CadastralParcel, label).AsTask(); await Task.Delay(30);
await JS.InvokeVoidAsync("lmeMap.resize");
} }
private Task ExportCadastralImage() => JS.InvokeVoidAsync("lmeMap.exportCadastreView").AsTask(); private async Task SearchLocation()
{
try
{
await JS.InvokeVoidAsync("lmeMap.search", SearchText);
ActiveTab = "map";
}
catch (Exception error)
{
Status = "errore ricerca";
await JS.InvokeVoidAsync("lmeMap.showInfo", $"Ricerca non riuscita: {error.Message}");
}
}
private Task FitImportedLayers() => JS.InvokeVoidAsync("lmeMap.fitImported").AsTask(); private async Task OnRegionChanged(ChangeEventArgs args)
{
CancelCatalogWork();
SelectedRegionFile = args.Value?.ToString() ?? string.Empty;
SelectedMunicipalityCode = string.Empty;
SelectedSheet = string.Empty;
SelectedParcelNumber = string.Empty;
Sheets = [];
Parcels = [];
CatalogMessage = string.Empty;
Municipalities = string.IsNullOrWhiteSpace(SelectedRegionFile)
? []
: await CatalogService.GetMunicipalitiesAsync(SelectedRegionFile);
}
private Task ClearImportedLayers() => JS.InvokeVoidAsync("lmeMap.clearImported").AsTask(); private async Task OnMunicipalityChanged(ChangeEventArgs args)
{
SelectedMunicipalityCode = args.Value?.ToString() ?? string.Empty;
SelectedSheet = string.Empty;
SelectedParcelNumber = string.Empty;
Sheets = [];
Parcels = [];
var municipality = SelectedMunicipality;
if (municipality is null)
{
return;
}
private Task AddProjectMarker() => JS.InvokeVoidAsync("lmeMap.addProjectMarker", ProjectName).AsTask(); var token = BeginCatalogWork();
CatalogBusy = true;
CatalogMessage = "Preparo il catalogo regionale...";
CatalogFraction = null;
try
{
Sheets = await CatalogService.GetSheetsAsync(municipality, CreateProgress(), token);
CatalogMessage = $"Seleziona uno dei {Sheets.Count} fogli disponibili.";
await JS.InvokeVoidAsync("lmeMap.search", $"{municipality.Name}, Italia");
}
catch (OperationCanceledException)
{
}
catch (Exception error)
{
CatalogMessage = $"Impossibile caricare i fogli: {error.Message}";
await JS.InvokeVoidAsync("lmeMap.showInfo", CatalogMessage);
}
finally
{
CatalogBusy = false;
CatalogFraction = null;
}
}
private async Task OnSheetChanged(ChangeEventArgs args)
{
SelectedSheet = args.Value?.ToString() ?? string.Empty;
SelectedParcelNumber = string.Empty;
Parcels = [];
var municipality = SelectedMunicipality;
if (municipality is null || string.IsNullOrWhiteSpace(SelectedSheet))
{
return;
}
var token = BeginCatalogWork();
CatalogBusy = true;
CatalogMessage = "Carico le particelle del foglio...";
CatalogFraction = null;
try
{
Parcels = await CatalogService.GetParcelsAsync(municipality, SelectedSheet, CreateProgress(), token);
CatalogMessage = $"Seleziona una delle {Parcels.Count} particelle disponibili.";
}
catch (OperationCanceledException)
{
}
catch (Exception error)
{
CatalogMessage = $"Impossibile caricare le particelle: {error.Message}";
await JS.InvokeVoidAsync("lmeMap.showInfo", CatalogMessage);
}
finally
{
CatalogBusy = false;
CatalogFraction = null;
}
}
private Task OnParcelChanged(ChangeEventArgs args)
{
SelectedParcelNumber = args.Value?.ToString() ?? string.Empty;
return Task.CompletedTask;
}
private async Task LocateParcel()
{
var municipality = SelectedMunicipality;
var parcel = SelectedParcel;
if (municipality is null || parcel is null)
{
return;
}
try
{
var label = $"{municipality.Name} - foglio {DisplaySheet(SelectedSheet)}, particella {parcel.Number}";
await JS.InvokeVoidAsync("lmeMap.locateParcelByPoint", parcel.Latitude, parcel.Longitude, parcel.Number, label);
ActiveTab = "map";
await Task.Delay(30);
await JS.InvokeVoidAsync("lmeMap.resize");
}
catch (Exception error)
{
CatalogMessage = $"Particella non visualizzata: {error.Message}";
await JS.InvokeVoidAsync("lmeMap.showInfo", CatalogMessage);
}
}
private async Task ToggleGps()
{
if (GpsActive)
{
await StopGps();
}
else
{
await StartGps();
}
}
private async Task StartGps() private async Task StartGps()
{
GpsActive = true;
try
{ {
await LocationService.StartTrackingAsync( await LocationService.StartTrackingAsync(
async location => await InvokeAsync(() => JS.InvokeVoidAsync("lmeMap.setNativeGpsPosition", location)), async location => await InvokeAsync(() => JS.InvokeVoidAsync("lmeMap.setNativeGpsPosition", location)),
async error => await InvokeAsync(() => JS.InvokeVoidAsync("lmeMap.setGpsError", error))); async error => await InvokeAsync(() => JS.InvokeVoidAsync("lmeMap.setGpsError", error)));
} }
catch (Exception error)
{
GpsActive = false;
await JS.InvokeVoidAsync("lmeMap.setGpsError", error.Message);
}
}
private async Task StopGps() private async Task StopGps()
{ {
LocationService.StopTracking(); LocationService.StopTracking();
GpsActive = false;
await JS.InvokeVoidAsync("lmeMap.stopGps"); await JS.InvokeVoidAsync("lmeMap.stopGps");
} }
private Task CenterOnGps() => JS.InvokeVoidAsync("lmeMap.centerOnGps").AsTask(); private IProgress<CatalogProgress> CreateProgress() => new Progress<CatalogProgress>(progress =>
{
_ = InvokeAsync(() =>
{
CatalogMessage = progress.Message;
CatalogFraction = progress.Fraction;
StateHasChanged();
});
});
private Task ToggleTrail(ChangeEventArgs args) => JS.InvokeVoidAsync("lmeMap.toggleTrail", (bool?)args.Value == true).AsTask(); private CancellationToken BeginCatalogWork()
{
CancelCatalogWork();
CatalogCancellation = new CancellationTokenSource();
return CatalogCancellation.Token;
}
private Task EnableDrawTools() => JS.InvokeVoidAsync("lmeMap.enableDrawTools").AsTask(); private void CancelCatalogWork()
{
CatalogCancellation?.Cancel();
CatalogCancellation?.Dispose();
CatalogCancellation = null;
}
private static string DisplaySheet(string value)
{
var trimmed = value.TrimStart('0');
return string.IsNullOrEmpty(trimmed) ? "0" : trimmed;
}
private Task FitImportedLayers() => JS.InvokeVoidAsync("lmeMap.fitImported").AsTask();
private Task ClearImportedLayers() => JS.InvokeVoidAsync("lmeMap.clearImported").AsTask();
private Task AddProjectMarker() => JS.InvokeVoidAsync("lmeMap.addProjectMarker", ProjectName).AsTask();
private async Task EnableDrawTools()
{
await JS.InvokeVoidAsync("lmeMap.enableDrawTools");
await SelectTab("map");
}
private Task ClearDrawings() => JS.InvokeVoidAsync("lmeMap.clearDrawings").AsTask();
private Task SaveWorkspace() => JS.InvokeVoidAsync("lmeMap.saveWorkspace").AsTask(); private Task SaveWorkspace() => JS.InvokeVoidAsync("lmeMap.saveWorkspace").AsTask();
private Task LoadWorkspace() => JS.InvokeVoidAsync("lmeMap.loadWorkspace").AsTask(); private Task LoadWorkspace() => JS.InvokeVoidAsync("lmeMap.loadWorkspace").AsTask();
private Task CenterOnGps() => JS.InvokeVoidAsync("lmeMap.centerOnGps").AsTask();
private Task ToggleTrail(ChangeEventArgs args) => JS.InvokeVoidAsync("lmeMap.toggleTrail", (bool?)args.Value == true).AsTask();
private Task ChangeBaseLayer(ChangeEventArgs args) => JS.InvokeVoidAsync("lmeMap.setBaseLayer", args.Value?.ToString()).AsTask(); private Task ChangeBaseLayer(ChangeEventArgs args) => JS.InvokeVoidAsync("lmeMap.setBaseLayer", args.Value?.ToString()).AsTask();
private Task ChangeCadastreOpacity(ChangeEventArgs args) => JS.InvokeVoidAsync("lmeMap.setCadastreOpacity", args.Value?.ToString()).AsTask(); private Task ChangeCadastreOpacity(ChangeEventArgs args) => JS.InvokeVoidAsync("lmeMap.setCadastreOpacity", args.Value?.ToString()).AsTask();
private Task ToggleCadastreLayer(string layer, ChangeEventArgs args) => JS.InvokeVoidAsync("lmeMap.toggleCadastreLayer", layer, (bool?)args.Value == true).AsTask(); private Task ToggleCadastreLayer(string layer, ChangeEventArgs args) => JS.InvokeVoidAsync("lmeMap.toggleCadastreLayer", layer, (bool?)args.Value == true).AsTask();
private Task ExportCadastralImage() => JS.InvokeVoidAsync("lmeMap.exportCadastreView").AsTask();
private Task OpenOfficialGeoportal() => Microsoft.Maui.ApplicationModel.Launcher.Default.OpenAsync(
new Uri("https://geoportale.cartografia.agenziaentrate.gov.it/"));
private Task OpenOfficialReservedArea() => Microsoft.Maui.ApplicationModel.Launcher.Default.OpenAsync(
new Uri("https://www.agenziaentrate.gov.it/portale/area-riservata"));
private sealed record CadastralLayer(string Key, string Name, bool Enabled); private sealed record CadastralLayer(string Key, string Name, bool Enabled);
public async ValueTask DisposeAsync() public ValueTask DisposeAsync()
{ {
await LocationService.DisposeAsync(); CancelCatalogWork();
LocationService.StopTracking();
return ValueTask.CompletedTask;
} }
} }
+4 -3
View File
@@ -22,14 +22,14 @@
<Nullable>enable</Nullable> <Nullable>enable</Nullable>
<!-- Display name --> <!-- Display name -->
<ApplicationTitle>LMEMappeCatastaliApp</ApplicationTitle> <ApplicationTitle>LME Mappe Catastali</ApplicationTitle>
<!-- App Identifier --> <!-- App Identifier -->
<ApplicationId>com.companyname.lmemappecatastaliapp</ApplicationId> <ApplicationId>com.companyname.lmemappecatastaliapp</ApplicationId>
<!-- Versions --> <!-- Versions -->
<ApplicationDisplayVersion>1.0</ApplicationDisplayVersion> <ApplicationDisplayVersion>0.2.1</ApplicationDisplayVersion>
<ApplicationVersion>1</ApplicationVersion> <ApplicationVersion>5</ApplicationVersion>
<!-- To develop, package, and publish an app to the Microsoft Store, see: https://aka.ms/MauiTemplateUnpackaged --> <!-- To develop, package, and publish an app to the Microsoft Store, see: https://aka.ms/MauiTemplateUnpackaged -->
<WindowsPackageType>None</WindowsPackageType> <WindowsPackageType>None</WindowsPackageType>
@@ -64,6 +64,7 @@
<PackageReference Include="Microsoft.Maui.Controls" Version="$(MauiVersion)" /> <PackageReference Include="Microsoft.Maui.Controls" Version="$(MauiVersion)" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="$(MauiVersion)" /> <PackageReference Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="$(MauiVersion)" />
<PackageReference Include="Microsoft.Extensions.Logging.Debug" Version="9.0.9" /> <PackageReference Include="Microsoft.Extensions.Logging.Debug" Version="9.0.9" />
<PackageReference Include="Parquet.Net" Version="6.1.0" />
</ItemGroup> </ItemGroup>
</Project> </Project>
+1
View File
@@ -17,6 +17,7 @@ public static class MauiProgram
builder.Services.AddMauiBlazorWebView(); builder.Services.AddMauiBlazorWebView();
builder.Services.AddSingleton<PreciseLocationService>(); builder.Services.AddSingleton<PreciseLocationService>();
builder.Services.AddSingleton<CadastralCatalogService>();
#if DEBUG #if DEBUG
builder.Services.AddBlazorWebViewDeveloperTools(); builder.Services.AddBlazorWebViewDeveloperTools();
+14 -6
View File
@@ -11,12 +11,18 @@ App .NET MAUI Blazor Hybrid per Android, iOS, Mac Catalyst e Windows, pensata pe
- Import di file KML, KMZ, GeoJSON e JSON. - Import di file KML, KMZ, GeoJSON e JSON.
- Inquadramento e pulizia dei layer importati. - Inquadramento e pulizia dei layer importati.
- Disegno di marker, linee, poligoni e rettangoli. - Disegno di marker, linee, poligoni e rettangoli.
- Toolbar di disegno completa di icone, modifica, eliminazione singola e pulizia di tutti i disegni/POI.
- POI/progetti salvabili in locale con `localStorage`. - POI/progetti salvabili in locale con `localStorage`.
- GPS nativo MAUI ad alta precisione con permessi Android/iOS. - GPS nativo MAUI ad alta precisione con permessi Android/iOS.
- Marker posizione, cerchio accuratezza in metri, tracciamento percorso. - Marker posizione, cerchio accuratezza in metri, tracciamento percorso.
- Controllo se la posizione GPS cade dentro un poligono importato o disegnato. - Controllo se la posizione GPS cade dentro un poligono importato o disegnato.
- Interrogazione WFS ufficiale Agenzia delle Entrate attorno alla posizione GPS per evidenziare la particella catastale corrente quando il servizio restituisce la geometria. - Interrogazione WFS ufficiale Agenzia delle Entrate attorno alla posizione GPS per evidenziare la particella catastale corrente quando il servizio restituisce la geometria.
- Ricerca Comune/Foglio/Particella tramite indice OnData e successivo recupero geometria dal WFS ufficiale AdE. - Mappa a tutto schermo con tab Catasto, Progetti e Impostazioni, adattabile agli schermi pieghevoli.
- Ingrandimento oltre lo zoom satellitare nativo senza tessere "Map data not yet available".
- Tendine concatenate Regione, Comune, Foglio e Particella.
- Catalogo dei Comuni incluso nell'APK e cataloghi regionali OnData scaricati in cache solo quando servono.
- Ricerca catastale eseguita dal codice .NET nativo, senza DuckDB WebAssembly nella WebView Android.
- Collegamenti separati al Geoportale pubblico e all'Area riservata AdE per CAPTCHA, SPID/CIE e download ufficiali.
## Limite ufficiale AdE da considerare ## Limite ufficiale AdE da considerare
@@ -26,7 +32,9 @@ Il WFS dell'Agenzia delle Entrate consente `GetFeature` con bounding box, ma non
2. una chiamata WFS con bounding box piccola intorno a quel punto; 2. una chiamata WFS con bounding box piccola intorno a quel punto;
3. filtro lato app sul risultato per selezionare la particella corretta. 3. filtro lato app sul risultato per selezionare la particella corretta.
Questo passaggio e' implementato nella schermata "Particella catastale". Per la massima affidabilita inserisci il codice catastale del Comune, ad esempio `F205` per Milano o `H501` per Roma. Questo passaggio e' implementato nel tab `Catasto`. Regione e Comune sono disponibili subito; alla prima selezione di un Comune l'app scarica il file della regione, da circa 6 a 72 MB, e lo conserva nella cache del dispositivo. Fogli e particelle vengono poi popolati automaticamente.
I layer cartografici pubblici WMS/WFS sono open data e non richiedono CAPTCHA. Il CAPTCHA o l'autenticazione SPID/CIE appartengono ai servizi web di consultazione e download documentale: l'app li apre nel sito ufficiale dell'Agenzia e non tenta di aggirarli.
## Aprire in Visual Studio ## Aprire in Visual Studio
@@ -50,16 +58,16 @@ Per Android:
dotnet build -f net9.0-android -p:AndroidSdkDirectory=C:\Users\livio\AppData\Local\Android\Sdk dotnet build -f net9.0-android -p:AndroidSdkDirectory=C:\Users\livio\AppData\Local\Android\Sdk
``` ```
## APK generato ## APK Release generato
La build Debug Android genera: La pubblicazione Android genera:
```text ```text
C:\Users\livio\Documents\LMEMappeCatastali\LMEMappeCatastaliApp\bin\Debug\net9.0-android\com.companyname.lmemappecatastaliapp-Signed.apk C:\Users\livio\Documents\LMEMappeCatastali\LMEMappeCatastaliApp\bin\Release\net9.0-android\publish\com.companyname.lmemappecatastaliapp-Signed.apk
``` ```
Per installarlo con telefono collegato e debug USB attivo: Per installarlo con telefono collegato e debug USB attivo:
```powershell ```powershell
C:\Users\livio\AppData\Local\Android\Sdk\platform-tools\adb.exe install -r C:\Users\livio\Documents\LMEMappeCatastali\LMEMappeCatastaliApp\bin\Debug\net9.0-android\com.companyname.lmemappecatastaliapp-Signed.apk C:\Users\livio\AppData\Local\Android\Sdk\platform-tools\adb.exe install -r C:\Users\livio\Documents\LMEMappeCatastali\LMEMappeCatastaliApp\bin\Release\net9.0-android\publish\com.companyname.lmemappecatastaliapp-Signed.apk
``` ```
File diff suppressed because it is too large. Load diff
+342
View File
@@ -0,0 +1,342 @@
using System.Text;
using System.Text.Json;
using Parquet;
using Parquet.Data;
using Parquet.Schema;
namespace LMEMappeCatastaliApp.Services;
public sealed class CadastralCatalogService
{
private const string DataBaseUrl = "https://raw.githubusercontent.com/ondata/dati_catastali/main/S_0000_ITALIA/anagrafica/";
private readonly HttpClient _httpClient = new()
{
Timeout = Timeout.InfiniteTimeSpan
};
private readonly SemaphoreSlim _downloadLock = new(1, 1);
private IReadOnlyList<MunicipalityOption>? _municipalities;
public CadastralCatalogService()
{
_httpClient.DefaultRequestHeaders.UserAgent.ParseAdd("LMEMappeCatastali/0.2");
}
public async Task<IReadOnlyList<RegionOption>> GetRegionsAsync()
{
var municipalities = await GetAllMunicipalitiesAsync();
return municipalities
.GroupBy(item => item.DataFile, StringComparer.OrdinalIgnoreCase)
.Select(group => new RegionOption(RegionName(group.Key), group.Key))
.OrderBy(item => item.Name, StringComparer.CurrentCultureIgnoreCase)
.ToArray();
}
public async Task<IReadOnlyList<MunicipalityOption>> GetMunicipalitiesAsync(string dataFile)
{
var municipalities = await GetAllMunicipalitiesAsync();
return municipalities
.Where(item => string.Equals(item.DataFile, dataFile, StringComparison.OrdinalIgnoreCase))
.OrderBy(item => item.Name, StringComparer.CurrentCultureIgnoreCase)
.ToArray();
}
public async Task<IReadOnlyList<string>> GetSheetsAsync(
MunicipalityOption municipality,
IProgress<CatalogProgress>? progress = null,
CancellationToken cancellationToken = default)
{
var path = await EnsureRegionFileAsync(municipality.DataFile, progress, cancellationToken);
progress?.Report(new CatalogProgress("Leggo i fogli del Comune...", null));
var sheets = new HashSet<string>(StringComparer.OrdinalIgnoreCase);
await using var reader = await ParquetReader.CreateAsync(path, cancellationToken: cancellationToken);
var communeField = RequiredField(reader.Schema, "comune");
var sheetField = RequiredField(reader.Schema, "foglio");
for (var groupIndex = 0; groupIndex < reader.RowGroupCount; groupIndex++)
{
cancellationToken.ThrowIfCancellationRequested();
using var group = reader.OpenRowGroupReader(groupIndex);
if (!MayContain(group.GetStatistics(communeField), municipality.Code))
{
continue;
}
var count = checked((int)group.RowCount);
var communes = new string[count];
var sheetValues = new string[count];
await group.ReadAsync(communeField, communes, cancellationToken: cancellationToken);
await group.ReadAsync(sheetField, sheetValues, cancellationToken: cancellationToken);
for (var index = 0; index < count; index++)
{
if (string.Equals(communes[index], municipality.Code, StringComparison.OrdinalIgnoreCase)
&& !string.IsNullOrWhiteSpace(sheetValues[index]))
{
sheets.Add(sheetValues[index]);
}
}
}
progress?.Report(new CatalogProgress($"Trovati {sheets.Count} fogli.", 1));
return sheets.OrderBy(value => value, NaturalStringComparer.Instance).ToArray();
}
public async Task<IReadOnlyList<ParcelOption>> GetParcelsAsync(
MunicipalityOption municipality,
string sheet,
IProgress<CatalogProgress>? progress = null,
CancellationToken cancellationToken = default)
{
var path = await EnsureRegionFileAsync(municipality.DataFile, progress, cancellationToken);
progress?.Report(new CatalogProgress("Leggo le particelle del foglio...", null));
var parcels = new Dictionary<string, ParcelOption>(StringComparer.OrdinalIgnoreCase);
await using var reader = await ParquetReader.CreateAsync(path, cancellationToken: cancellationToken);
var communeField = RequiredField(reader.Schema, "comune");
var sheetField = RequiredField(reader.Schema, "foglio");
var parcelField = RequiredField(reader.Schema, "particella");
var longitudeField = RequiredField(reader.Schema, "x");
var latitudeField = RequiredField(reader.Schema, "y");
var inspireIdField = RequiredField(reader.Schema, "INSPIREID_LOCALID");
for (var groupIndex = 0; groupIndex < reader.RowGroupCount; groupIndex++)
{
cancellationToken.ThrowIfCancellationRequested();
using var group = reader.OpenRowGroupReader(groupIndex);
if (!MayContain(group.GetStatistics(communeField), municipality.Code)
|| !MayContain(group.GetStatistics(sheetField), sheet))
{
continue;
}
var count = checked((int)group.RowCount);
var communes = new string[count];
var sheets = new string[count];
await group.ReadAsync(communeField, communes, cancellationToken: cancellationToken);
await group.ReadAsync(sheetField, sheets, cancellationToken: cancellationToken);
var matchingIndexes = Enumerable.Range(0, count)
.Where(index => string.Equals(communes[index], municipality.Code, StringComparison.OrdinalIgnoreCase)
&& string.Equals(sheets[index], sheet, StringComparison.OrdinalIgnoreCase))
.ToArray();
if (matchingIndexes.Length == 0)
{
continue;
}
var parcelValues = new string[count];
var inspireIds = new string[count];
var longitudes = new long?[count];
var latitudes = new long?[count];
await group.ReadAsync(parcelField, parcelValues, cancellationToken: cancellationToken);
await group.ReadAsync(inspireIdField, inspireIds, cancellationToken: cancellationToken);
await group.ReadAsync<long>(longitudeField, longitudes.AsMemory(), cancellationToken: cancellationToken);
await group.ReadAsync<long>(latitudeField, latitudes.AsMemory(), cancellationToken: cancellationToken);
foreach (var index in matchingIndexes)
{
var number = parcelValues[index];
if (string.IsNullOrWhiteSpace(number)
|| parcels.ContainsKey(number)
|| !latitudes[index].HasValue
|| !longitudes[index].HasValue)
{
continue;
}
parcels[number] = new ParcelOption(
number,
latitudes[index]!.Value / 1_000_000d,
longitudes[index]!.Value / 1_000_000d,
inspireIds[index] ?? string.Empty);
}
}
progress?.Report(new CatalogProgress($"Trovate {parcels.Count} particelle.", 1));
return parcels.Values.OrderBy(item => item.Number, NaturalStringComparer.Instance).ToArray();
}
private async Task<IReadOnlyList<MunicipalityOption>> GetAllMunicipalitiesAsync()
{
if (_municipalities is not null)
{
return _municipalities;
}
await using var stream = await FileSystem.Current.OpenAppPackageFileAsync("Data/municipalities.json");
_municipalities = await JsonSerializer.DeserializeAsync<List<MunicipalityOption>>(
stream,
new JsonSerializerOptions { PropertyNameCaseInsensitive = true })
?? [];
return _municipalities;
}
private async Task<string> EnsureRegionFileAsync(
string dataFile,
IProgress<CatalogProgress>? progress,
CancellationToken cancellationToken)
{
var safeFileName = Path.GetFileName(dataFile);
var destination = Path.Combine(FileSystem.Current.CacheDirectory, $"catasto-{safeFileName}");
if (IsValidParquetFile(destination))
{
progress?.Report(new CatalogProgress("Uso il catalogo regionale salvato sul telefono.", 1));
return destination;
}
await _downloadLock.WaitAsync(cancellationToken);
try
{
if (IsValidParquetFile(destination))
{
return destination;
}
var temporary = destination + ".download";
if (File.Exists(temporary))
{
File.Delete(temporary);
}
using var response = await _httpClient.GetAsync(
DataBaseUrl + Uri.EscapeDataString(safeFileName),
HttpCompletionOption.ResponseHeadersRead,
cancellationToken);
response.EnsureSuccessStatusCode();
var total = response.Content.Headers.ContentLength;
await using var source = await response.Content.ReadAsStreamAsync(cancellationToken);
await using var target = new FileStream(temporary, FileMode.CreateNew, FileAccess.Write, FileShare.None, 128 * 1024, true);
var buffer = new byte[128 * 1024];
long downloaded = 0;
int read;
while ((read = await source.ReadAsync(buffer, cancellationToken)) > 0)
{
await target.WriteAsync(buffer.AsMemory(0, read), cancellationToken);
downloaded += read;
double? fraction = total > 0 ? (double)downloaded / total.Value : null;
var megabytes = downloaded / 1_048_576d;
progress?.Report(new CatalogProgress($"Scarico dati regionali: {megabytes:0.0} MB", fraction));
}
await target.FlushAsync(cancellationToken);
target.Close();
File.Move(temporary, destination, true);
return destination;
}
catch
{
var temporary = destination + ".download";
if (File.Exists(temporary))
{
File.Delete(temporary);
}
throw;
}
finally
{
_downloadLock.Release();
}
}
private static bool IsValidParquetFile(string path)
{
if (!File.Exists(path) || new FileInfo(path).Length < 12)
{
return false;
}
using var stream = File.OpenRead(path);
Span<byte> marker = stackalloc byte[4];
if (stream.Read(marker) != marker.Length || Encoding.ASCII.GetString(marker) != "PAR1")
{
return false;
}
stream.Seek(-4, SeekOrigin.End);
return stream.Read(marker) == marker.Length && Encoding.ASCII.GetString(marker) == "PAR1";
}
private static DataField RequiredField(ParquetSchema schema, string name) =>
schema.FindDataField(name) ?? throw new InvalidDataException($"Colonna catastale mancante: {name}");
private static bool MayContain(DataColumnStatistics? statistics, string wanted)
{
if (statistics is null)
{
return true;
}
var minimum = StatisticText(statistics.MinValue);
var maximum = StatisticText(statistics.MaxValue);
return minimum is null || maximum is null
|| (string.Compare(wanted, minimum, StringComparison.OrdinalIgnoreCase) >= 0
&& string.Compare(wanted, maximum, StringComparison.OrdinalIgnoreCase) <= 0);
}
private static string? StatisticText(object? value) => value switch
{
null => null,
string text => text,
byte[] bytes => Encoding.UTF8.GetString(bytes),
ReadOnlyMemory<byte> memory => Encoding.UTF8.GetString(memory.Span),
_ => value.ToString()
};
private static string RegionName(string dataFile)
{
var key = Path.GetFileNameWithoutExtension(dataFile);
return key switch
{
"01_Piemonte" => "Piemonte",
"02_ValledAosta" => "Valle d'Aosta",
"03_Lombardia" => "Lombardia",
"05_Veneto" => "Veneto",
"06_Friuli-VeneziaGiulia" => "Friuli-Venezia Giulia",
"07_Liguria" => "Liguria",
"08_Emilia-Romagna" => "Emilia-Romagna",
"09_Toscana" => "Toscana",
"10_Umbria" => "Umbria",
"11_Marche" => "Marche",
"12_Lazio" => "Lazio",
"13_Abruzzo" => "Abruzzo",
"14_Molise" => "Molise",
"15_Campania" => "Campania",
"16_Puglia" => "Puglia",
"17_Basilicata" => "Basilicata",
"18_Calabria" => "Calabria",
"19_Sicilia" => "Sicilia",
"20_Sardegna" => "Sardegna",
_ => key.Length > 3 ? key[3..] : key
};
}
}
public sealed record RegionOption(string Name, string DataFile);
public sealed record MunicipalityOption(string Code, string Name, string DataFile);
public sealed record ParcelOption(string Number, double Latitude, double Longitude, string InspireId);
public sealed record CatalogProgress(string Message, double? Fraction);
internal sealed class NaturalStringComparer : IComparer<string>
{
public static NaturalStringComparer Instance { get; } = new();
public int Compare(string? left, string? right)
{
if (ReferenceEquals(left, right)) return 0;
if (left is null) return -1;
if (right is null) return 1;
var leftNumber = long.TryParse(left, out var leftValue);
var rightNumber = long.TryParse(right, out var rightValue);
if (leftNumber && rightNumber)
{
var numeric = leftValue.CompareTo(rightValue);
return numeric != 0 ? numeric : string.Compare(left, right, StringComparison.OrdinalIgnoreCase);
}
return string.Compare(left, right, StringComparison.CurrentCultureIgnoreCase);
}
}
+387 -147
View File
@@ -1,14 +1,32 @@
:root {
--ink: #17212b;
--muted: #63717c;
--surface: #ffffff;
--panel: #f4f6f7;
--line: #d6dde2;
--accent: #14705e;
--accent-strong: #0c5749;
--warning: #a34b08;
--nav-height: 64px;
}
html, html,
body, body,
#app, #app,
.app-shell { .app-shell,
.map-app,
.map-stage {
width: 100%; width: 100%;
height: 100%; height: 100%;
margin: 0; margin: 0;
overflow: hidden; overflow: hidden;
}
html,
body {
font-family: Inter, "Segoe UI", Arial, sans-serif; font-family: Inter, "Segoe UI", Arial, sans-serif;
background: #101820; background: #d8e0e4;
color: #17212b; color: var(--ink);
} }
button, button,
@@ -18,28 +36,32 @@ select {
} }
button { button {
min-height: 38px; min-height: 42px;
border: 0; border: 0;
border-radius: 6px; border-radius: 6px;
padding: 0 12px; padding: 0 14px;
background: #176b87; background: var(--accent);
color: #fff; color: #fff;
font-weight: 700; font-weight: 700;
} }
button:active { button:active:not(:disabled) {
transform: translateY(1px); transform: translateY(1px);
} }
button:disabled {
opacity: 0.48;
}
input, input,
select { select {
width: 100%; width: 100%;
min-height: 38px; min-height: 44px;
border: 1px solid #c8d3dc; border: 1px solid #bfcbd2;
border-radius: 6px; border-radius: 6px;
padding: 0 10px; padding: 0 11px;
background: #fff; background: #fff;
color: #17212b; color: var(--ink);
} }
input[type="range"], input[type="range"],
@@ -47,35 +69,168 @@ input[type="checkbox"] {
min-height: auto; min-height: auto;
} }
.map-app { .map-stage {
display: grid; position: relative;
grid-template-columns: 390px minmax(0, 1fr);
width: 100%;
height: 100%;
} }
.tool-panel { #map {
z-index: 800; position: absolute;
inset: 0;
background: #d8e0e4;
}
.map-toolbar {
position: absolute;
top: 12px;
left: 12px;
right: 12px;
z-index: 900;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
min-height: 52px;
padding: 7px 8px 7px 13px;
border: 1px solid rgba(255, 255, 255, 0.54);
border-radius: 8px;
background: rgba(22, 31, 38, 0.9);
box-shadow: 0 3px 14px rgba(0, 0, 0, 0.22);
color: #fff;
}
.app-identity {
display: flex;
align-items: baseline;
gap: 10px;
min-width: 0;
}
.app-identity strong {
font-size: 18px;
white-space: nowrap;
}
.app-identity span {
overflow: hidden;
color: #bfe6dc;
font-size: 12px;
text-overflow: ellipsis;
white-space: nowrap;
}
.toolbar-button {
min-height: 38px;
background: #fff;
color: var(--ink);
}
.map-search {
position: absolute;
top: 72px;
left: 12px;
right: 12px;
z-index: 890;
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 8px;
max-width: 640px;
padding: 8px;
border-radius: 8px;
background: rgba(255, 255, 255, 0.96);
box-shadow: 0 3px 14px rgba(0, 0, 0, 0.22);
opacity: 0;
pointer-events: none;
transform: translateY(-8px);
transition: opacity 140ms ease, transform 140ms ease;
}
.map-search.is-open {
opacity: 1;
pointer-events: auto;
transform: translateY(0);
}
.gps-overlay {
position: absolute;
top: 72px;
right: auto;
bottom: auto;
left: 12px;
z-index: 850;
display: grid;
grid-template-columns: minmax(160px, auto) auto auto;
align-items: center;
gap: 7px;
max-width: calc(100% - 24px);
padding: 7px;
border-radius: 8px;
background: rgba(255, 255, 255, 0.95);
box-shadow: 0 3px 14px rgba(0, 0, 0, 0.2);
transition: top 140ms ease;
}
.gps-overlay.search-open {
top: 140px;
}
.gps-state {
display: grid;
min-width: 0;
padding: 0 6px;
font-size: 11px;
}
.gps-state span,
.gps-state strong {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.gps-state strong {
color: #a33227;
}
.gps-main,
.gps-center {
min-height: 38px;
padding: 0 10px;
white-space: nowrap;
}
.gps-center {
background: #e7ecef;
color: var(--ink);
}
.tool-sheet {
position: absolute;
top: 0;
bottom: var(--nav-height);
left: 0;
z-index: 1100;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 12px; width: min(430px, calc(100% - 48px));
overflow-y: auto; border-right: 1px solid var(--line);
padding: 16px; background: var(--panel);
background: #f6f8f9; box-shadow: 7px 0 24px rgba(0, 0, 0, 0.24);
border-right: 1px solid #d8e0e6;
} }
.brand { .sheet-header {
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;
justify-content: space-between; justify-content: space-between;
gap: 12px; gap: 14px;
padding: 18px 16px 13px;
border-bottom: 1px solid var(--line);
background: #fff;
} }
.eyebrow { .eyebrow {
margin: 0 0 3px; margin: 0 0 4px;
color: #667785; color: var(--muted);
font-size: 12px; font-size: 11px;
font-weight: 800; font-weight: 800;
text-transform: uppercase; text-transform: uppercase;
} }
@@ -88,74 +243,75 @@ p {
h1 { h1 {
margin-bottom: 0; margin-bottom: 0;
font-size: 25px; font-size: 22px;
line-height: 1.08; line-height: 1.12;
} }
h2 { h2 {
margin-bottom: 10px; margin: 10px 0 2px;
font-size: 15px; font-size: 15px;
} }
.status { .close-button {
border-radius: 999px; width: 42px;
padding: 5px 9px; min-width: 42px;
background: #dff5e5; padding: 0;
color: #166534; background: #e9eef0;
font-size: 12px; color: var(--ink);
font-weight: 800; font-size: 27px;
line-height: 1;
} }
.panel-section { .panel-content {
padding: 12px;
border: 1px solid #dbe4ea;
border-radius: 8px;
background: #fff;
}
.input-row,
.button-row {
display: flex;
gap: 8px;
}
.input-row input {
min-width: 0;
}
.field-grid {
display: grid; display: grid;
grid-template-columns: 1fr 1fr; gap: 12px;
gap: 10px; overflow-y: auto;
} padding: 15px 16px 24px;
.field-grid.compact {
grid-template-columns: 1fr;
} }
label { label {
display: grid; display: grid;
gap: 5px; gap: 5px;
color: #475866; color: #45545f;
font-size: 12px; font-size: 12px;
font-weight: 800; font-weight: 800;
} }
.hint { .button-row {
margin: 10px 0 0; display: flex;
color: #667785; gap: 8px;
font-size: 12px; }
line-height: 1.35;
.button-row > * {
flex: 1;
}
.primary-command,
.secondary-command {
width: 100%;
}
.secondary-command {
border: 1px solid #b9c7ce;
background: #fff;
color: var(--ink);
}
.danger-command {
width: 100%;
border: 1px solid #cfaca8;
background: #fff;
color: #9b2f26;
} }
.file-picker { .file-picker {
position: relative; position: relative;
min-height: 42px; min-height: 52px;
place-items: center; place-items: center;
border: 1px dashed #93a7b5; border: 1px dashed #7e969f;
border-radius: 8px; border-radius: 8px;
background: #f2f7fa; background: #fff;
color: #176b87; color: var(--accent-strong);
cursor: pointer; cursor: pointer;
} }
@@ -166,120 +322,204 @@ label {
cursor: pointer; cursor: pointer;
} }
.catalog-progress,
.service-note {
display: grid;
gap: 7px;
padding: 11px;
border: 1px solid #c7dce0;
border-radius: 8px;
background: #edf7f5;
color: #24443e;
font-size: 12px;
line-height: 1.4;
}
.catalog-progress progress {
width: 100%;
accent-color: var(--accent);
}
.service-note p {
margin-bottom: 0;
}
.protected-service {
border-color: #ead4b9;
background: #fff7ea;
color: #5d4024;
}
.layer-toggles { .layer-toggles {
display: grid; display: grid;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
gap: 8px; gap: 9px;
margin-top: 10px; padding: 4px 0;
} }
.layer-toggles label, .layer-toggles label,
.toggle-line { .toggle-line {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 7px; gap: 8px;
} }
.gps-readout { .layer-toggles input,
display: grid; .toggle-line input {
gap: 6px; width: 18px;
margin-bottom: 10px; height: 18px;
padding: 10px;
border-radius: 8px;
background: #eef6ff;
color: #21405d;
font-size: 13px;
}
.gps-readout strong {
color: #b91c1c;
}
.map-stage {
position: relative;
min-width: 0;
height: 100%;
}
#map {
width: 100%;
height: 100%;
background: #d4dde3;
} }
.map-info { .map-info {
position: absolute; position: absolute;
left: 14px; left: 12px;
right: 14px; bottom: 76px;
bottom: 14px; z-index: 820;
z-index: 700; max-width: min(620px, calc(100% - 460px));
max-width: 760px;
border-radius: 8px; border-radius: 8px;
padding: 10px 12px; padding: 9px 11px;
background: rgba(16, 24, 32, 0.86); background: rgba(22, 31, 38, 0.88);
color: #fff; color: #fff;
font-size: 13px; font-size: 12px;
pointer-events: none; pointer-events: none;
} }
footer { .bottom-tabs {
color: #667785; position: absolute;
right: 0;
bottom: 0;
left: 0;
z-index: 1200;
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
height: var(--nav-height);
padding-bottom: env(safe-area-inset-bottom);
border-top: 1px solid #bcc7cd;
background: rgba(255, 255, 255, 0.98);
}
.bottom-tabs button {
min-width: 0;
min-height: 0;
border-radius: 0;
padding: 0 5px;
background: transparent;
color: #52616c;
font-size: 12px; font-size: 12px;
line-height: 1.35; }
.bottom-tabs button.active {
box-shadow: inset 0 3px 0 var(--accent);
color: var(--accent-strong);
}
footer {
margin-top: 4px;
color: var(--muted);
font-size: 11px;
line-height: 1.4;
}
.leaflet-bottom {
bottom: calc(var(--nav-height) + 6px);
} }
#blazor-error-ui { #blazor-error-ui {
background: #fff3cd;
bottom: 0;
box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
display: none;
left: 0;
padding: 0.7rem 1.25rem;
position: fixed; position: fixed;
width: 100%; right: 8px;
z-index: 1000; bottom: calc(var(--nav-height) + 8px);
left: 8px;
z-index: 2000;
display: none;
border: 1px solid #e4be77;
border-radius: 8px;
padding: 10px 42px 10px 12px;
background: #fff3cd;
color: #5f4614;
} }
#blazor-error-ui .dismiss { #blazor-error-ui .dismiss {
cursor: pointer;
position: absolute; position: absolute;
right: 0.75rem; top: 7px;
top: 0.5rem; right: 10px;
cursor: pointer;
} }
.status-bar-safe-area { .status-bar-safe-area {
display: none; display: none;
} }
@media (max-width: 850px) { @media (max-width: 700px) {
.map-app { .map-toolbar {
grid-template-columns: 1fr; top: 8px;
grid-template-rows: 45% 55%; left: 8px;
right: 8px;
} }
.tool-panel { .map-search {
border-right: 0; top: 68px;
border-bottom: 1px solid #d8e0e6; left: 8px;
padding: 12px; right: 8px;
} }
.brand { .tool-sheet {
align-items: center; top: 10%;
} bottom: var(--nav-height);
h1 {
font-size: 22px;
}
}
@supports (-webkit-touch-callout: none) {
.status-bar-safe-area {
display: flex;
position: sticky;
top: 0;
height: env(safe-area-inset-top);
background-color: #f6f8f9;
width: 100%; width: 100%;
z-index: 1; border-top: 1px solid var(--line);
border-right: 0;
border-radius: 8px 8px 0 0;
box-shadow: 0 -7px 24px rgba(0, 0, 0, 0.24);
}
.gps-overlay {
top: 68px;
right: 8px;
bottom: auto;
left: 8px;
grid-template-columns: minmax(0, 1fr) auto auto;
max-width: none;
}
.gps-overlay.search-open {
top: 136px;
}
.gps-main,
.gps-center {
padding: 0 8px;
font-size: 11px;
}
.map-info {
right: 8px;
bottom: 72px;
left: 8px;
max-width: none;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.bottom-tabs button {
font-size: 11px;
}
}
@media (max-width: 380px) {
.app-identity span {
display: none;
}
.gps-state {
min-width: 0;
}
.gps-center {
display: none;
}
.bottom-tabs button {
font-size: 10px;
} }
} }
+60 -133
View File
@@ -18,19 +18,20 @@ const lmeState = {
lastPosition: null, lastPosition: null,
lastWfsLookupAt: 0, lastWfsLookupAt: 0,
wfsLookupInFlight: false, wfsLookupInFlight: false,
duckDb: null, fileImportBound: false,
duckDbConnection: null resizeBound: false
}; };
window.lmeMap = { window.lmeMap = {
init, init,
search, search,
locateParcelArea, locateParcelByPoint,
exportCadastreView, exportCadastreView,
fitImported, fitImported,
clearImported, clearImported,
addProjectMarker, addProjectMarker,
enableDrawTools, enableDrawTools,
clearDrawings,
saveWorkspace, saveWorkspace,
loadWorkspace, loadWorkspace,
setBaseLayer, setBaseLayer,
@@ -41,7 +42,9 @@ window.lmeMap = {
centerOnGps, centerOnGps,
toggleTrail, toggleTrail,
setNativeGpsPosition, setNativeGpsPosition,
setGpsError setGpsError,
resize,
showInfo: setInfo
}; };
function init() { function init() {
@@ -56,11 +59,13 @@ function init() {
L.control.zoom({ position: "bottomright" }).addTo(lmeState.map); L.control.zoom({ position: "bottomright" }).addTo(lmeState.map);
lmeState.baseLayers.osm = L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", { lmeState.baseLayers.osm = L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
maxNativeZoom: 19,
maxZoom: 22, maxZoom: 22,
attribution: "&copy; OpenStreetMap contributors" attribution: "&copy; OpenStreetMap contributors"
}); });
lmeState.baseLayers.satellite = L.tileLayer("https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}", { lmeState.baseLayers.satellite = L.tileLayer("https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}", {
maxNativeZoom: 19,
maxZoom: 22, maxZoom: 22,
attribution: "Tiles &copy; Esri" attribution: "Tiles &copy; Esri"
}); });
@@ -74,6 +79,12 @@ function init() {
refreshCadastreLayer(); refreshCadastreLayer();
bindFileImport(); bindFileImport();
if (!lmeState.resizeBound) {
window.addEventListener("resize", resize);
window.addEventListener("orientationchange", resize);
lmeState.resizeBound = true;
}
lmeState.map.on("click", async event => { lmeState.map.on("click", async event => {
const info = await queryFeatureInfo(event.latlng); const info = await queryFeatureInfo(event.latlng);
if (info) { if (info) {
@@ -112,36 +123,30 @@ async function search(text) {
setInfo(place.display_name); setInfo(place.display_name);
} }
async function locateParcelArea(region, municipality, municipalityCode, sheet, parcel, label) { async function locateParcelByPoint(latitude, longitude, parcel, label) {
if (!sheet || !parcel || (!municipality && !municipalityCode)) { const lat = Number(latitude);
setInfo("Inserisci Comune o codice catastale, Foglio e Particella."); const lon = Number(longitude);
if (!Number.isFinite(lat) || !Number.isFinite(lon)) {
setInfo("Coordinate della particella non valide.");
return; return;
} }
setInfo("Cerco la particella nell'indice catastale..."); setInfo(`Recupero il confine ufficiale: ${label}`);
try { try {
const match = await findParcelIndexPoint(region, municipality, municipalityCode, sheet, parcel);
if (!match) {
const query = [municipality, region, "Italia"].filter(Boolean).join(", ");
await search(query);
setInfo("Particella non trovata nell'indice. Ho aperto il Comune: usa tap/GPS per interrogare AdE.");
return;
}
const meters = 8; const meters = 8;
const deltaLat = meters / 111320; const deltaLat = meters / 111320;
const deltaLon = meters / (111320 * Math.cos(match.lat * Math.PI / 180)); const deltaLon = meters / (111320 * Math.cos(lat * Math.PI / 180));
const geojson = await fetchOfficialParcelsByBbox(match.lat - deltaLat, match.lon - deltaLon, match.lat + deltaLat, match.lon + deltaLon); const geojson = await fetchOfficialParcelsByBbox(lat - deltaLat, lon - deltaLon, lat + deltaLat, lon + deltaLon);
const normalizedParcel = normalizeParcel(parcel); const normalizedParcel = normalizeParcel(parcel);
const feature = (geojson.features || []).find(item => { const feature = (geojson.features || []).find(item => {
const props = item.properties || {}; const props = item.properties || {};
return String(props.LABEL || "").trim().toUpperCase() === normalizedParcel.toUpperCase() return String(props.LABEL || "").trim().toUpperCase() === normalizedParcel.toUpperCase()
|| String(props.NATIONALCADASTRALREFERENCE || "").toUpperCase().endsWith(`.${normalizedParcel.toUpperCase()}`); || String(props.NATIONALCADASTRALREFERENCE || "").toUpperCase().endsWith(`.${normalizedParcel.toUpperCase()}`);
}) || (geojson.features || []).find(item => geometryContainsPoint(item.geometry, [match.lon, match.lat])) || geojson.features?.[0]; }) || (geojson.features || []).find(item => geometryContainsPoint(item.geometry, [lon, lat])) || geojson.features?.[0];
if (!feature) { if (!feature) {
lmeState.map.setView([match.lat, match.lon], 20); lmeState.map.setView([lat, lon], 20);
setInfo("Punto interno trovato, ma il WFS AdE non ha restituito il poligono in quel momento."); setInfo("Posizione trovata, ma il servizio WFS dell'Agenzia non ha restituito il confine. Riprova tra poco.");
return; return;
} }
@@ -151,125 +156,25 @@ async function locateParcelArea(region, municipality, municipalityCode, sheet, p
}).addTo(lmeState.currentParcelLayer); }).addTo(lmeState.currentParcelLayer);
fitLayer(layer); fitLayer(layer);
const ref = feature.properties?.NATIONALCADASTRALREFERENCE || feature.properties?.INSPIREID_LOCALID || `${match.comune}_${match.foglio}.${match.particella}`; const ref = feature.properties?.NATIONALCADASTRALREFERENCE || feature.properties?.INSPIREID_LOCALID || label;
setText("parcelState", `Particella selezionata: ${ref}`); setText("parcelState", `Particella selezionata: ${ref}`);
setInfo(`Trovata ${ref}. Ora puoi attivare il GPS e camminare dentro il confine evidenziato.`); setInfo(`Trovata ${ref}. Ora puoi attivare il GPS e camminare dentro il confine evidenziato.`);
} catch (error) { } catch (error) {
setInfo(`Ricerca catastale non completata: ${error.message}`); setInfo(`Servizio catastale temporaneamente non disponibile: ${error.message}`);
} }
} }
async function findParcelIndexPoint(region, municipality, municipalityCode, sheet, parcel) {
const conn = await getDuckDbConnection();
const code = (municipalityCode || "").trim().toUpperCase();
const name = (municipality || "").trim().toUpperCase().replaceAll("'", "''");
const normalizedSheet = normalizeSheet(sheet);
const normalizedParcel = normalizeParcel(parcel).replaceAll("'", "''");
let indexWhere = "";
if (code) {
indexWhere = `comune = '${code.replaceAll("'", "''")}'`;
} else {
indexWhere = `upper(DENOMINAZIONE_IT) = '${name}'`;
}
const indexUrl = "https://raw.githubusercontent.com/ondata/dati_catastali/main/S_0000_ITALIA/anagrafica/index.parquet";
const indexRows = await queryDuckDb(conn, `
SELECT comune, file, DENOMINAZIONE_IT
FROM '${indexUrl}'
WHERE ${indexWhere}
LIMIT 5
`);
if (!indexRows.length) {
return null;
}
const row = chooseMunicipalityRow(indexRows, region);
const dataUrl = `https://raw.githubusercontent.com/ondata/dati_catastali/main/S_0000_ITALIA/anagrafica/${row.file}`;
const parcelRows = await queryDuckDb(conn, `
SELECT INSPIREID_LOCALID, comune, foglio, particella, x, y
FROM '${dataUrl}'
WHERE comune = '${row.comune}'
AND foglio = '${normalizedSheet}'
AND upper(particella) = upper('${normalizedParcel}')
LIMIT 1
`);
if (!parcelRows.length) {
return null;
}
const parcelRow = parcelRows[0];
return {
inspireId: parcelRow.INSPIREID_LOCALID,
comune: parcelRow.comune,
foglio: parcelRow.foglio,
particella: parcelRow.particella,
lon: Number(parcelRow.x) / 1000000,
lat: Number(parcelRow.y) / 1000000
};
}
function chooseMunicipalityRow(rows, region) {
const wanted = (region || "").trim().toUpperCase();
if (!wanted) {
return rows[0];
}
return rows.find(row => String(row.file || "").toUpperCase().includes(wanted)) || rows[0];
}
async function getDuckDbConnection() {
if (lmeState.duckDbConnection) {
return lmeState.duckDbConnection;
}
const duckdb = await import("https://cdn.jsdelivr.net/npm/@duckdb/duckdb-wasm/+esm");
const bundles = duckdb.getJsDelivrBundles();
const bundle = await duckdb.selectBundle(bundles);
const workerUrl = URL.createObjectURL(new Blob([`importScripts("${bundle.mainWorker}");`], { type: "text/javascript" }));
const worker = new Worker(workerUrl);
const logger = new duckdb.ConsoleLogger();
const db = new duckdb.AsyncDuckDB(logger, worker);
await db.instantiate(bundle.mainModule, bundle.pthreadWorker);
URL.revokeObjectURL(workerUrl);
const conn = await db.connect();
try {
await conn.query("INSTALL httpfs; LOAD httpfs;");
} catch {
// Some DuckDB-WASM bundles already include HTTP support.
}
lmeState.duckDb = db;
lmeState.duckDbConnection = conn;
return conn;
}
async function queryDuckDb(conn, sql) {
const table = await conn.query(sql);
return table.toArray().map(row => {
if (typeof row.toJSON === "function") {
return row.toJSON();
}
const output = {};
for (const key of Object.keys(row)) {
output[key] = row[key];
}
return output;
});
}
function normalizeSheet(sheet) {
const value = String(sheet || "").trim().toUpperCase();
return /^\d+$/.test(value) ? value.padStart(4, "0") : value;
}
function normalizeParcel(parcel) { function normalizeParcel(parcel) {
return String(parcel || "").trim().toUpperCase(); return String(parcel || "").trim().toUpperCase();
} }
function resize() {
if (!lmeState.map) {
return;
}
window.setTimeout(() => lmeState.map.invalidateSize({ pan: false }), 50);
}
function exportCadastreView() { function exportCadastreView() {
const center = lmeState.map.getCenter(); const center = lmeState.map.getCenter();
const zoom = lmeState.map.getZoom(); const zoom = lmeState.map.getZoom();
@@ -280,12 +185,15 @@ function exportCadastreView() {
} }
function bindFileImport() { function bindFileImport() {
const input = document.getElementById("gisFileInput"); if (lmeState.fileImportBound) {
if (!input) { return;
}
document.addEventListener("change", async event => {
if (event.target?.id !== "gisFileInput") {
return; return;
} }
input.addEventListener("change", async event => {
const file = event.target.files?.[0]; const file = event.target.files?.[0];
if (!file) { if (!file) {
return; return;
@@ -308,6 +216,7 @@ function bindFileImport() {
setInfo(`File non leggibile: ${error.message}`); setInfo(`File non leggibile: ${error.message}`);
} }
}); });
lmeState.fileImportBound = true;
} }
async function readGisFile(file) { async function readGisFile(file) {
@@ -382,6 +291,22 @@ function enableDrawTools() {
setInfo("Disegno attivo: crea POI, linee e aree sulla mappa."); setInfo("Disegno attivo: crea POI, linee e aree sulla mappa.");
} }
function clearDrawings() {
const count = lmeState.drawings.getLayers().length;
if (!count) {
setInfo("Non ci sono disegni o POI da eliminare.");
return;
}
if (!window.confirm(`Eliminare ${count} disegni e POI dalla mappa?`)) {
return;
}
lmeState.drawings.clearLayers();
updateGpsInsideState();
setInfo("Disegni e POI eliminati dalla mappa.");
}
function saveWorkspace() { function saveWorkspace() {
const data = { const data = {
drawings: lmeState.drawings.toGeoJSON(), drawings: lmeState.drawings.toGeoJSON(),
@@ -596,6 +521,8 @@ async function updateOfficialParcelFromPoint(latitude, longitude, accuracy) {
const ref = feature.properties?.NATIONALCADASTRALREFERENCE || feature.properties?.INSPIREID_LOCALID || feature.properties?.LABEL || "particella AdE"; const ref = feature.properties?.NATIONALCADASTRALREFERENCE || feature.properties?.INSPIREID_LOCALID || feature.properties?.LABEL || "particella AdE";
setText("parcelState", `Dentro particella AdE: ${ref}`); setText("parcelState", `Dentro particella AdE: ${ref}`);
} catch (error) {
setInfo(`Aggiornamento particella GPS non disponibile: ${error.message}`);
} finally { } finally {
lmeState.wfsLookupInFlight = false; lmeState.wfsLookupInFlight = false;
} }
Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

@@ -0,0 +1,156 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
viewBox="0 0 600 60"
height="60"
width="600"
id="svg4225"
version="1.1"
inkscape:version="0.91 r13725"
sodipodi:docname="spritesheet.svg"
inkscape:export-filename="/home/fpuga/development/upstream/icarto.Leaflet.draw/src/images/spritesheet-2x.png"
inkscape:export-xdpi="90"
inkscape:export-ydpi="90">
<metadata
id="metadata4258">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title />
</cc:Work>
</rdf:RDF>
</metadata>
<defs
id="defs4256" />
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1920"
inkscape:window-height="1056"
id="namedview4254"
showgrid="false"
inkscape:zoom="1.3101852"
inkscape:cx="237.56928"
inkscape:cy="7.2419621"
inkscape:window-x="1920"
inkscape:window-y="24"
inkscape:window-maximized="1"
inkscape:current-layer="svg4225" />
<g
id="enabled"
style="fill:#464646;fill-opacity:1">
<g
id="polyline"
style="fill:#464646;fill-opacity:1">
<path
d="m 18,36 0,6 6,0 0,-6 -6,0 z m 4,4 -2,0 0,-2 2,0 0,2 z"
id="path4229"
inkscape:connector-curvature="0"
style="fill:#464646;fill-opacity:1" />
<path
d="m 36,18 0,6 6,0 0,-6 -6,0 z m 4,4 -2,0 0,-2 2,0 0,2 z"
id="path4231"
inkscape:connector-curvature="0"
style="fill:#464646;fill-opacity:1" />
<path
d="m 23.142,39.145 -2.285,-2.29 16,-15.998 2.285,2.285 z"
id="path4233"
inkscape:connector-curvature="0"
style="fill:#464646;fill-opacity:1" />
</g>
<path
id="polygon"
d="M 100,24.565 97.904,39.395 83.07,42 76,28.773 86.463,18 Z"
inkscape:connector-curvature="0"
style="fill:#464646;fill-opacity:1" />
<path
id="rectangle"
d="m 140,20 20,0 0,20 -20,0 z"
inkscape:connector-curvature="0"
style="fill:#464646;fill-opacity:1" />
<path
id="circle"
d="m 221,30 c 0,6.078 -4.926,11 -11,11 -6.074,0 -11,-4.922 -11,-11 0,-6.074 4.926,-11 11,-11 6.074,0 11,4.926 11,11 z"
inkscape:connector-curvature="0"
style="fill:#464646;fill-opacity:1" />
<path
id="marker"
d="m 270,19 c -4.971,0 -9,4.029 -9,9 0,4.971 5.001,12 9,14 4.001,-2 9,-9.029 9,-14 0,-4.971 -4.029,-9 -9,-9 z m 0,12.5 c -2.484,0 -4.5,-2.014 -4.5,-4.5 0,-2.484 2.016,-4.5 4.5,-4.5 2.485,0 4.5,2.016 4.5,4.5 0,2.486 -2.015,4.5 -4.5,4.5 z"
inkscape:connector-curvature="0"
style="fill:#464646;fill-opacity:1" />
<g
id="edit"
style="fill:#464646;fill-opacity:1">
<path
d="m 337,30.156 0,0.407 0,5.604 c 0,1.658 -1.344,3 -3,3 l -10,0 c -1.655,0 -3,-1.342 -3,-3 l 0,-10 c 0,-1.657 1.345,-3 3,-3 l 6.345,0 3.19,-3.17 -9.535,0 c -3.313,0 -6,2.687 -6,6 l 0,10 c 0,3.313 2.687,6 6,6 l 10,0 c 3.314,0 6,-2.687 6,-6 l 0,-8.809 -3,2.968"
id="path4240"
inkscape:connector-curvature="0"
style="fill:#464646;fill-opacity:1" />
<path
d="m 338.72,24.637 -8.892,8.892 -2.828,0 0,-2.829 8.89,-8.89 z"
id="path4242"
inkscape:connector-curvature="0"
style="fill:#464646;fill-opacity:1" />
<path
d="m 338.697,17.826 4,0 0,4 -4,0 z"
transform="matrix(-0.70698336,-0.70723018,0.70723018,-0.70698336,567.55917,274.78273)"
id="path4244"
inkscape:connector-curvature="0"
style="fill:#464646;fill-opacity:1" />
</g>
<g
id="remove"
style="fill:#464646;fill-opacity:1">
<path
d="m 381,42 18,0 0,-18 -18,0 0,18 z m 14,-16 2,0 0,14 -2,0 0,-14 z m -4,0 2,0 0,14 -2,0 0,-14 z m -4,0 2,0 0,14 -2,0 0,-14 z m -4,0 2,0 0,14 -2,0 0,-14 z"
id="path4247"
inkscape:connector-curvature="0"
style="fill:#464646;fill-opacity:1" />
<path
d="m 395,20 0,-4 -10,0 0,4 -6,0 0,2 22,0 0,-2 -6,0 z m -2,0 -6,0 0,-2 6,0 0,2 z"
id="path4249"
inkscape:connector-curvature="0"
style="fill:#464646;fill-opacity:1" />
</g>
</g>
<g
id="disabled"
transform="translate(120,0)"
style="fill:#bbbbbb">
<use
xlink:href="#edit"
id="edit-disabled"
x="0"
y="0"
width="100%"
height="100%" />
<use
xlink:href="#remove"
id="remove-disabled"
x="0"
y="0"
width="100%"
height="100%" />
</g>
<path
style="fill:none;stroke:#464646;stroke-width:2;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
id="circle-3"
d="m 581.65725,30 c 0,6.078 -4.926,11 -11,11 -6.074,0 -11,-4.922 -11,-11 0,-6.074 4.926,-11 11,-11 6.074,0 11,4.926 11,11 z"
inkscape:connector-curvature="0" />
</svg>

After

Width:  |  Height:  |  Size: 5.4 KiB