3

我使用该程序的主要目标是生成一个显示特定建筑物位置的谷歌地图。

由于谷歌的限制原因,我已经为我在 MS SQL 数据库(它是一个房地产网站)中分析的所有建筑物生成并存储了所有纬度和经度。每次选择一栋建筑物时,我都会检索其相应的纬度和经度并将其存储在两个 asp:Label 中。我在 Javascript 中使用脚本来处理通过两个 asp:Label 传递的纬度和经度。我的问题是,由于某种原因,LatLng 函数似乎不起作用,我的地图没有显示它们应该显示的坐标。我想我可能对 LatLng 期望的变量类型有疑问。我已经尝试过传递的默认字符串并将变量转换为真实类型。这是脚本。任何帮助或建议表示赞赏:

  <script type="text/javascript">
      (function () {

          // Defining global variables
          var map, geocoder, marker, infowindow, propertyaddress, selectedbuilding, maplatitude, maplongitude, buildinglatlng, latlng, myOptions;

          function InitializeMap() {
              //propertyaddress = '400 Alton Road, Miami Beach, FL 33139';
              propertyaddress = document.getElementById('<%=lblselectedHiddenBuildingAddress.ClientID%>').innerText;
              selectedbuilding = document.getElementById('<%=lblMainBuilding.ClientID%>').innerText;

              //maplatitude = parseFloat(document.getElementById('<%=lblCoordinateLatitud.ClientID%>').innerText);
              //maplongitude = parseFloat(document.getElementById('<%=lblCoordinateLongitud.ClientID%>').innerText);
              maplatitude = document.getElementById('<%=lblCoordinateLatitud.ClientID%>').innerText;
              maplongitude = document.getElementById('<%=lblCoordinateLongitud.ClientID%>').innerText;
              buildinglatlng = new google.maps.LatLng(maplatitude, maplongitude);

              //window.alert("Processed propertyaddress");

              //latlng = new google.maps.LatLng(25.76804, -80.132743);

              // Creating an object literal containing the properties
              // we want to pass to the map
               myOptions = {
                  zoom: 15,
                  center: new google.maps.LatLng(maplatitude, maplongitude),
                  //center: buildinglatlng,
                  mapTypeId: google.maps.MapTypeId.ROADMAP,
                  scaleControl: true,
                  streetViewControl: true,
                  disableDefaultUI: true,
                  mapTypeControl: true,
                  mapTypeControlOptions: {
                      style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
                      position: google.maps.ControlPosition.TOP_LEFT,
                      mapTypeIds: [
                google.maps.MapTypeId.ROADMAP,
                google.maps.MapTypeId.TERRAIN,
                google.maps.MapTypeId.SATELLITE
            ]
                  },
                  navigationControl: true,
                  navigationControlOptions: {
                      position: google.maps.ControlPosition.TOP_LEFT
                  }
              };
              // Creating the map
              map = new google.maps.Map(document.getElementById("map"), myOptions);
          }
          window.onload = InitializeMap;
      })();
</script>
#

添加了有效但使用地理编码器的代码

#

例如,以下代码可以完美运行,但它使用了地理编码器。传递变量不是问题。LatLng 以及它对传递的变量的作用有些奇怪。不过,它确实获得了所有重要位置的值。

  <script type="text/javascript">
      (function () {

          // Defining global variables
          var map, geocoder, marker, infowindow, propertyaddress, selectedbuilding, maplatitude, maplongitude, buildinglatlng, latlng, myOptions;

          function InitializeMap() {
              //propertyaddress = '400 Alton Road, Miami Beach, FL 33139';
              propertyaddress = document.getElementById('<%=lblselectedHiddenBuildingAddress.ClientID%>').innerText;
              selectedbuilding = document.getElementById('<%=lblMainBuilding.ClientID%>').innerText;

              //maplatitude = parseFloat(document.getElementById('<%=lblCoordinateLatitud.ClientID%>').innerText);
              //maplongitude = parseFloat(document.getElementById('<%=lblCoordinateLongitud.ClientID%>').innerText);
              maplatitude = document.getElementById('<%=lblCoordinateLatitud.ClientID%>').innerText;
              maplongitude = document.getElementById('<%=lblCoordinateLongitud.ClientID%>').innerText;
              buildinglatlng = new google.maps.LatLng(maplatitude, maplongitude);

              //window.alert("Processed propertyaddress");

              //latlng = new google.maps.LatLng(25.76804, -80.132743);

              if (!geocoder) {
                  geocoder = new google.maps.Geocoder();
              }

              // Creating a GeocoderRequest object
              var geocoderRequest = {
                  address: propertyaddress
              }


              geocoder.geocode(geocoderRequest, function (results, status) {
                  // Check if status is OK before proceeding
                  if (status == google.maps.GeocoderStatus.OK) {
                      // Center the map on the returned location
                      //map.setCenter(results[0].geometry.location);
                      // Creating an object literal containing the properties
                      // we want to pass to the map
                      myOptions = {
                          zoom: 15,
                          //center: new google.maps.LatLng(maplatitude, maplongitude),
                          center: results[0].geometry.location,
                          mapTypeId: google.maps.MapTypeId.ROADMAP,
                          scaleControl: true,
                          streetViewControl: true,
                          disableDefaultUI: true,
                          mapTypeControl: true,
                          mapTypeControlOptions: {
                              style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
                              position: google.maps.ControlPosition.TOP_LEFT,
                              mapTypeIds: [
                                google.maps.MapTypeId.ROADMAP,
                                google.maps.MapTypeId.TERRAIN,
                                google.maps.MapTypeId.SATELLITE
                                ]
                          },
                          navigationControl: true,
                          navigationControlOptions: {
                              position: google.maps.ControlPosition.TOP_LEFT
                          }
                      };
                      // Creating the map
                      map = new google.maps.Map(document.getElementById("map"), myOptions); 

                      // Check to see if we've already got a Marker object
                      if (!marker) {
                          // Creating a new marker and adding it to the map
                          marker = new google.maps.Marker({
                              map: map,
                              animation: google.maps.Animation.DROP
                          });
                          google.maps.event.addListener(marker, 'click', toggleBounce);
                      }
                      // Setting the position of the marker to the returned location
                      marker.setPosition(results[0].geometry.location);
                      // Check to see if we've already got an InfoWindow object

                      google.maps.event.addListener(marker, 'click', function () {
                          if (!infowindow) {
                              // Creating a new InfoWindow
                              infowindow = new google.maps.InfoWindow();
                          }
                          // Creating the content of the InfoWindow to the address
                          // and the returned position
                          var content = '<h2>' + selectedbuilding + '</h2>';
                          //content += 'Lat: ' + results[0].geometry.location.lat() + '<br />';
                          //content += 'Lng: ' + results[0].geometry.location.lng();
                          // Adding the content to the InfoWindow
                          infowindow.setContent(content);
                          // Opening the InfoWindow
                          infowindow.open(map, marker);
                      });

                      // Triggering the click event
                      google.maps.event.trigger(marker, 'click');
                  };
              });



          }

          function toggleBounce() {
              if (marker.getAnimation() != null) {
                  marker.setAnimation(null);
              } else {
                  marker.setAnimation(google.maps.Animation.BOUNCE);
              }
          }

          window.onload = InitializeMap;
      })();
