Google Maps Problem with Zend Framework

Question

Hi I am having issues inserting a map from google maps and using the send framework.

My issue is similar to Question 921811

However when adding the script to my view I am getting the googlemaps api in twice and no map being rendered by the view.

This is what I am adding to the view script

<?php 

$this->headScript()->appendFile('http://maps.google.com/maps?file=api&amp;;v=2&amp;;sensor=true&amp;;key=ABQIAAAAHSJ3TgOTyvA1VzwU8g4Y7RT2yXp_ZAY8_ufC3CFXhHIE1NvwkxRmCy1h3nGv3n46kcqaFljsimqfWw');
$this->headScript()->appendScript('  var map = null;
        var geocoder = null;

        function initialize() {
          if (GBrowserIsCompatible()) {
            map = new GMap2(document.getElementById("map_canvas"));
            map.setCenter(new GLatLng(37.4419, -122.1419), 13);
            geocoder = new GClientGeocoder();
          }
        }

        function showAddress(address) {
          if (geocoder) {
            geocoder.getLatLng(
              address,
              function(point) {
                if (!point) {
                  alert(address + " not found");
                } else {
                  map.setCenter(point, 13);
                  var marker = new GMarker(point);
                  map.addOverlay(marker);
                  marker.openInfoWindowHtml(address);
                }
              }
            );
          }
        }
    ');
    ?>

However this is adding the maps API in twice with a lot of escaped html, which is causing the maps to fail to load. e.g.

<script type="text/javascript" src="&lt;script src=&quot;http://maps.google.com/maps?file=api&amp;amp;amp;v=2&amp;amp;amp;sensor=true&amp;amp;amp;key=ABQIAAAAHSJ3TgOTyvA1VzwU8g4Y7RT2yXp_ZAY8_ufC3CFXhHIE1NvwkxRmCy1h3nGv3n46kcqaFljsimqfWw&amp;quot; type=&quot;text/javascript&quot;&gt;&lt;/script&gt;"></script>
<script type="text/javascript" src="http://maps.google.com/maps?file=api&amp;amp;;v=2&amp;amp;;sensor=true&amp;amp;;key=ABQIAAAAHSJ3TgOTyvA1VzwU8g4Y7RT2yXp_ZAY8_ufC3CFXhHIE1NvwkxRmCy1h3nGv3n46kcqaFljsimqfWw"&gt;&lt;/script&gt;

<script type="text/javascript">
//<!--
var map = null;
         var geocoder = null;

        function initialize() {
          if (GBrowserIsCompatible()) {
            map = new GMap2(document.getElementById("map_canvas"));
            map.setCenter(new GLatLng(37.4419, -122.1419), 13);
            geocoder = new GClientGeocoder();
          }
        }
.....

Any idea why the google maps API is being added twice with the escaped html tags? I have no idea and the examples I have found don't seem to have this issue.

Thanks in advance

Answer 1

The reason you're not seeing any map is because the URL in your appendFile() call is broken. Remove all the semi-colons:

http://maps.google.com/maps?file=api&v=2&sensor=true&key=whatever

That will fix the second <script> tag and make the Google map actually work.

That still leaves you with the first <script> tag, though. But that must be related to how you're actually printing the contents of the HeadScript view helper. Can you show us what that code looks like?