Google map api
Author chenbin
Date 12/12
Email bingoPureLife@gmail.com
标记在地图上的位置 并且获取当前位置的经纬度
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps Demo</title>
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
<script src="{vifnn::STATICS}/jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="/tpl/static/artDialog/jquery.artDialog.js?skin=default"></script>
<script src="/tpl/static/artDialog/plugins/iframeTools.js"></script>
<script type="text/javascript">
var infowindow,marker;
var geocoder = new google.maps.Geocoder();
function initialize() {
//var point = new google.maps.LatLng(18.252847, 109.511909);
var point; // 地图中心
if(getLatLngFromParent() != ''){
point = getLatLngFromParent();
loadMap(point);
}else{
if(navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
point = new google.maps.LatLng(
position.coords.latitude,
position.coords.longitude
);
loadMap(point);
});
} else {
// Browser doesn't support Geolocation
handleNoGeolocation();
}
}
}
function loadMap(point){
var myOptions = {
zoom: 15, // 缩放级别
center: point,
mapTypeId: google.maps.MapTypeId.ROADMAP, // 显示普通的街道地图
mapTypeControl: false, // 地图类型控件
overviewMapControl: false, // 总览图控件
scaleControl: false, // 比例控件
streetViewControl: false // 街景视图
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
//添加地图标记
marker = new google.maps.Marker({
position: point,
map: map
});
marker.setDraggable(true); // 设置可拖拽
//初始化信息窗口
infowindow = new google.maps.InfoWindow({
content: "",
size: new google.maps.Size(50,50)
});
//添加拖动监听事件
google.maps.event.addListener(marker, 'dragend', function(){
showAddress(map, marker);
});
//添加点击标记监听事件
google.maps.event.addListener(marker, 'click', function(){
showAddress(map, marker);
});
//添加点击监听事件
google.maps.event.addListener(map, 'click', function(e) {
clickMou(map,marker,e.latLng);
});
showAddress(map,marker);
}
function handleNoGeolocation() {
//长沙公司地址
point = new google.maps.LatLng(28.127907999999998, 112.98059999999998);
loadMap(point);
}
function showAddress(map, marker)
{
var latlng = marker.getPosition();
geocoder = new google.maps.Geocoder();
//根据经纬度获取地址信息
geocoder.geocode({'latLng': latlng}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
if (results[1]) {
var address = results[1].formatted_address + "<br />";
address = results[0].formatted_address + "<br />";
address += "纬度：" + latlng.lat() + "<br />";
address += "经度：" + latlng.lng();
infowindow.setContent(address);
infowindow.open(map, marker);
transfer(latlng.lat(),latlng.lng());
}
} else {
alert("Geocoder failed due to: " + status);
}
});
}
function clickMou(map, marker,location)
{
marker.setPosition(location)
//根据经纬度获取地址信息
geocoder.geocode({'latLng': location}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
if (results[1]) {
var address = results[1].formatted_address + "<br />";
address = results[0].formatted_address + "<br />";
address += "纬度：" + location.lat() + "<br />";
address += "经度：" + location.lng();
infowindow.setContent(address);
infowindow.open(map, marker);
transfer(location.lat(),location.lng());
}
} else {
alert("Geocoder failed due to: " + status);
}
});
}
function transfer(lat,lng){
var origin = artDialog.open.origin;
var longitudeinput = origin.document.getElementById('longitude');
var latitudeinput = origin.document.getElementById('latitude');
longitudeinput.value = lat;
latitudeinput.value = lng;
//art.dialog.close();
}
function getLatLngFromParent(){
if (art.dialog.data('longitude')) {
point = new google.maps.LatLng(
art.dialog.data('longitude'),
art.dialog.data('latitude')
);
return point;
};
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style=" 600px; height: 400px"></div>
</body>
</html>