2013-02-12 59 views
0

我想實現谷歌地圖jQuery的版本即GMAP3顯示標記的代碼背後

我打電話從下面的C#代碼

編輯腳本:

void drawMap(List<beatWithCurrentStatus> mapList, bool IsMap) 
{  
    ScriptManager.RegisterStartupScript(this, this.GetType(), "functiona", "designMap(" + ConvertToJSON(mapList) + ");", true); 
} 

以下是我的腳本

function designMap(JSONData) { 
var ll = []; 
var address = []; 

for (var i = 0; i < JSONData.length; i++) { 
    //  ll[i] = '{latLng:\'[' + data[i].lastlatitude + ',' + data[i].lastlongitude + ']\',data:\'' + data[i].lastaddress + '\'}'; 
    ll[i] = { latLng: [JSONData[i].lastlatitude, JSONData[i].lastlongitude], data: JSONData[i].lastaddress }; 
} 
alert(ll); 
$('#mapDiv').gmap3({ 
    map: 
{ 
    options: { 
     center: [JSONData[5].latitude, JSONData[5].longitude], 
     zoom: 7, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     mapTypeControl: true, 
     mapTypeControlOptions: { 
      style: google.maps.MapTypeControlStyle.DROPDOWN_MENU 
     }, 
     navigationControl: true, 
     scrollwheel: true, 
     streetViewControl: true 
    } 

}, 
    marker: { 
     values: ll, 
     options: { 
      draggable: false 
     } 
    } 

}); 
} 

編輯: 這是我得到的JSON從ConvertToJSON(MAPLIST)函數

