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 on
http://gmaps-utility-library-dev.googlecode.com/svn/trunk/extinfowindow/examples/simpleExample.html
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.
