Witam chcę wykorzystać mapę Open Street Map w ASP .NET MVC udało mi się ją dodać i wyświelić dodałem też punkty (marki) tak jak w linku: http://leafletjs.com/examples/quick-start.html
Natomiast mam problem z dynamicznym wygenerowaniem punktów, próbowałem wiele rzeczy np. zapisywać dane z ViewBag do zmiennej, dodawałem apostrofy, nawiasy, cudzysłowy i dalej nic tylko wpisywanie gotowej wartości dodawało punkty na mapie czyli tak jakby nie chciał przyjąć wartości ze zmiennej.
Patrzyłem jakie wartości przyjmuje ViewBag w kontrolerze i były poprawne bo zwracał współrzędne geograficzne np. 51.505 i -0.09 czyli to co jest w przykładzie Leaflet
Mapa oraz punkty w JavaScript (fragment widoku)
<div id="mapid" style="width: 800px; height: 600px; border:5px solid black; align-content:center"></div>
<script src="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"></script>
<script>
// var mymap = L.map('mapid').setView([@Html.Raw(Json.Encode(ViewBag.StacjaX as double?)), @Html.Raw(Json.Encode(ViewBag.StacjaY as double?))], 13);
var mymap = L.map('mapid').setView(['@ViewBag.StacjaX', '@ViewBag.StacjaY'], 13);
L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpandmbXliNDBjZWd2M2x6bDk3c2ZtOTkifQ._QA7i5Mpkd_m30IGElHziw', {
maxZoom: 18,
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
'<a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
id: 'mapbox.streets'
}).addTo(mymap);
var someNumericValueX = '@ViewBag.StacjaX';
var someNumericValueY = '@ViewBag.StacjaY';
//marker.setLatLng(['@(ViewBag.StacjaX)"), parseFloat("@(ViewBag.StacjaY)']);
L.marker([parseFloat(someNumericValueX),parseFloat(someNumericValueY)]).addTo(mymap)
.bindPopup("<b>Hello world!</b><br />Punkt na mapie").openPopup();
/*L.marker([51.75, 19.55]).addTo(mymap)
.bindPopup("<b>Hello world 2!</b><br />Punkt na mapie").openPopup();*/
L.circle([51.208, 19.11], 500, {
color: 'red',
fillColor: '#f03',
fillOpacity: 0.5
}).addTo(mymap).bindPopup("I am a circle.");
L.polygon([
[51.509, 19.5],
[51.503, 19.5],
[51.51, 19.38]
]).addTo(mymap).bindPopup("I am a polygon.");
var popup = L.popup();
function onMapClick(e) {
popup
.setLatLng(e.latlng)
.setContent("Współrzędne: " + e.latlng.toString())
.openOn(mymap);
}
mymap.on('click', onMapClick);
</script>
ViewBag w kontrolerze
ViewBag.StacjaX = (double)db.Stacje.FirstOrDefault(s => s.Nazwa == "Warszawa Centralna").Szerokosc_Geo;
ViewBag.StacjaY = (double)db.Stacje.FirstOrDefault(s => s.Nazwa == "Warszawa Centralna").Dlugosc_Geo;
ViewBag.Test = "test";
Chciałbym dowiedzieć się jak przekazać do markera i dodać do mapy punkty przechowywane w ViewBag a jeśli biblioteka na to nie pozwala to czy istnieje jakiś lepszy sposób, żeby dynamicznie tworzyć punkty na mapie OSM w ASP .NET.
Z góry dzięki :)