Sunday, May 19, 2024
 Popular · Latest · Hot · Upcoming
197
rated 0 times [  199] [ 2]  / answers: 1 / hits: 36959  / 11 Years ago, fri, october 11, 2013, 12:00:00

To be more precise, what I try to accomplish is that while I Drag a Google Map there's a Google Maps Marker that stays fixed at the center of the map at all times.
This will improve User experience in my opinion, This is how I'm doing it now:



var map, marker, options;

options = {
center: new google.maps.LatLng(latitude, longitude),
zoom: 15,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: false,
overviewMapControl: false,
zoomControl: true,
draggable: true
};

map = new google.maps.Map(mapContainer, options);

marker = new google.maps.Marker({
position: new google.maps.LatLng(latitude, longitude),
map: map,
animation: google.maps.Animation.DROP
});

//This line is what makes the Marker stick to the center of the map
marker.bindTo('position', map, 'center');


The problem I have with the code above is that.. When I drag the map underneath the Marker it's not smooth enough, ie. the Marker makes a wierd jump from the 'last' center to the 'new' center when dragging ends. (this is more noticeable on mobile devices), Therefore what I need is that the Marker is Really permanently fixed to the Center of its Map.



Is there a way to get this done? (I think I've seen this in a web-site once)



Let me know If you guys can help me.



Thank you.


More From » google-maps

 Answers
29

A different approach, that did not use a real google.maps.Marker:



after the map has been initialized, inject a div into the map-container, give it a className(e.g. centerMarker), the further things will be done via CSS:



.centerMarker{
position:absolute;
/*url of the marker*/
background:url(http://maps.gstatic.com/mapfiles/markers2/marker.png) no-repeat;
/*center the marker*/
top:50%;left:50%;

z-index:1;
/*fix offset when needed*/
margin-left:-10px;
margin-top:-34px;
/*size of the image*/
height:34px;
width:20px;

cursor:pointer;
}


Demo: http://jsfiddle.net/doktormolle/jcHqt/


[#75047] Friday, October 11, 2013, 11 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
domeniccolti

Total Points: 276
Total Questions: 98
Total Answers: 93

Location: India
Member since Fri, May 13, 2022
2 Years ago
domeniccolti questions
Mon, Oct 18, 21, 00:00, 3 Years ago
Thu, Oct 14, 21, 00:00, 3 Years ago
Thu, Jul 15, 21, 00:00, 3 Years ago
Sat, Oct 24, 20, 00:00, 4 Years ago
Thu, Sep 3, 20, 00:00, 4 Years ago
;