使用经纬度坐标显示位置 - 谷歌地图

13

我该如何通过JavaScript输入一组坐标并在Google地图上显示位置。这需要完全通过JavaScript实现(即:没有用户界面)。

非常感谢任何帮助。


我曾经问过同样的问题,他们回答说-->https://dev59.com/Pl_Va4cB1Zd3GeqPPANz - Tassisto
@SamekaTV - 那个链接是相反的目标(点击地图,获取经度/纬度)。这个问题是已知经度/纬度,如何显示该位置的地图。(或者可能 shahmeer 是在问相关问题,如何在已经打开的地图上显示该位置的标记。) - ToolmakerSteve
2个回答

11
注意:如果您已经有了纬度/经度,请参见Alteveer的答案

您需要使用地理位置服务来获取纬度/经度信息。谷歌地图内置了一个地理定位服务: http://code.google.com/apis/maps/documentation/javascript/services.html#Geocoding

以下是如何使用它的示例:

<!-- Placeholder for the Google Map -->
<div id="map" style="height: 512px;">
  <noscript>
    <!-- http://code.google.com/apis/maps/documentation/staticmaps/ -->
    <img src="http://maps.google.com/maps/api/staticmap?center=1%20infinite%20loop%20cupertino%20ca%2095014&amp;zoom=16&amp;size=512x512&amp;maptype=roadmap&amp;sensor=false" />
  </noscript>
</div>

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">

// Define the address we want to map.
var address = "1 infinite loop cupertino ca 95014";

// Create a new Geocoder
var geocoder = new google.maps.Geocoder();

// Locate the address using the Geocoder.
geocoder.geocode( { "address": address }, function(results, status) {

  // If the Geocoding was successful
  if (status == google.maps.GeocoderStatus.OK) {

    // Create a Google Map at the latitude/longitude returned by the Geocoder.
    var myOptions = {
      zoom: 16,
      center: results[0].geometry.location,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map"), myOptions);

    // Add a marker at the address.
    var marker = new google.maps.Marker({
      map: map,
      position: results[0].geometry.location
    });

  } else {
    try {
      console.error("Geocode was not successful for the following reason: " + status);
    } catch(e) {}
  }
});
</script>

1
这个回答与所问的问题不同。所问的问题是:给定纬度/经度,显示地图或在地图上显示标记。而这个答案是:给定地址,在地图上显示标记。 如果已经有了纬度/经度,则可以查看“// Add a marker at the address.”下面的行以显示标记。或者如果想要打开一个新地图,请参见Alteveer的答案 - ToolmakerSteve
那是个很好的观点,史蒂夫。(哎呀!)我在这个答案上添加了一个注释。 - Jim

2

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接