</script>

问候, 埃利亚斯

4

2 回答 2

0

您是否已验证maplatitudemaplongitude包含您期望的值(例如,使用调试器)?

预期位置与地图上显示的实际位置之间是否存在关联(例如,如果建筑物位于 N21.7684,而标记位于 N21.0000,则可能已丢失小数位)。

于 2012-11-29T14:05:31.280 回答
0

我刚刚从 Google 找到了一篇帖子,他们更改了 LatLng 函数,现在您必须使用 NUMBER() 转换这两个参数。他们声称人们将字符串传递给 LatLng 函数并产生了不可预测的结果。所以我在我的新代码中添加了更改......只花了三天时间就找到了这个修复程序!!!!:-(我想知道为什么没有更多的人遇到这个。这是代码:

  <script type="text/javascript">
      (function () {

          // Defining global variables
          var map, geocoder, marker, infowindow, propertyaddress, selectedbuilding, maplatitude, maplongitude, buildinglatlng, latlng, myOptions;

          function InitializeMap() {
              //propertyaddress = '400 Alton Road, Miami Beach, FL 33139';
              propertyaddress = document.getElementById('<%=lblselectedHiddenBuildingAddress.ClientID%>').innerText;
              selectedbuilding = document.getElementById('<%=lblMainBuilding.ClientID%>').innerText;

              //maplatitude = parseFloat(document.getElementById('<%=lblCoordinateLatitud.ClientID%>').innerText);
              //maplongitude = parseFloat(document.getElementById('<%=lblCoordinateLongitud.ClientID%>').innerText);
              maplatitude = document.getElementById('<%=lblCoordinateLatitud.ClientID%>').innerText;
              maplongitude = document.getElementById('<%=lblCoordinateLongitud.ClientID%>').innerText;
              buildinglatlng = new google.maps.LatLng(Number(maplatitude), Number(maplongitude));

              //window.alert("Processed propertyaddress");

                      myOptions = {
                          zoom: 15,
                          center: new google.maps.LatLng(Number(maplatitude), Number(maplongitude)),
                          mapTypeId: google.maps.MapTypeId.ROADMAP,
                          scaleControl: true,
                          streetViewControl: true,
                          disableDefaultUI: true,
                          mapTypeControl: true,
                          mapTypeControlOptions: {
                              style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
                              position: google.maps.ControlPosition.TOP_LEFT,
                              mapTypeIds: [
                                google.maps.MapTypeId.ROADMAP,
                                google.maps.MapTypeId.TERRAIN,
                                google.maps.MapTypeId.SATELLITE
                                ]
                          },
                          navigationControl: true,
                          navigationControlOptions: {
                              position: google.maps.ControlPosition.TOP_LEFT
                          }
                      };
                      // Creating the map
                      map = new google.maps.Map(document.getElementById("map"), myOptions); 

                      // Check to see if we've already got a Marker object
                      if (!marker) {
                          // Creating a new marker and adding it to the map
                          marker = new google.maps.Marker({
                              map: map,
                              animation: google.maps.Animation.DROP
                          });
                          google.maps.event.addListener(marker, 'click', toggleBounce);
                      }
                      // Setting the position of the marker to the returned location

                      marker.setPosition(buildinglatlng);

                      // Check to see if we've already got an InfoWindow object

                      google.maps.event.addListener(marker, 'click', function () {
                          if (!infowindow) {
                              // Creating a new InfoWindow
                              infowindow = new google.maps.InfoWindow();
                          }
                          // Creating the content of the InfoWindow to the address
                          // and the returned position
                          var content = '<h2>' + selectedbuilding + '</h2>';

                          // Adding the content to the InfoWindow
                          infowindow.setContent(content);
                          // Opening the InfoWindow
                          infowindow.open(map, marker);
                      });

                      // Triggering the click event
                      google.maps.event.trigger(marker, 'click');

          }

          function toggleBounce() {
              if (marker.getAnimation() != null) {
                  marker.setAnimation(null);
              } else {
                  marker.setAnimation(google.maps.Animation.BOUNCE);
              }
          }

          window.onload = InitializeMap;
      })();
</script>
于 2012-11-29T18:19:27.137 回答