任意拖动marker

最新推荐文章于 2024-10-04 06:11:34 发布

田猿笔记

最新推荐文章于 2024-10-04 06:11:34 发布

阅读量978

点赞数

文章标签： function input xhtml html button div

本文链接：https://blog.csdn.net/canduecho/article/details/2933118

版权

任意拖动marker,

注意在添加marker 时，要

var marker = new GMarker(center, {draggable: true});

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:v="urn:schemas-microsoft-com:vml">
<head>
    <title>Untitled Page</title>
    <script src="http://maps.google.com/maps?file=api&v=2&
key=ABQIA" type="text/javascript"></script>
    <script type="text/javascript">
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.addControl (new GSmallMapControl());
map.addControl(new GMapTypeControl());
var center = new GLatLng(-22.98699983834975, -43.210344314575195);
map.setCenter(center, 11);
map.setMapType(G_SATELLITE_MAP);
geocoder = new GClientGeocoder();

var marker = new GMarker(center, {draggable: true});
map.addOverlay(marker);
document.getElementById("lat").value = center.lat();
document.getElementById("lng").value = center.lng ();

geocoder = new GClientGeocoder();

GEvent.addListener(marker, "dragend", function() {
var point =marker.getPoint();
map.panTo(point);
document.getElementById("lat").value = point.lat();
document.getElementById("lng").value = point.lng();
});

GEvent.addListener(map, "moveend", function() {
map.clearOverlays();
var center = map.getCenter();
var marker = new GMarker(center, {draggable: true});
map.addOverlay(marker);
document.getElementById ("lat").value = center.lat();
document.getElementById("lng").value = center.lng();

function showAddress(address) {
var map = new GMap2(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
if (geocoder) {
geocoder.getLatLng (
address,
function(point) {
if (!point) {
alert(address + " city not found !");
}
else {
document.getElementById("lat").value = point.lat();
document.getElementById("lng").value = point.lng();
map.clearOverlays()
map.setCenter(point, 14);
var marker = new GMarker(point, {draggable: true});
map.addOverlay(marker);

GEvent.addListener(marker, "dragend", function() {
var pt =marker.getPoint();
map.panTo(pt);
document.getElementById("lat").value = pt.lat();
document.getElementById("lng").value = pt.lng();
});

GEvent.addListener(marker, "dragend", function() {
var pt =marker.getPoint();
map.panTo(pt);
document.getElementById("lat").value = pt.lat();
document.getElementById("lng").value = pt.lng();
});
});
}}
);
}}

    </script>
</head>
<body οnlοad="load('map')" οnunlοad="GUnload()" style="
                background-color:Transparent">
                  <input type="text" size="60" name="address" id="addr"
        value="India" />
        <input type="button" value="Go!"
    οnclick="showAddress(document.getElementById('addr').value); return false"/>
    <br />
     <input id="lat" type="text" />
      <input id="lng" type="text" />
    <div id="map" style="width: 500px; height: 300px"></div>
</body>
</html>