我做了一个包含Google地图的php页面。我的目标是在用户单击地图时添加一个标记,并将标记的坐标显示在文本框中。这是我的JavaScript:
<script type="text/javascript">
function tampil_peta()
{
var div_peta = document.getElementById('kanvas');
var tengah = new google.maps.LatLng(-8.801502,115.174794);
var options =
{
center : tengah,
zoom : 14,
mapTypeId : google.maps.MapTypeId.ROADMAP
}
//membuat objek peta Google Maps
var google_map = new google.maps.Map(div_peta,options);
google.maps.event.addListener(google_map, "click", function (e)
{
var latitude = e.latLng.lat();
var longitude = e.latLng.lng();
var location = new google.maps.LatLng(latitude,longitude);
document.getElementById('lattext').value = latitude;
document.getElementById('lngtext').value = longitude;
});
}
function add_marker(location)
{
var marker = new google.maps.Marker({
position : location,
title : "Titik A",
draggable : false,
map : google_map
});
}
</script>
这是表单的代码,其中包含2个文本框,应自动使用标记的纬度和经度数据填充该文本框:
<form id="koordinat_a" nama="koordinat_a" method="POST" action="">
Latitude : <input type="text" class="form-control" id="lattext" name="lattext" placeholder=" Latitude" style="width:310px">
Longitude : <input type="text" class="form-control" id="lngtext" name="lngtext" placeholder=" Longitude" style="width:310px">
<button type="button" id ="pilih" name="pilih" class="btn btn-primary" onClick="return select_titik(document.getElementById('lattext').value,document.getElementById('lngtext').value)">Choose</button>
</form>
完美地显示在文本框中的单击坐标的纬度和经度。我的问题是只要点击地图就添加标记。
有没有人可以帮助我?您的帮助将非常有帮助。谢谢...
最佳答案
您有一个随时可以使用的名为add_marker
的函数。调用它并传递您创建的位置对象。
尝试:
<script type="text/javascript">
var google_map;
function tampil_peta()
{
var div_peta = document.getElementById('kanvas');
var tengah = new google.maps.LatLng(-8.801502,115.174794);
var options =
{
center : tengah,
zoom : 14,
mapTypeId : google.maps.MapTypeId.ROADMAP
}
//membuat objek peta Google Maps
google_map = new google.maps.Map(div_peta,options);
google.maps.event.addListener(google_map, "click", function (e)
{
var latitude = e.latLng.lat();
var longitude = e.latLng.lng();
var location = new google.maps.LatLng(latitude,longitude);
document.getElementById('lattext').value = latitude;
document.getElementById('lngtext').value = longitude;
add_marker(location);
});
}
function add_marker(location)
{
var marker = new google.maps.Marker({
position : location,
title : "Titik A",
draggable : false,
map : google_map
});
}
</script>