You are not logged in.
Would appreciate some pointers in where I am going wrong .Scenario is I have a client with an auto complete text box , a button and gmap. When an address is filled in the text box and the button is clicked a web service is invoked which returns formatted markers with data for infowindow as a Json string.
Client side code
function AddMarkers(markersFromSP) {
$("#map_canvas").gmap3(
{ action: 'addMarkers',
markers: markersFromSP,
marker: {
options: {
draggable: false
},
events: {
mouseover: function (marker, event, data) {
var map = $(this).gmap3('get'),
infowindow = $(this).gmap3({ action: 'get', name: 'infowindow' });
if (infowindow) {
infowindow.open(map, marker);
infowindow.setContent(data);
} else {
$(this).gmap3({ action: 'addinfowindow', anchor: marker, options: { content: data} });
}
},
mouseout: function () {
var infowindow = $(this).gmap3({ action: 'get', name: 'infowindow' });
if (infowindow) {
infowindow.close();
}
}
}
}
}
);
}JSON From Fiddler
Data=[{'lat':-31.9528536, 'lng':115.8573389,'data':'This is the entered text'}]I am trying it with just one marker atm
Offline
response is invalid json, validate it with jsonlint.com
Offline
Thanks for replying. I did as you suggested and now am returning the following Data=[{"lat":47.7510741, "lng":-120.7401386,"data":"This is the entered text"}] which is reported as valid JSON by jsonlint . Am I missing something obvious ?
Offline
I don't understand the "Data=" that you are showing as part of response. Response from server has to be just the array.
Post a link to a live page and provide a test address that can be entered
Offline
Unfortunately I dont have a live server. But essentially the web service which is very simplistic is given below . The Data= that you refer to is because I have defined a data contract and am returning a custom object with a property named Data which contains the markers.
[DataContract]
public class Marker
{
[DataMember]
public string Data { get; set; }
}
[ServiceContract]
public interface IATMLocator
{
[OperationContract]
[WebInvoke(Method = "GET", BodyStyle = WebMessageBodyStyle.Bare, RequestFormat = WebMessageFormat.Json, ResponseFormat = WebMessageFormat.Json)]
Marker getMarkers(double Lat, double Long);
}
public Marker getMarkers(double Lat, double Long)
{
Marker markers = new Marker();
markers.Data= @"[{""lat"":" + Lat + @", ""lng"":" + Long +@",""data"":""This is the entered text""}]" ;
return markers;
}On the client side, I have tried the following approaches
1. Used ".Data" to isolate just the data values and using eval/parse to convert the string to JSON.
2. Used the data returned directly
Neither of them work, there are no errors but the map just sits there, no markers appear.
Offline
I tried modifying the web service to just return a string array. The function now returns a valid JSON array without the "Data =" . There is no error, but still the map doesnt do anything just sits there. If I replace the JSON variable with hardcoded string, it works !!
public List <string> getMarkers(double Lat, double Long)
{
List<string> markers = new List<string>();
string marker1 = @"{""lat"":48.8620722, ""lng"":2.352047, ""data"":""This is the entered text""}";
string marker2 = @"{""lat"": 46.59433, ""lng"":0.342236, ""data"":""This is the entered text""}";
markers.Add( marker1 ) ;
markers.Add(marker2);
return markers;
}
function AddMarkers(markersFromSP) {
alert(markersFromSP);
$("#map_canvas").gmap3(
{ action: 'init' },
{ action: 'clear', name: 'marker' },
{ action: 'addMarkers',
markers: [markersFromSP ], //[{"lat": 46.59433, "lng": 0.342236,"data":"This is the entered text"}],
marker: {
options: {
draggable: false
},
events: {
mouseover: function (marker, event, data) {
var map = $(this).gmap3('get'),
infowindow = $(this).gmap3({ action: 'get', name: 'infowindow' });
if (infowindow) {
infowindow.open(map, marker);
infowindow.setContent(data);
} else {
$(this).gmap3({ action: 'addinfowindow', anchor: marker, options: { content: data} });
}
},
mouseout: function () {
var infowindow = $(this).gmap3({ action: 'get', name: 'infowindow' });
if (infowindow) {
infowindow.close();
}
}
}
}
}
);
}
Offline
Can anyone assist or is it a dead end ?
Offline
if markersFromSP is the array, just put without the brackets :
markers: markersFromSP,
Offline
Well, thanks for the reply. If I try to remove the square brackets, gmap3.min.js throws an object javascript expected error. I am debugging the app in VS 2010.
Offline
Should be better to have an online test
Offline
also use a console like Firebug, or chrome console to inspect the ajax request
Offline