anas/divan
1
0
Fork 0
Code Issues 12 Pull Requests Actions Packages Projects Releases Wiki Activity

@233 filter poets on map by century

Browse Source
This commit is contained in:
Hamid Reza Mohammadi 2021-11-03 19:59:31 +03:30
parent 80f234c6b1
commit 152079f157
2 changed files with 59 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

70
GanjooRazor/Pages/Map.cshtml
View File

@ -1,4 +1,4 @@
@page
@page
@model GanjooRazor.Pages.MapModel
@{
Layout = null;
@ -16,25 +16,23 @@
background-color: #c5e8ff;
}
</style>
</head>
<body>
<div id="map" style="height: 600px"></div>
<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="~/js/leaflet.js"></script>
<script src="~/js/leaflet-providers.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/OverlappingMarkerSpiderfier-Leaflet/0.2.6/oms.min.js"></script>
<script>
var poetsgroups = [];
var poetGroupIndex = 0;
var map;
var oms;
var layerGroup;
var myGeoJSONPath = '/json/world.json';
var myCustomStyle = {
stroke: true,
weight: 1,
color: '#300',
}
$.getJSON(myGeoJSONPath, function (data) {
var map = L.map('map').setView([34, 53.6880], 5);
@ -47,26 +45,60 @@
L.tileLayer.provider('Stamen.Watercolor').addTo(map);
var oms = new OverlappingMarkerSpiderfier(map, { keepSpiderfied: false });
oms = new OverlappingMarkerSpiderfier(map, { keepSpiderfied: false });
var poetsgroups = @(Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model.PoetGroupsWithBirthPlaces, Newtonsoft.Json.Formatting.Indented)));
poetsgroups = @(Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model.PoetGroupsWithBirthPlaces, Newtonsoft.Json.Formatting.Indented)));
layerGroup = L.layerGroup().addTo(map);
var poets = poetsgroups[0].Poets;
for (var i = 0; i < poets.length; i++) {
var poet = poets[i];
var icon = L.icon({
iconUrl: poet.ImageUrl,
iconSize: [82, 100],
iconAnchor: [82, 100],
popupAnchor: [0, -28]
});
iconSize: [82, 100],
iconAnchor: [82, 100],
popupAnchor: [0, -28]
});
var marker = L.marker([poet.BirthPlaceLatitude, poet.BirthPlaceLongitude], { icon: icon });
marker = L.marker([poet.BirthPlaceLatitude, poet.BirthPlaceLongitude], { icon: icon });
marker.addTo(map);
oms.addMarker(marker);
marker.addTo(layerGroup);
oms.addMarker(marker);
}
})
});
function onSelectedCenturyChanged() {
var index = document.getElementById('century').value;
layerGroup.clearLayers();
var poets = poetsgroups[index].Poets;
for (var i = 0; i < poets.length; i++) {
var poet = poets[i];
var icon = L.icon({
iconUrl: poet.ImageUrl,
iconSize: [82, 100],
iconAnchor: [82, 100],
popupAnchor: [0, -28]
});
var marker = L.marker([poet.BirthPlaceLatitude, poet.BirthPlaceLongitude], { icon: icon });
marker.addTo(layerGroup);
oms.addMarker(marker);
}
}
</script>
</head>
<body>
<div id="map" style="height: 600px"></div>
<select name="century" id="century" onchange="onSelectedCenturyChanged()">
@for (int i = 0; i < Model.PoetGroupsWithBirthPlaces.Count; i++)
{
<option value="@i">@Model.PoetGroupsWithBirthPlaces[i].Name</option>
}
</select>
</body>
</html>

16
GanjooRazor/Pages/Map.cshtml.cs
View File

@ -50,9 +50,15 @@ namespace GanjooRazor.Pages
);
foreach (var poetGroup in poetGroups)
{
if (poetGroup.Id == 0)
continue;
poetGroup.Poets = poetGroup.Poets.Where(p => !string.IsNullOrEmpty(p.BirthPlace)).ToList();
if (poetGroup.Poets.Count > 0)
{
foreach (var poet in poetGroup.Poets)
{
poet.ImageUrl = $"{APIRoot.InternetUrl}{poet.ImageUrl}";
}
PoetGroupsWithBirthPlaces.Add(poetGroup);
}
}
@ -69,19 +75,13 @@ namespace GanjooRazor.Pages
/// </summary>
private readonly HttpClient _httpClient;
/// <summary>
/// memory cache
/// </summary>
private readonly IMemoryCache _memoryCache;
public MapModel(IConfiguration configuration,
HttpClient httpClient,
IMemoryCache memoryCache
public MapModel(
HttpClient httpClient
)
{
_httpClient = httpClient;
_memoryCache = memoryCache;
}
}
}