Problem with maps API v3

96 views
Skip to first unread message

chesterb

unread,
Jun 22, 2010, 8:04:41 AM6/22/10
to Google Maps JavaScript API v3
I am having problems trying to display the map on my website. I have
used firebug to trap errors but unfortunately there are none, the code
I am using is

<meta name="viewport" content="initial-scale=1.0, user-
scalable=no" />
<script type="text/javascript" src="http://maps.google.com/maps/
api/js?v=3&sensor=false&region=GB"></script>

<script type="text/javascript">
function initialize()
{ldelim}
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {ldelim} zoom: 8, center: latlng, mapTypeId:
google.maps.MapTypeId.ROADMAP {rdelim};
var map = new
google.maps.Map(document.getElementById("map_canvas"), myOptions);
console.trace();
{rdelim}
</script>

<body onload="initialize()">

<div id="map_canvas" style="width:100%; height:100%;"></div>

any assistance would be great

Chad Killingsworth

unread,
Jun 22, 2010, 8:44:25 AM6/22/10
to Google Maps JavaScript API v3
We really need a link to your site to help debug the issue.
See the posting guidelines in this forum.

Chad Killingsworth

Davide Cremonesi

unread,
Jun 22, 2010, 9:48:16 AM6/22/10
to google-map...@googlegroups.com
I copied your code in an html file (obviously replacing the {ldelim} and {rdelim}) and runs fine.
Where are those "tags" coming from? Did they just appeared in the mail message or are you using some template engine?
In the latter case maybe is misconfigured...

Davide


2010/6/22 Chad Killingsworth <chadkill...@missouristate.edu>
--
You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group.
To post to this group, send email to google-map...@googlegroups.com.
To unsubscribe from this group, send email to google-maps-js-a...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en.


chesterb

unread,
Jun 22, 2010, 10:01:30 AM6/22/10
to Google Maps JavaScript API v3
Yes I am using a smarty template engine...

On Jun 22, 2:48 pm, Davide Cremonesi <dvd....@gmail.com> wrote:
> I copied your code in an html file (obviously replacing the {ldelim} and
> {rdelim}) and runs fine.
> Where are those "tags" coming from? Did they just appeared in the mail
> message or are you using some template engine?
> In the latter case maybe is misconfigured...
>
> Davide
>
> 2010/6/22 Chad Killingsworth <chadkillingswo...@missouristate.edu>
> > google-maps-js-a...@googlegroups.com<google-maps-js-api-v3%2Bunsu...@googlegroups.com>
> > .

chesterb

unread,
Jun 22, 2010, 9:22:23 AM6/22/10
to Google Maps JavaScript API v3
OK.....URL is https://servicedesk.pcmsgroup.com/newcsi/index.php

login with username - usert
and password is password

then click the contact pcms on the left

thanks


On Jun 22, 1:44 pm, Chad Killingsworth

Davide Cremonesi

unread,
Jun 22, 2010, 10:36:04 AM6/22/10
to google-map...@googlegroups.com
Hmmm, your application is served via https. I never tried but maybe the ajax calls to googlemaps server to populate the map tiles are blocked (as every other non secure content on a https page..)

Can someone confirm my suspition?

Davide

2010/6/22 chesterb <bryn_c...@hotmail.com>
--
You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group.
To post to this group, send email to google-map...@googlegroups.com.
To unsubscribe from this group, send email to google-maps-js-a...@googlegroups.com.

chesterb

unread,
Jun 22, 2010, 10:46:12 AM6/22/10
to Google Maps JavaScript API v3
Just to let you know....I am also using google charts on this website,
they display OK although IE pops up a warning


On Jun 22, 3:36 pm, Davide Cremonesi <dvd....@gmail.com> wrote:
> Hmmm, your application is served via https. I never tried but maybe the ajax
> calls to googlemaps server to populate the map tiles are blocked (as every
> other non secure content on a https page..)
>
> Can someone confirm my suspition?
>
> Davide
>
> 2010/6/22 chesterb <bryn_ches...@hotmail.com>
>
> > OK.....URL ishttps://servicedesk.pcmsgroup.com/newcsi/index.php
> > google-maps-js-a...@googlegroups.com<google-maps-js-api-v3%2Bunsu...@googlegroups.com>
> > .

Miguel Angel Vilela

unread,
Jun 22, 2010, 11:02:10 AM6/22/10
to google-map...@googlegroups.com

If your browser is configured not to download http:// components inside a secure page, then it won't download the Maps API, maps tiles or images from the Chart API.

Mine is not configured to do that, so it loads the API just fine. Watching HTTP headers in my browser, I can see the map is created and some tiles are downloaded:

...
...

But the map is never displayed. I noticed this JavaScript error, it happens at the end of initialize() and may be preventing the map from showing up:



To unsubscribe from this group, send email to google-maps-js-a...@googlegroups.com.

Chad Killingsworth

unread,
Jun 22, 2010, 11:07:25 AM6/22/10
to Google Maps JavaScript API v3
The problem is that you are specifying your map div with a height:
100% style; For HTML, that means that it will take the complete height
of it's parent element. However, the parent element is set to take
only the height it needs. Therefore your map div has a height of 0;

You'll need to specify an absolute height for your map.

Chad Killingsworth
> > > google-maps-js-a...@googlegroups.com<google-maps-js-api-v3%2B unsub...@googlegroups.com>

chesterb

unread,
Jun 22, 2010, 11:34:51 AM6/22/10
to Google Maps JavaScript API v3
Thank you Chad, this has resolved the problem

On Jun 22, 4:07 pm, Chad Killingsworth

Antonio Gabrielli

unread,
Dec 13, 2011, 4:19:41 PM12/13/11
to google-map...@googlegroups.com
Ho fatto anche io quella prova e funziona bene, sia in locale che da remoto.

Antonio Gabrielli

unread,
Dec 13, 2011, 4:34:48 PM12/13/11
to google-map...@googlegroups.com
I have same problem in template.
See http://www.sitopiupiu.it/directory/contact.php
Clicking on "clicca qui".
The popup appear completly white.

Code:

<!-- BEGINIF $tpl_mode == 'gmap' -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<title>{$site_name}</title>
<style type="text/css">
 html { height: 100% }
  body { margin: 0; padding: 0; font: 10pt Arial, Helvetica }
  #map { height: 100% }
</style>

<script type="text/javascript">
  //<![CDATA[
{literal}
function initialize() {
    var latlng = new google.maps.LatLng(43.983349, 10.183133);
    var options = {

      zoom: 8,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map"), options);
    var marker = new google.maps.Marker({ position: latlng,
                                      map: map,
                                      title: 'Testo di suggerimento' });
  }
{/literal}     
//]]>
</script>
</head>
<body onload="initialize()">
  <div id="map" style="width:500px; height: 300px"></div>
</body>
</html>
<!-- ENDIF -->

Other code

<script type="text/javascript">
<!--
if ({$gmap_enabled} == 1)
document.writeln ('<p style="margin-bottom:30px"><a href="contact.php?cmd=gmap" rel="#overlay" style="text-decoration:none;">Clicca qui<\/a> per una mappa interattiva.<\/p>');
-->
</script>

In HTML file, without Smarty sintax and last script, run fine in local and in remote.
Do I can made for run API in proper manner?

Antonio Gabrielli

unread,
Dec 13, 2011, 4:38:44 PM12/13/11
to google-map...@googlegroups.com
I have used {literal}, {/literal} for encapsule the javascript function and run it.
Reply all
Reply to author
Forward
0 new messages