根据经纬度标记点并获得相应的地图并显示在div中

博主第二发作业~

一切从简

这里主要用了百度地图的API感兴趣的各位可以去搜一下，里面有很实用的地图功能

在1.5以上的API是需要ak密钥的

效果图，

HTML

function getCoords(){
		if(window.navigator.geolocation){
			 window.navigator.geolocation.getCurrentPosition(showPosition,showError,{timeout:50000});
			}else{
					alert('不再支持获取位置');
				}
		}
	function showPosition(p){
		alert("经纬度等于：" +p.coords.longitude + " : " +p.coords.latitude);
		// 百度地图API功能
	var map = new BMap.Map("map");    // 创建Map实例
	map.centerAndZoom(new BMap.Point(p.coords.longitude, p.coords.latitude), 15);  // 初始化地图,设置中心点坐标和地图级别
	//添加地图类型控件
	map.addControl(new BMap.MapTypeControl({
		mapTypes:[
            BMAP_NORMAL_MAP,
            BMAP_HYBRID_MAP
        ]}));
        //创建小狐狸
	var pt = new BMap.Point(p.coords.longitude, p.coords.latitude);
	var myIcon = new BMap.Icon("http://lbsyun.baidu.com/jsdemo/img/fox.gif", new BMap.Size(300,157));
	var marker2 = new BMap.Marker(pt,{icon:myIcon});  // 创建标注
	map.addOverlay(marker2);              // 将标注添加到地图中
//			document.getElementById("p").append("经纬度等于：" + 
//				p.coords.longitude + "" +p.coords.latitude);
		}
	function showError(e){
			if(e.code == e.PERMISSION_DENIED){
					alert('已拒绝');
				}
			if(e.code == e.TIMEOUT){
					alert('超时')
				}
		}