Fatal编程技术网

Google maps 谷歌地图融入网站

google-maps

Google maps 谷歌地图融入网站,google-maps,Google Maps,我想做一个web应用程序，将获得2个位置和他们的postalcode，并在谷歌地图上显示结果。例如，我选择了两个城市或一个国家，并根据我的观点用彩色线显示路线图。最好的地方是谷歌地图API V3文档-我推荐V3，因为它们不再支持V2 主要文件： 样本： 简单说明示例： 基本上，你需要有两个坐标，尽管你可以使用街道地址，并将其传递给API，然后它会发送到google，得到结果，然后绘制出来。容易极了 将此代码另存为location.html <!DOCTYPE html> <h

我想做一个web应用程序，将获得2个位置和他们的postalcode，并在谷歌地图上显示结果。例如，我选择了两个城市或一个国家，并根据我的观点用彩色线显示路线图。

最好的地方是谷歌地图API V3文档-我推荐V3，因为它们不再支持V2

主要文件：

样本：

简单说明示例：

基本上，你需要有两个坐标，尽管你可以使用街道地址，并将其传递给API，然后它会发送到google，得到结果，然后绘制出来。容易极了

将此代码另存为location.html

<!DOCTYPE html> 
<html> 
  <head> 
    <title>Google Maps JavaScript API v3 Example: Map Geolocation</title> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
    <meta charset="UTF-8"> 
    <link href="map.css" rel="stylesheet" type="text/css"> 
<!--
Include the maps javascript with sensor=true because this code is using a
sensor (a GPS locator) to determine the user's location.
See: http://code.google.com/apis/maps/documentation/javascript/basics.html#SpecifyingSensor
--> 
<script type="text/javascript"
    src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 

<script type="text/javascript"> 
var siberia = new google.maps.LatLng(37.625364,-122.423905);

function initialize() {
  var myOptions = {
    zoom:19,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  var infowindow = new google.maps.InfoWindow({
          map: map,
          position: siberia,
          content: 'Location found using HTML5.'
        });

  var marker =  new google.maps.Marker({
    position: siberia,
    map: map,
    title: "omt"
  });
  map.setCenter(siberia);

}
  google.maps.event.addDomListener(window, 'load', initialize);
    </script> 
  </head> 
  <body> 
    <div id="map_canvas"></div> 
  </body> 
</html>
我非常感谢你的回答。如果你给我发送了一个代码，我将在我的代码中进行初始化，并根据我的要求进行修改。我很高兴看到你的最后一个链接，它与我的问题完全相关，但我正在添加更多的位置，并将其附加到我的应用程序中。最好的考虑还有一件事，地图尺寸太大了，我们需要一个3×3英寸的地图尺寸，你可以把它放在一个div中，设置了它的样式宽度和高度。如。 
html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}

#map_canvas {
  height: 100%;
}

@media print {
  html, body {
    height: auto;
  }

#map_canvas {
height: 650px;
}
}