Fixed Marker in der Mitte und Karte ziehen, um lat, long zu bekommen
Ich bin ein Beispiel Karte zeigt die aktuelle Position mit einem Klick auf eine Schaltfläche zeigt lat, lang, und Marker auf der Karte ist ziehbar, um lat, lang zu aktualisieren, aber ich brauche eine kleine Änderung auf der Karte
Ich möchte, dass die Markierung in der Mitte der Karte fixiert und die Karte ziehbar ist, um eine neue Lat zu erhalten, lange wieJSFIDDLE link.
Mein Code ist:
var map = null;
var marker;
function showlocation() {
// One-shot position request.
navigator.geolocation.getCurrentPosition(callback);
}
function callback(position) {
if (marker != null) {
marker.setMap(null);
}
var geocoder = new google.maps.Geocoder();
var lat = position.coords.latitude;
var lon = position.coords.longitude;
document.getElementById('default_latitude').value = lat;
document.getElementById('default_longitude').value = lon;
var latLong = new google.maps.LatLng(lat, lon);
marker = new google.maps.Marker({
position: latLong,
draggable: true
});
marker.setMap(map);
map.setZoom(16);
map.setCenter(marker.getPosition());
google.maps.event.addListener(marker, 'dragend', function() {
geocoder.geocode({
'latLng': marker.getPosition()
}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
if (results[0]) {
$('#default_latitude').val(marker.getPosition().lat());
$('#default_longitude').val(marker.getPosition().lng());
}
}
});
});
}
google.maps.event.addDomListener(window, 'load', initMap);
function initMap() {
var mapOptions = {
center: new google.maps.LatLng(0, 0),
zoom: 1,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map-canvas"),
mapOptions);
}
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js"></script>
<input type="button" class="btn pull-right map-btn" value="btn " onclick="javascript:showlocation()" />
<div id="map-canvas" style="height: 300px"></div>
<input type="text" id="default_latitude" placeholder="Latitude" />
<input type="text" id="default_longitude" placeholder="Longitude" />