2015-07-13 66 views
0

我是一個Javascript初學者,我試圖在谷歌地圖上創建標記。所以首先我從我裂開來獲得lattitude和longlitude值的數據庫獲取GPS座標,那麼我他們在C#中增加了2個獨立的列表框稱爲lstBoxLatGPS和lstBoxLongGPS現在在javascript中的谷歌地圖上顯示標記

foreach (string item in GPSLatList) 
    { 
     lstBoxLatGPS.Items.Add(item); 
    } 
foreach (string item in GPSLongList) 
    { 
     lstBoxLongGPS.Items.Add(item); 
    } 

在Javascript我想借此在列表框的項目和創建地圖上的標記我有2個功能:

 function GetLatValues() 
     { 
      var arrValues= new Array(); 
      var listBox = document.getElementById("<%=lstBoxLatGPS.ClientID%>"); 
      for (var i = 0; i < listBox.options.length; i++) 
      {arrValues[i]= listbox.options[i].text } 
      return (arrValues); 
     } 
     function GetLongValues() 
     { 
      var arrValues= new Array(); 
      var listBox = document.getElementById("%=lstBoxLongGPS.ClientID%>"); 
      for (var i = 0; i < listBox.options.length; i++) 
      {arrValues[i]= listbox.options[i].text } 
      return (arrValues); 
     } 

然後到陣列添加到所做的標記:

 function initialize() 
     { 
      var mapCanvas = document.getElementById('map-canvas'); 
      var mapOptions = 
      { 
       center: new google.maps.LatLng(-28.4792811, 24.6722268), 
       zoom: 6, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      } 
      var map = new google.maps.Map(mapCanvas, mapOptions); 
      map.set('styles', [ 
    { 
     "featureType": "landscape", 
     "stylers": [ 
     { "color": "#c9d7bb" } 
     ] 
    }, { 
     "featureType": "administrative.province", 
     "elementType": "labels.text", 
     "stylers": [ 
     { "visibility": "on" }, 
     { "color": "#ffc23d" } 
     ] 
    }, { 
     "featureType": "poi.attraction", 
     "stylers": [ 
     { "visibility": "on" }, 
     { "color": "#9be586" } 
     ] 
    }, { 
     "featureType": "administrative.province", 
     "elementType": "geometry", 
     "stylers": [ 
     { "visibility": "on" }, 
     { "color": "#000000" }, 
     { "weight": 3.2 } 
     ] 
    } 
      ]); 

      var GPSLatArray = new Array(); 
      var GPSLongArray = new Array(); 
      GPSLatArray = GetLatValues(); 
      GPSLongArray = GetLongValues(); 

      for (var i = 0; i < GPSLatArray.length; i++) 
      { 
       var marker = new google.maps.Marker({position: GPSLatArray[i],GPSLongArray[i] }); 
       marker.setMap(map); 
      } 
     } 
     google.maps.event.addDomListener(window, 'load', initialize); 

當應該顯示地圖時,它只是空白,根本不顯示地圖。

回答

0

我用Artem.Google包創建地圖,現在它的工作。

1

你需要在你的aspx頁面添加一個div來顯示地圖。

<div class="img-thumbnail" id="map-canvas" style="width: 369px; height: 289px;"></div> 
+0

是的,我已經對不起,

它顯示地圖,直到我試圖添加標記。 – user5110647