Thanks for the idea Martin Actually I don't need to do that because I create the html string from the data for the station in js and the data is in a js array, (there is no XML involved). If I see there is a photo, then I create the appropriate <div ...>, <img ...> etc. so I know when I need to use an <img ...> element, and when not to.
If you look at mys source, this is all done in the function "addStation (....)". So I have full control ober that, I just don't know how big the photos are. I set the width to be fixed (either 150 or 400 px) and let the height vary based on the aspect ratio. I may go back and add the aspect ratio to my data and pre-set the <div...> width and height as was suggested in the first response above. This is doable now, with just 20 or so photos, but I was trying to avoid this since the number of photos will increase and such manual steps are error prone and basically a pain. So I may write something to pre-process the data. But at the moment, I'm past that using the <img onload="..." ...> capability together with the map.updateInfoWindow() call. That works (sort of) but it doesn't look good since the infoWindow, flickers, or it changes from a photo sticking out past the bottom, into a proper infoWindow before your eyes. Hence the attempt to use the getInfoWindo().hide() and .show() to keep that crap out of view. Still working on it. On Oct 28, 2:10 am, Martin <[email protected]> wrote: > Can you use a regular expression to check your 'htmltext' for an IMG > element string? > > If you find an IMG element then: > > Use a regular expression to retrieve it's href attribute. > > Create a new image object, set it's onload event to open the > infowindow and set it's src to the href. > > If htmltext contains no IMG element then just open the infowindow. > > Martin. > > If your regular expressions leave something to be desired (sounds like > me!) then you could look for the IMG element string and theh href > attribute using indexOf(). > > On 27 Oct, 19:11, Papa Bear <[email protected]> wrote: > > > OK > > > I didn't look in the documentation very thoroughly. I found the 2 > > methods: > > > map.getInfoWindow().hide() > > map.getInfoWindow().show() > > > Just what I wanted? Not quite > > > There seems to be a timing problem: I want the window to be hidden > > when it's opened and only exposed after the images are loaded. This > > didn't work: > > > map.getInfoWindow().hide() > > marker.openInfoWindow(...) > > > You cant "pre-hide" the infoWindow object. The open seems to change > > the hidden state to the visible state. > > > This didn't work: > > > marker.openInfoWindow(...) > > map.getInfoWindow().hide() > > > It's too quick, the window is not completed so the hide() is too soon. > > > This worked > > marker.openInfoWindow(...) > > setTimeout("map.getInfoWindow().hide()",50) > > > But of course now we are back to the flickers > > > Any way to bring it up in the hidden state? The subject of this > > thread is morphing, sorry. Thanks. > > > On Oct 27, 12:02 pm, Papa Bear <[email protected]> wrote: > > > > I discovered that the HTML within the infoWindow does support the > > > unload=..." option for the <img ... directive. > > > So now my <img ..." directive is > > > > <img onload="map.updateInfoWindow()" ...> > > > > And this works. > > > > However, never one to be satisfied, I now notice that after the photo > > > loads, the infoWindow flickers. Of course, we knew that would happen. > > > > So ... > > > > Is there any way to hide the infoWindow and the display it only the > > > photo is loaded. In other words change the openInfoWindo in the > > > marker's event listener to the hypothetical > > > > marker.openInfoWindowHtml(htmltext,{hide:true}); > > > > And add the following (hypothetical) statement to the onload property > > > for the <img... in the infoWindow > > > > <img onload="map.updateInfoWindow();map.showInfoWindow()" ...> > > > > Obviously I can't defer the openInfoWindow (which happen in the even > > > listener for the marker) since then nothing would be loaded, text or > > > photo, since the openInfoWindow starts the interpretation of the HTML > > > in the first place. Since the iinfoWindow is an overlay, one must be > > > able to hide and show it. > > > > In other words, I want to hide the thing until all the content is > > > ready. > > > > Thanks > > > > On Oct 27, 3:54 am, Martin <[email protected]> wrote: > > > > > I've faced the same problem recently and fixed it by redrawing the > > > > infowindow once the image loads. > > > > (Actually i'm using Mike's ELabel not the infowindow but the technique > > > > is the same). > > > > > Your page is XHTML and the onload attribute for IMG elements is not > > > > valid in XHTML so you'd need to add the onload event using javascript > > > > btw. > > > > > I'd suggest you wrap your infowindow contents in a DIV element with an > > > > id and then open your infowindow. > > > > > Use myDiv.getElementsByTagName('img') to get a node list of all IMG > > > > elements within the infowindow and loop through them adding an onload > > > > event listener to each image. > > > > > The onload event listener can then set width and height attributes for > > > > any IMG elements once the image has been retrieved from the server and > > > > redraw the infowindow. > > > > > Watch the redraw process doesn't go into an infinite loop - only add > > > > the onload event listener to an IMG element the first time it is > > > > displayed. > > > > > I'd rather not post a link to my (currently being developed) map on > > > > the group so if you'd like to see the code i've used then send me an > > > > email. > > > > > Martin. > > > > > On 26 Oct, 22:16, Papa Bear <[email protected]> wrote: > > > > > > I have a map with a fair number of markers, each with a bit of > > > > > information that gets displayed in the infoWindow. The markers > > > > > represent boundary monuments on the US - Canadian border. Here's the > > > > > map: > > > > > >http://members.bellatlantic.net/~vze2h6gy/papabear/BM_Station_GMap.ht... > > > > > > Some of the markers (about 20 out of the total of several hundred) > > > > > also display a thumb nail photo. These are the ones I have actually > > > > > visited, > > > > > > The map is generated client-side and it's all vanilla java script. > > > > > The data is in a separate .js file and consists of several arrays of > > > > > objects. Although I am still tinkering with the code, functionally it > > > > > basically works, (although like many others it was written and > > > > > debugged using Firefox, so I haven't checked every last little feature > > > > > under IE). > > > > > > The problem: all the verbal content comes from the server where my map > > > > > comes from, so it is generally all resident on the client's PC once > > > > > the thing gets loaded. The photos, however, come from another server > > > > > and they are generally only pulled down when the info Window is > > > > > created. They are specified using html <img ...> tags. Most times > > > > > things work fine, but a noticeable fraction of the time the text will > > > > > appear and the infoWindow will be brought up before the photo > > > > > arrives. When it does arrive, it gets put where it belongs, but more > > > > > often than not, it will go outside the bounds of the infoWindow. > > > > > > I have a general idea how large the thumbnails with be, but a goodly > > > > > number have an odd aspect ratio which I can't predict in advance, so I > > > > > can't just pre allocate the right > > > > > amount of space in the <div ...> that holds the <img ...>. > > > > > > I can do an updateInfoWindow(), and that indeed works, but I don't > > > > > know when to do it. If I wait say 250 msec and call it, it may be too > > > > > soon or too late. And when I do it too far out, I get an annoying > > > > > flicker. > > > > > > Any suggestions? Any one know a way to tell when the photo gets > > > > > loaded? Is there some Dom event for that? How do fancy professional > > > > > sites handle this sort of thing? > > > > > > If you want to see the affect, try clicking on the markers with these > > > > > names of the map: > > > > > Hereford > > > > > Beecher Tablet > > > > > Hill Tablet > > > > > Metallak > > > > > Pros (which is hiding behind Spect) > > > > > the unlabeled marker on the upper right end of the border > > > > > the unlabeled marker on the lower left end of the border > > > > > the unlabeled marker at the upper left, where the green markers start. > > > > > > I you have fast service to my photo server, maybe you won't see the > > > > > problem. For me it's about 50 / 50. --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Google Maps API" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/google-maps-api?hl=en -~----------~----~----~----~------~----~------~--~---
