function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
NM AdminNM Admin 

Marker animation is not working..

Hello,

I have developed the code in which I have to do something like this:
I have two different divs on a vf page. In the first div I am showing locations on the map and in second div I have list of locations.
Now I want to highlight/Bounce the corresponding marker on the hover/click of the item from the list of locations.

here is the code I am using
  
<apex:pageBlockTable value="{!lstLocations}" var="item" >
         <apex:column >
                  <apex:variable id="timepass" var="index" value="{!index+1}" />
                  <div data-value="{!index}" id="dividx" class="notmap">{!item.name}</div>
          </apex:column>
 </apex:pageBlockTable>


$(document).ready(function() {
         $(".notmap").hover(function() {
                 highlightMarker($(this).data('value'));
          }, function() {
                  stopHighlightMarker($(this).data('value'));
          });
});


function stopHighlightMarker(i) {
      if(markers[i].getAnimation() !== null) {
             markers[i].setAnimation(null);
       }
 }
                
 function highlightMarker(i) {
        if(markers[i].getAnimation() !== null) {
               markers[i].setAnimation(null);
         } else {
                markers[i].setAnimation(google.maps.Animation.BOUNCE);
          }
 }

I referred this:  http://jsfiddle.net/2gz7h123/275/

Its very similar to my lgic but don't understand why the marker is not getting bounced/highlighted.

Please let me know if I missed anything in this code.​


Welcome to your sugestions!

Thanks,
Nilesh