基于谷歌api的地图
    Html
    Css
    Js

    
                        
* {
	padding:0;
	margin:0;
	list-style:none;
	text-decoration:none;
	box-sizing:border-box;
}
html {
	background-color:#F2F3F7;
	width:100%;
	height:100%;
}
body {
	width:100%;
}
#wrap_wrap {
	width:100%;
	height:100%;
	position:fixed;
	top:0;
	left:0;
	z-index:999;
	background:#eee;
}
.wrap_mapBtn {
	width:100%;
}
.wrap_mapBtn .mapBtn {
	width:80%;
	height:3rem;
	line-height:3rem;
	font-size:1.2rem;
	text-align:center;
	border-radius:1.5rem;
	background:#FF9800;
	margin:0 auto;
	color:#fff;
}
.map_text {
	width:13.6rem;
	height:2.9866rem;
	color:#9E9E9E;
	position:absolute;
	left:5.125rem;
	font-size:0.7466rem;
}

                        
↑上面代码改变,会自动显示代码结果 jQuery调用版本:1.11.3
 立即下载

基于谷歌api的地图

使用方法

引入:

http://ditu.google.cn/maps/api/js?v=3.exp&sensor=false&libraries=panoramio&key=谷歌KEY
https://code.jquery.com/jquery-1.12.1.min.js

拖动地图,获取地图中间这点的地理位置,国内外都可以用

变量:tx代表初始经度,ty代表初始化纬度,uzoom代表回调地理位置区域级别

getxy()函数中ajax回调后的data,包含地址详细信息

0