这里有新鲜出炉的精品教程,程序狗速度看过来!
Google 公司(中文译名:谷歌),是一家美国的跨国科技企业,致力于互联网搜索、云计算、广告技术等领域,开发并提供大量基于互联网的产品与服务,其主要利润来自于 AdWords 等广告服务。
这篇文章主要分享一段了 Google Maps API 地图应用示例,做项目中经常会使用到,非常的简单,有需要的朋友可以参考下
效果(新版 Firefox 中测试):
代码:
- <!DOCTYPE>
- <html>
- <head>
- <meta http-equiv="content-type" content="text/html;charset=utf-8">
- <title>
- Google Map
- </title>
- <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">
- </script>
- <script type="text/javascript">
- function init() {
- // 获取当前位置
- navigator.geolocation.getCurrentPosition(function(position) {
- var coords = position.coords;
- // 设定地图参数,将当前位置的经纬度设置为中心点
- var latlng = new google.maps.LatLng(coords.latitude, coords.longitude);
- var myOptions = {
- // 放大倍数
- zoom: 14,
- // 标注坐标
- center: latlng,
- // 地图类型
- mapTypeId: google.maps.MapTypeId.ROADMAP
- };
- var map1;
- // 显示地图
- map1 = new google.maps.Map(document.getElementById('map'), myOptions);
- // 创建标记
- var marker = new google.maps.Marker({
- position: latlng,
- map: map1
- });
- // 设定标注窗口,附上注释文字
- var infowindow = new google.maps.InfoWindow({
- content: "当前位置"
- });
- // 打开标注窗口
- infowindow.open(map1, marker);
- });
- }
- </script>
- </head>
- <body onload="init()">
- <div id="map">
- </div>
- </body>
- </html>
Google Maps JavaScript API v3(参考文档):https://developers.google.com/maps/documentation/javascript/basics
百度地图 API 的参考文档:http://developer.baidu.com/map/jsmobile.htm
来源: http://www.phperz.com/article/17/0716/274482.html