[{"number":1,"accountID":"primecomforts","deviceID":"911227400024706","place":"Noida Region","status":1,"statusString":null,"requestTimestamp":"\/Date(1346265000000)\/","mobileNumber":null,"latitude":28.535516,"longitude":77.391026,"distance":13.64,"summary":null,"url":"Image/default-location-image.png","charrgingStatus":0,"lasttimestamp":"\/Date(1360653137000)\/","laststatusCode":61715,"lastlatitude":47.787773,"lastlongitude":-2.449187,"lastspeedKPH":0,"lastheading":0,"lastaddress":"D151,56140 Bohal,,France","lastodometerKM":null,"stringDateTime":null,"lastVDOP":"1","lastCharrgingStatus":0,"smsType":null,"pointsource":0,"sno":null,"cellTowerId":null,"data":null,"latLng":null},{"number":2,"accountID":"primecomforts","deviceID":"911227400024706","place":"Delhi Region","status":1,"statusString":null,"requestTimestamp":"\/Date(1346265000000)\/","mobileNumber":null,"latitude":28.635308,"longitude":77.22496,"distance":13.64,"summary":null,"url":"Image/default-location-image.png","charrgingStatus":0,"lasttimestamp":"\/Date(-62135596800000)\/","laststatusCode":0,"lastlatitude":0,"lastlongitude":0,"lastspeedKPH":0,"lastheading":0,"lastaddress":null,"lastodometerKM":null,"stringDateTime":null,"lastVDOP":null,"lastCharrgingStatus":0,"smsType":null,"pointsource":0,"sno":null,"cellTowerId":null,"data":null,"latLng":null},{"number":3,"accountID":"primecomforts","deviceID":"911227400024706","place":"Noida","status":1,"statusString":null,"requestTimestamp":"\/Date(1347474600000)\/","mobileNumber":null,"latitude":28.535516,"longitude":77.391026,"distance":13.64,"summary":null,"url":"Image/default-location-image.png","charrgingStatus":0,"lasttimestamp":"\/Date(-62135596800000)\/","laststatusCode":0,"lastlatitude":0,"lastlongitude":0,"lastspeedKPH":0,"lastheading":0,"lastaddress":null,"lastodometerKM":null,"stringDateTime":null,"lastVDOP":null,"lastCharrgingStatus":0,"smsType":null,"pointsource":0,"sno":null,"cellTowerId":null,"data":null,"latLng":null},{"number":4,"accountID":"primecomforts","deviceID":"911227400023872","place":"State Highway 264, Maharashtra, India","status":1,"statusString":null,"requestTimestamp":"\/Date(1347906600000)\/","mobileNumber":null,"latitude":20.593684,"longitude":78.96288,"distance":1,"summary":null,"url":"Image/default-location-image.png","charrgingStatus":0,"lasttimestamp":"\/Date(1349955039000)\/","laststatusCode":61715,"lastlatitude":27.22787287,"lastlongitude":77.99955692,"lastspeedKPH":0,"lastheading":0,"lastaddress":"Agra, Uttar Pradesh,India","lastodometerKM":null,"stringDateTime":null,"lastVDOP":"21","lastCharrgingStatus":0,"smsType":null,"pointsource":0,"sno":null,"cellTowerId":null,"data":null,"latLng":null},{"number":5,"accountID":"primecomforts","deviceID":"911227400023872","place":"State Highway 264, Maharashtra, India","status":1,"statusString":null,"requestTimestamp":"\/Date(1347993000000)\/","mobileNumber":null,"latitude":20.593685,"longitude":78.96288,"distance":1,"summary":null,"url":"Image/default-location-image.png","charrgingStatus":0,"lasttimestamp":"\/Date(-62135596800000)\/","laststatusCode":0,"lastlatitude":0,"lastlongitude":0,"lastspeedKPH":0,"lastheading":0,"lastaddress":null,"lastodometerKM":null,"stringDateTime":null,"lastVDOP":null,"lastCharrgingStatus":0,"smsType":null,"pointsource":0,"sno":null,"cellTowerId":null,"data":null,"latLng":null},{"number":6,"accountID":"primecomforts","deviceID":"911227400023872","place":"233-277324079","status":1,"statusString":null,"requestTimestamp":"\/Date(1348425000000)\/","mobileNumber":null,"latitude":20.593684,"longitude":78.96288,"distance":1,"summary":null,"url":"Image/default-location-image.png","charrgingStatus":0,"lasttimestamp":"\/Date(-62135596800000)\/","laststatusCode":0,"lastlatitude":0,"lastlongitude":0,"lastspeedKPH":0,"lastheading":0,"lastaddress":null,"lastodometerKM":null,"stringDateTime":null,"lastVDOP":null,"lastCharrgingStatus":0,"smsType":null,"pointsource":0,"sno":null,"cellTowerId":null,"data":null,"latLng":null},{"number":7,"accountID":"primecomforts","deviceID":"911227400077050","place":"B-89,TEACHERS COLONY ,SAMAYPUR BADLI,DELHI","status":1,"statusString":null,"requestTimestamp":"\/Date(1348597800000)\/","mobileNumber":null,"latitude":20.593684,"longitude":78.96288,"distance":1,"summary":null,"url":"Image/default-location-image.png","charrgingStatus":0,"lasttimestamp":"\/Date(1360642473000)\/","laststatusCode":61715,"lastlatitude":28.63164532,"lastlongitude":77.34991008,"lastspeedKPH":0,"lastheading":-42.464634,"lastaddress":"National Highway 24 Bypass, Vaishali, Ghaziabad, Ghaziabad, Ghaziabad, Uttar Pradesh, 201010, India","lastodometerKM":null,"stringDateTime":null,"lastVDOP":"62","lastCharrgingStatus":0,"smsType":null,"pointsource":0,"sno":null,"cellTowerId":null,"data":null,"latLng":null}] 

EDIT2:

string ConvertToJSON(List<beatWithCurrentStatus> receivePoints) 
{ 
    JavaScriptSerializer jss1 = new JavaScriptSerializer(); 
    return jss1.Serialize(receivePoints); 
} 

我應該如何通過在地圖上標記???請幫忙..!我試過所有的方法,但都沒有工作。但是,如果我硬編碼的值,它顯示在地圖上。

請幫助.. :(

回答

0
  1. ll的項目是不是對象,您創建的字符串(不能像一個對象來訪問) 用這個代替:

    ll[i] = {latLng:[JSONData[i].lat,JSONData[i].lng],data:JSONData[i].address};
  2. 直接將ll傳遞給標記的values-property,而不是作爲數組的一個項目(ll已經是數組)

 marker: { 
     values: ll, 
     options: { 
      draggable: false 
     } 
    }

這些都是2次必要的修改,如果它仍然不工作,你必須張貼至少JSONData

+0

不工作:(...更新我的問題 – writeToBhuwan 2013-02-12 09:49:23

+0

它突然開始工作...結算緩存工作..^_ ^感謝您的幫助..! :) – writeToBhuwan 2013-02-12 10:29:16