我不太清楚你的问题,但这里有一个示例地图,你可以在上面拖动&放置位置项目
和
同时使用“地点搜索”框。
HTML格式
:
<div id="map-canvas"></div>
<input id="pac-input" class="controls" type="text" placeholder="Search Box">
<ul>
<li>New York, USA</li>
<li>Shanghai, PRC</li>
<li>London, UK</li>
<li>Paris, France</li>
<li>Sydney, Australia</li>
</ul>
JavaScript
(拖放):
$("ul li").each(function () {
$(this).draggable({
cursor: 'move',
revert: true
});
});
$('#map-canvas').droppable({
drop: function (event, ui) {
var el = ui.draggable;
codeAddress(el.text());
el.remove();
}
});
JavaScript
(地点搜索):
function codeAddress(address) {
geocoder.geocode({
'address': address
}, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
下面是一个工作演示。
JSFiddle demo