У меня есть элемент пользовательского интерфейса jquery autocomplete, который показывает список железнодорожных станций.Когда пользователь выбирает станцию из списка автозаполнения, функция должна возвращать набор широты / координат из БД и повторно центрировать карту по этим кординатам?
Кто-нибудь знает, где я неправильно пишу код в этом коде?
// make a json request to get the map data from the Map action
$(function() {
$.getJSON("/Home/Map", initialise);
});
var infowindow = new google.maps.InfoWindow({content: "EMPTY"});
function initialise(mapData) {
var latlng = new google.maps.LatLng(54.466667, -3.233333);
var myOptions = {
zoom: 5,
center: latlng,
mapTypeId: google.maps.MapTypeId.TERRAIN,
mapTypeControlOptions: {
style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR
},
scaleControl: true,
streetViewControl: false
};
var map = new google.maps.Map($("#map")[0],
myOptions);
$.each(mapData, function (i, location) {
setupLocationMarker(map, location);
});
//Autocomplete
$(function () {
$("#tags").autocomplete({
source: "/Home/StationsList",
minLength: 2,
select: function (event, ui) {
jQuery.ajax({
url: "Home/GetStationLatLong/" + ui.item.value,
dataType: "json",
success: function (data) {
map.setCenter(new google.maps.latLng(data.latitude, data.longitude));
}
});
}
});
});
}
function setupLocationMarker(map, location) {
var latlng = new google.maps.LatLng(location.Latitude, location.Longitude);
var marker = new google.maps.Marker({
position: latlng,
map: map,
title: location.Name
});
google.maps.event.addListener(marker, 'click', function () {
infowindow.setContent('<h2>' + location.Name + '</h2>');
infowindow.open(map, marker);
$("#info").text(location.Name);
});
}
JSON, возвращенный с сервера по запросу "Home / GetStationLatLong", выглядит следующим образом
[{"latitude":53.66314,"longitude":-1.48149}]