Forum:

Having issues reRendering a map when a rich:tree node is clicked on(SOLVED)

Matt Kohanek

Village Idiot

Posts: 484

I like...

posted 14 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Im using a4j:repeat to dynamically generate markers on a map. I did this with the marker:

the value of that repeat tag is just a List filled with Objects. lat and lng are two variables in each Object, which is what i use for the latitude and longitude attributes in the m:marker tag.

Is it OK to use a List of Objects, or do I need to do something else like using a list of String values instead of Objects?

The other potential problem is how this List gets loaded with values. I know it is getting loaded with the correct values, because I have System.out lines of code to make sure each time the method gets called. On the left side of my page a I have a rich:tree, and the nodeSelectListener is what loads the List with values. Then I set the reRender attribute to "map", which is the id attribute on the m:map tag. <m:map width="1000px" height="750px" zoom="2" id="map">

So essentially it seems when someone clicks on the node in the rich:Tree, it should call the emthod to load the List with values, which it does just fine, but then it needs to reRender the map, but when the map gets reRendered all I see is a blank white page. If it helps, here is the rich:tree tag. Maybe I have something wrong there?

Unfortunately I only have till about 330 pm tomorrow to get this working, so I am posting this to you at 5am so I can go to bed and hope someone can spot my issue

Thanks

edit - solution I looked more clocely at the java doc for this map code, and it turns out all I needed to do was to add this to the m:map tag - renderOnWindowLoad="false"

Now it looks like this:

<ui:define name="banner">
        <h:form>
            <h:graphicImage value="/images/NILogo.jpg" width="800" height="50" />
        </h:form>
    </ui:define>

<table>
    <tr>
        
        <td>
        <ui:define name="top_menu">
        <h:form>
            <h:outputLink value="/NI/pages/first.jsf">MDN PROJECT EXPLORER</h:outputLink><h:outputText value=" | " />
            <h:outputText value=" | " /><h:outputText value=" | " /><h:outputText value=" | " />
            <h:panelGroup>
            <h:outputLink value="/NI/top_menu/charts.jsf" >CHARTS</h:outputLink><h:outputText value=" | " />
            <h:outputLink value="/NI/top_menu/map.jsf" >MY MAP</h:outputLink><h:outputText value=" | " />
            </h:panelGroup>
            <hr/>
         </h:form>
         </ui:define>
         </td>

</tr>
     </table>

</tr>
     </table>

</ui:composition>

</html>

Now when you click on a project from the rich:tree, it reRenders the map with the markers placed on the coordinates they have.

True wisdom is in knowing you know nothing - Socrates

Tim Holloway

Saloon Keeper

Posts: 27807

196

I like...

posted 14 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

Oh goodie. GitRDun/UndethTheGun. We get more quality software that way.

The actual interactions of Java objects and JSF views (EL) is done using BeanUtils and so follows the BeanUtil rules. That usually means that any object that can be converted to or from a String is OK in an EL expression. However, in some of the RichFaces objects I've seen unhappy results.

When you get your blank page, wait about 30 seconds and then click the "Back" button. If the map appears (you may have to click "Forward"), you've run into the exact same problem I've been fighting for the last year or so (obviously that project didn't have a deadline). It's a known issue with Google Maps where apparently the internal structures aren't being set up with rigorous regard to synchronicity.

Unfortunately, I don't know of a cure. And Google doesn't seem to be working very hard on one.

The secret of how to be miserable is to constantly expect things are going to happen the way that they are "supposed" to happen.

You can have faith, which carries the understanding that you may be disappointed. Then there's being a willfully-blind idiot, which virtually guarantees it.

Matt Kohanek

Village Idiot

Posts: 484

I like...

posted 14 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

I got it, I put the solution as an edit in my original post if you want to see what I had to do.

I'm not using rich:map or rich:gmap or whatever it is btw Tim, so maybe the map I am using will work for your issue too? It is open source so you can use it freely.

http://code.google.com/p/gmaps4jsf/

True wisdom is in knowing you know nothing - Socrates

Tim Holloway

Saloon Keeper

Posts: 27807

196

I like...

posted 14 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

The RichFaces Google Maps tag didn't exist when I wrote my stuff. I made a custom tag whose primary purpose was to render a map view and connect it to an external JavaScript.

I probably ought to look at some of the newer stuff just in case I can get the page in question to work, although it's the only map in the app that gives me trouble.

Matt Kohanek

Village Idiot

Posts: 484

I like...

posted 14 years ago

Number of slices to send:

Optional 'thank-you' note:

Send

edit - btw you do not have to get a google map key either, you just use the JARs this guys put on his site. But you still have all the funstionality of a google map like different view types, zooming in and out, centering over a locaton by typing in an address, plus more. Ha I sound like a commercial for this stuff

Here is one of this guys samples that connects the map to java script to pop up a window that tells you the new lat and lng when you drag and drop a marker:

<h:form id="form">
		  	<div>Drag the markers and select your favorite places!!!</div>    	
    		<m:map width="90%" height="90%" latitude="24" longitude="15" jsVariable="map1" type="G_NORMAL_MAP" zoom="2">
    			<m:marker latitude="#{place1.latitude}" longitude="#{place1.longitude}" jsVariable="marker1" draggable="true">
					<m:eventListener eventName="dragend" jsFunction="marker1DragHandler"/>    				
    			</m:marker>
    			<m:marker latitude="#{place2.latitude}" longitude="#{place2.longitude}" jsVariable="marker2" draggable="true">
					<m:eventListener eventName="dragend" jsFunction="marker2DragHandler"/>    				
    			</m:marker>    				
    		</m:map>
            <h:commandButton value="Save as a favorite place!!!" action="#{addressBean.doSearch}"/>  <br>                                      		
			<h:outputText value="First place (lat, lng): (#{place1.latitude}, #{place1.longitude})"/> <br>
			<h:outputText value="Second place (lat, lng): (#{place2.latitude}, #{place2.longitude})"/> <br>		
		    <script>
		   	function marker1DragHandler(latlng) {
		   		alert("Current marker1 latlng is: " + latlng);  	
		   	}	
		   	function marker2DragHandler(latlng) {
		   		alert("Current marker2 latlng is: " + latlng);  	
		   	}		   		   		   	
		    </script>    		 		
    	</h:form>

Dunno if that is what you are looking for but there are a ton of examples of his map interacting with java script on that site. After all the help you've given me on this and numerous other threads it would be great if this works for you and I could help you out for once lol

True wisdom is in knowing you know nothing - Socrates

Don't get me started about those stupid light bulbs.