Ok, I have visited the map in discussion and I've found an error in your "ExtInfoWindow.js" file: there are some portions of text that are copied from a web page. Accidentally you or whoever created your extinfowindow.js file copied some extra text. You should cut out of the js file the text which starts with : "Show details Hide details..." and all after it.
Regards ... On Dec 13, 3:34 am, Jack <[email protected]> wrote: > Dear Akkad, > > Thanks for your swift reply but I already have done what you've > suggested. > > See my remark in my previous e-mail: > > I've also added the path to ExtInfoWindow.js to the > moreinfo_property.html file. see above in red, line 128. > I've replaced the InfoWindowHtml marker with ExtInfoWindow. see above > in green. > The moment I change the marker type in the moreinfo_property.html file > it fails to show me the Map Tab on my website. What am I doing wrong? > I hope you can give me some help. Thanks in advance. > > When you look at my site:http://www.villabelanda/joomla/index.html > > Then select: > - Villa's & Bungalows > - Villa Belanda > > You'll see the Reservation Manager PRO tables with the following tabs > in horizontal order: > > - Description, More Information, Prices, Map, Availabilty and Reserve > Now > > When I use the standard code: "marker.openInfoWindowHtml > (google_address); " It works but when I use: "marker.openExtInfoWindow > (google_address); " it doesn't show me the "map" and Availabilty and > Reserve Now" Tabs anymore and when I mouseclick on the other visible > tabs it does nothing. > > I think I need partly the original PRO codes because it's extracting > some address information from it's own database which you specify in > the Joomla module beforehand. > > Beats me what I'm doing wrong. Hope you can help me. > > Thanks, > Jack > > On Dec 13, 9:07 am, akkad <[email protected]> wrote: > > > Hello, > > > Not sure that I've understood your question, but in your code there is > > this line: > > > "marker.openInfoWindowHtml(google_address); " > > > This line of code is used to open the default Google Maps info window. > > If you want to use ExtInfoWindow you should replace this line with > > something like: > > > " GEvent.addListener(marker, 'click', function(){ > > marker.openExtInfoWindow( > > map, > > "simple_example_window", > > "<div class='title' style='background- > > color:whitesmoke'>test</div>", > > {beakOffset: 3} > > ); > > }); > > map.addOverlay(marker3); > > " > > as is ued > > onhttp://gmaps-utility-library-dev.googlecode.com/svn/trunk/extinfowind... > > > Hope it helps > > > On Dec 12, 12:35 pm, Jack <[email protected]> wrote: > > > > Hi there, > > > > Dear Mike, > > > > My name is Jack and I'm not a experienced HTML, CSS and Javascript > > > programmer. I'm making a website(www.villabelanda.nl/joomla/index.html > > > this is still a test environment) with Reservation Manager PRO > > > (property booking module for Joomla 1.5), which has included a Google > > > Maps feature using InfoWindowHtml as the standard marker. I've > > > customized the colours of de Reservation Manager PRO module, among > > > others the font colours. But this also effected the font colours used > > > by the marker of Google Maps. Now I'm trying to change the background > > > colour of that marker/text balloon, so that the address information > > > showed in the text balloon will be readable again. I'm trying to use > > > ExtInfoWindow but for some reason I can not get it to work. This is > > > what I did: > > > > First I copied the simpleExampleWindow.css and the whole > > > ExtInfoWindow.js from your site to my webserver and next followed the > > > instructions of how to us ExtInfoWindow. > > > > For your information, the Reservation Manager PRO module is using the > > > moreinfo_property.htm file for specifying the codes for Google Maps. > > > See below a specific part related to Google Maps of this file. > > > > It starts at line 126 in the moreinfo_property.htm file: > > > > <!-- BEGIN: googlemaps --> > > > <script src="http://maps.google.com/maps?file=api&v=2.x&key= > > > {google_map.key}" type="text/javascript"></script> > > > <script src="{PHP.SITE_URL}/templates/bali/css/ExtInfoWindow.js" > > > type="text/javascript"></script> > > > <script type="text/javascript"> > > > var map = null; > > > var geocoder = null; > > > var google_lng = {google_map.lng}; > > > var google_lat = {google_map.lat}; > > > var google_address = '{google_map.address}'; > > > > function google_map_initialize() { > > > if (GBrowserIsCompatible()) { > > > if (google_lng != 0 && google_lat != 0) { > > > google_map_lng_lat(); > > > } else { > > > google_map_address(); > > > } > > > } > > > > } > > > > function google_map_address(){ > > > geocoder = new GClientGeocoder(); > > > geocoder.getLatLng( > > > google_address, > > > function(point) { > > > if (!point) { > > > google_map_localtion_not_found("Location is not > > > found."); > > > } else { > > > google_map_show(point); > > > } > > > } > > > ); > > > > } > > > > function google_map_lng_lat(){ > > > var gLatLng = new GLatLng(google_lat, google_lng); > > > google_map_show(gLatLng); > > > > } > > > > function google_map_show(point){ > > > if (_isIE) { > > > var width = {google_map.width} + 2; > > > document.getElementById("map_canvas").style.width = width + 'px'; > > > } > > > var height = {google_map.height} + 10; > > > document.getElementById("map_canvas").style.height = height; > > > map = new GMap2(document.getElementById("map_canvas")); > > > map.addControl(new GLargeMapControl()); > > > map.setCenter(point, 16); > > > var marker = new GMarker(point); > > > map.addOverlay(marker); > > > > marker.openInfoWindowHtml(google_address); > > > } > > > > function google_map_localtion_not_found(msg){ > > > document.getElementById("map_canvas").innerHTML = '<div style="color: > > > red;"> ' + msg + '</div>'; > > > > } > > > > </script> > > > <div id="div_4" style="display: none"> > > > <table width="100%" height="100%" border="0" cellpadding="0" > > > cellspacing="0" style="padding: 0px; margin: 0px"> > > > <tr> > > > <td valign="top" style="margin: 0px; padding: 0px"> > > > <div id="map_canvas" style="width: {google_map.width} + 1px; > > > height: {google_map.height}px; margin: 0px; padding: 0px"></div> > > > </td> > > > </tr> > > > </table> > > > </div> > > > <!-- END: googlemaps --> > > > <!-- BEGIN: googlemaps_override --> > > > <div id="div_4" style="display: none"> > > > <div align="center"><img src="{googlemapsoverride}" alt="" /></div> > > > </div> > > > <!-- END: googlemaps_override --> > > > > I've added this line, as in your example: <link rel="Stylesheet" > > > type="text/css" href="{PHP.SITE_URL}/templates/bali/css/ > > > simpleExampleWindow.css" media="screen" /> to the header of the > > > moreinfo_property.html file. > > > I've also added the path to ExtInfoWindow.js to the > > > moreinfo_property.html file. see above in red, line 128. > > > I've replaced the InfoWindowHtml marker with ExtInfoWindow. see above > > > in green. > > > The moment I change the marker type in the moreinfo_property.html file > > > it fails to show me the Map Tab on my website. What am I doing wrong? > > > I hope you can give me some help. Thanks in advance. > > > > Kind regards, > > > Jack Soedira > > > > [m] +31(0)6-15098090 > > > Skype: jack-soedira > > > The Netherlands -- 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.
