连接JSON来jQuery来添加标记在谷歌地图

Question

有人能帮助我，因为IM的情况stucked，我需要循环的JSON，并将其添加到谷歌地图作为标记，但它只返回null

有一种能够自动连接该到JSON，因为即时通讯规划有一个网格，并将其设置为style="display: none;"隐藏它，然后取出并在网格

这里读出的值是我的javascript

<script type="text/javascript"> 
     var geocoder; 
     var map; 
     function initialize() { 
      var minZoomLevel = 4; 
      var zooms = 7; 
      geocoder = new google.maps.Geocoder(); 
      map = new google.maps.Map(document.getElementById('map'), { 
       zoom: minZoomLevel, 
       center: new google.maps.LatLng(38.50, -90.50), 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      }); 

      // Bounds for North America 
      var strictBounds = new google.maps.LatLngBounds(
    new google.maps.LatLng(15.70, -160.50), 
    new google.maps.LatLng(68.85, -55.90) 
    ); 

      // Listen for the dragend event 
      google.maps.event.addListener(map, 'dragend', function() { 
       if (strictBounds.contains(map.getCenter())) return; 

       // We're out of bounds - Move the map back within the bounds 

       var c = map.getCenter(), 
     x = c.lng(), 
     y = c.lat(), 
     maxX = strictBounds.getNorthEast().lng(), 
     maxY = strictBounds.getNorthEast().lat(), 
     minX = strictBounds.getSouthWest().lng(), 
     minY = strictBounds.getSouthWest().lat(); 

       if (x < minX) x = minX; 
       if (x > maxX) x = maxX; 
       if (y < minY) y = minY; 
       if (y > maxY) y = maxY; 

       map.setCenter(new google.maps.LatLng(y, x)); 
      }); 


      // Limit the zoom level 
      google.maps.event.addListener(map, 'zoom_changed', function() { 
       if (map.getZoom() < minZoomLevel) map.setZoom(minZoomLevel); 
      }); 
     } 

     function codeAddress() { 
      var address = $('#workerGrid').find("input[name=shiftDay]"); 
      alert(address); 
      $.each(address, function() { 

       address.each(function (e) { 
        e.preventDefault(); 

        geocoder.geocode({ 'address': address }, function (results, status) { 
         if (status == google.maps.GeocoderStatus.OK) { 

          map.setCenter(results[0].geometry.location); 
          var marker = new google.maps.Marker({ 
           map: map, 
           position: results[0].geometry.location, 
           title: address 

          }); 
          if (results[0].geometry.viewport) { 
           map.setZoom(10); 
          } 

         } 
         else { 
          alert("Geocode was not successful for the following reason: " + status); 
         } 
        }); 
       }); 
      }); 
     } 

     window.onload = function() { 
      initialize(); 
      codeAddress(); 
     } 

    </script> 

这里是我的Json：

public JsonResult LoadWorkerList(string search) 
     { 
      var workerList = new List<Worker_Address>(); 

      // check if search string has value 
      // retrieve list of workers filtered by search criteria 
      var list = (from a in db.Worker_Address 
         where a.LogicalDelete == false 
         select a).ToList(); 



      List<WorkerAddressInfo> wlist = new List<WorkerAddressInfo>(); 
      foreach (var row in list) 
      { 
       WorkerAddressInfo ci = new WorkerAddressInfo 
       { 
        ID = row.ID, 
        Worker_ID = row.WorkerID, 
        AddressLine1 = row.Address_Line1 + " " + row.Address_Line2+ " " +row.City + " "+ GetLookupDisplayValById(row.State_LookID), 
        //AddressLine2 = row.Address_Line2, 
        //City = row.City, 
        //State = GetLookupDisplayValById(row.State_LookID), 
        LogicalDelete = row.LogicalDelete 

       }; 
       wlist.Add(ci); 
      } 

       var wolist = (from a in wlist 
           where a.LogicalDelete == false 
           select a).ToList(); 
       wlist = wolist; 



      return Json(wlist.ToList().OrderBy(p => p.AddressLine1), JsonRequestBehavior.AllowGet); 
     } 

希望有人能帮助我

Answer 1

我相信你可以做的周围用另一种方式： 让您的地图，请在配置对象，并添加标记的阵中还有。

从我得到了什么工作，上周（谷歌地图V3）小例子：

proj.root.gmap3({ 
    marker: { 
     values: markersList, // arrGeodesic 
     options: { 
      icon: new google.maps.MarkerImage(cfg.markers.custom), 
      draggable: false 
     } 
    } 
); 

我的标记阵列中充满这样的：

// 2.10 Get markers from ajax request 
// @param (lat): float value of latitude 
// @param (lng): float value of longitude 
// @doc (ajax data): http://encosia.com/3-mistakes-to-avoid-when-using-jquery-with-aspnet-ajax/ 
// @doc (JSON.stringify): https://github.com/douglascrockford/JSON-js 
ajaxGetMarkers: function (lat, lng) { 
    var proj = this, 
     json = {}; 

    if (lat && lng) { 
     // param mapping 
     json.country = proj.countries.val(); 
     json.postcode = proj.postcode.val(); 
     json.latitude = lat.toFixed(12); 
     json.longitude = lng.toFixed(12); 

     // ajax request 
     $.ajax({ 
      url: cfg.ajaxUrls.locations, // '/GMAPS/Locations.aspx/GetLocations' 
      data: JSON.stringify(json) 
     }).done(function (data) { 
      if (data && data.d) { 
       proj.root.gmap3("clear", "markers"); 
       proj.loadMarkers(data.d.Locationslist); 
      } 
     }); 
    } 
}, 

希望它没有复杂的事情，但是这是我如何使LngLat对象脱离您所拥有的数据......在我的示例中，它具有国家和邮政编码...我确信您可以实现与您的数据相同...

// 2.9 Load map 
// @param (query): array [country, postcode] 
loadMap: function (query) { 
    var proj = this, 
     options, loc, geocoder; 

    // init 
    if (query.length) { 
     // 2.9.1 geocode 
     geocoder = new google.maps.Geocoder(); 

     // 2.9.1 set address 
     geocoder.geocode({ address: query.join(" ") }, function (result, status) { 
      if (status === google.maps.GeocoderStatus.OK) { 
       // center map 
       loc = result[0].geometry.location; 
       options = $.extend({}, cfg.mapOptions, { center: loc }); 

       // set map options & markers 
       proj.initMap(options); 
       proj.ajaxGetMarkers(loc.lat(), loc.lng()); 
      } 
     }); 
    } 
},