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
Janno RipJanno Rip 

Load / reRender Image on mouseover <apex:mapMarker>

Hello,

I have a Visualforce which displays records inside a googlemap and also as a table. What I want to achieve is the following:

Whenever a user hovers over a record in the table it should get highlighted in the googlemap. I am almost there but the "reRendering/reloading" of the map is where I am stuck right now. This is what I got so far: 
               <apex:form>
                    <apex:outputPanel >
                        <apex:actionSupport event="onmouseover" rerender="marker">
                                <apex:param name="image" value="/green.png" assignTo="{!imageName}"/>
                        </apex:actionSupport>
                        <apex:actionSupport event="onmouseout" rerender="marker">
                             <apex:param name="image" value="/ms_star.png" assignTo="{!imageName}"/>
                        </apex:actionSupport>
                          {war.id}
                      </apex:outputPanel>
                  </apex:column>
                  </apex:dataTable>
                 </apex:form>

    <apex:outputPanel id="marker">
       <apex:map ...
          <apex:mapMarker ...
The result for now looks like this (star turns green...):

User-added image
When I hover over the ID it will reRender and displayed like this:

User-added image
The "problem" is that the entire maps reRenders / reloads in the process which is poor user experience. Is there anyway of just rerendering the apex:marker / image? Via some javascript?

Thanks!
AbhishekAbhishek (Salesforce Developers) 
Hi,

You can go through the below blog once,

https://developer.salesforce.com/forums/?id=906F000000095LKIAY

Thanks.
Janno RipJanno Rip
Hello,

thanks for your reply. I know that post but it probably will not work for my case. The images/Icons that I am trying to replace are inside <apex: mapMarker> where mouseover is not supported.  
<apex:mapMarker position="{!war.GeoLocPosition__c}" title="{!war.Name}" icon="{!URLFOR($Resource.ZipFile,imageVar)"
I achieve that easily for the table images which is - regarding the functionality - exactly what I want. But I do not want the table images to change. I want the apex:marker Icons to change. Or am I missing something?

Greetings