title: Phonegap - iOS - Google Maps "Sorry no imagery here"
body: <p>When running the following code in a browser there are no issues. When running through Phonegap everything comes through fine except the map. I see everthing working except the map is grey and has text "Sorry we have no imagery here." </p>
  
  <p>The zoom is set to 4 so I see no issue with that. I have included the config.xml from phonegap as well. The following she whitelist url's and allow access origin to google in the iOS platform. </p>
  
  <p>Any help is greatly appreciated! </p>
  
  <pre><code>&lt;preference name="OpenAllWhitelistURLsInWebView" value="true" /&gt;
  
  &lt;platform name="ios"&gt;
          &lt;access origin="*.google.*" /&gt;
              &lt;access origin="*" /&gt;
          &lt;allow-intent href="itms:*" /&gt;
          &lt;allow-intent href="itms-apps:*" /&gt;
  &lt;/platform&gt;
  </code></pre>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;head&gt;
  &lt;link rel="icon" href="brew-marker.png"  &gt;
  &lt;title&gt;BrewsLocal - Find More Local Breweries&lt;/title&gt;
  &lt;meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"&gt;
  &lt;link href="style.css" rel="stylesheet" type="text/css"&gt;
  &lt;link href="https://fonts.googleapis.com/css?family=Oswald" rel="stylesheet"&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDUIshgyijJP94STQUaMirmDj5eAVx-BuA&amp;callback=initMap" async defer&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  
      //&lt;![CDATA[
  
      var customIcons = {
  
        Brewery: {
          icon: 'brew-marker.png',
  anchor: new google.maps.Point(30,0),
  scale: 1
  
        },
        Brewpub: {
          icon: 'pub-marker.png',
  anchor: new google.maps.Point(30,0),
  scale: 1
  
        }
  
      };
  
  var gmarkers1 = [];
  
  
  
  
      function initialize() {
    
   // Try HTML5 geolocation.
          if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(function(position) {
              var pos = {
                lat: position.coords.latitude,
                lng: position.coords.longitude
              };
              map.setCenter(pos);
            });
          } else {
            alert("Browser Says No");
          }
  
        var map = new google.maps.Map(document.getElementById("map"), {
          center: new google.maps.LatLng(37.541458, -77.446578),
          zoom: 4,
          mapTypeId: 'roadmap',
          disableDefaultUI: true,
          gestureHandling: 'greedy'
    });
  
  
  
        var infoWindow = new google.maps.InfoWindow;
        // Change this depending on the name of your PHP file
        downloadUrl("http://brewslocal.com/phpsqlajax_genxml.php", function(data) {
          var xml = data.responseXML;
          var markers = xml.documentElement.getElementsByTagName("marker");
          for (var i = 0; i &lt; markers.length; i++) {
            var name = markers[i].getAttribute("name");
            var id = markers[i].getAttribute("id");
            var address = markers[i].getAttribute("address");
            var lat = markers[i].getAttribute("lat");
            var lng = markers[i].getAttribute("lng");
            var mon = markers[i].getAttribute("monday");
            var tue = markers[i].getAttribute("tuesday");
            var wed = markers[i].getAttribute("wednesday");
            var thur = markers[i].getAttribute("thursday");
            var fri = markers[i].getAttribute("friday");
            var sat = markers[i].getAttribute("saturday");
            var sun = markers[i].getAttribute("sunday");
            var facebook = markers[i].getAttribute("facebook");
            var twitter = markers[i].getAttribute("twitter");
            var instagram = markers[i].getAttribute("instagram");
            var website = markers[i].getAttribute("website");
            var type = markers[i].getAttribute("type");
            var logo = markers[i].getAttribute("logo");
            var point = new google.maps.LatLng(
                parseFloat(markers[i].getAttribute("lat")),
                parseFloat(markers[i].getAttribute("lng")));
            var day;
            switch (new Date().getDay()) {
                case 0:
                    day = markers[i].getAttribute("sunday");
                    break;
                case 1:
                    day = markers[i].getAttribute("monday");
                    break;
                case 2:
                    day = markers[i].getAttribute("tuesday");
                    break;
                case 3:
                    day = markers[i].getAttribute("wednesday");
                    break;
                case 4:
                    day = markers[i].getAttribute("thursday");
                    break;
                case 5:
                    day = markers[i].getAttribute("friday");
                    break;
                case  6:
                    day = markers[i].getAttribute("saturday");
            }
                if( day != "closed" ) {
                     openStatus = "Open: ";
               }
                 else {
                     openStatus = "Closed Today";
                     day = "";
               }
  
            var html = "&lt;div class='infoblock'&gt;&lt;div class='smallblock'&gt;&lt;img src='" + logo + "'/&gt;&lt;/div&gt;&lt;div class='largeblock'&gt;&lt;h2&gt;" + name + "&lt;/h2&gt;&lt;h3&gt;&lt;strong&gt;" + openStatus + "&lt;/strong&gt;" + day + "&lt;/h3&gt;&lt;a href='http://www.google.com/maps/?q=" + point
                + "' target='_blank' '&gt;" + address + "&lt;/a&gt;&lt;/div&gt;&lt;div class='socialblock'&gt;&lt;a class='socialicon' target='_blank' href='" + facebook + "'&gt;&lt;img src='https://maxcdn.icons8.com/Color/PNG/96/Social_Networks/facebook-96.png'/&gt;&lt;/a&gt;&lt;a class='socialicon' target='_blank' href='" + twitter + "'&gt;&lt;img src='https://maxcdn.icons8.com/Color/PNG/96/Social_Networks/twitter-96.png'/&gt;&lt;/a&gt;&lt;a class='socialicon' target='_blank' href='" + instagram + "'&gt;&lt;img src='https://maxcdn.icons8.com/Color/PNG/96/Social_Networks/instagram-96.png'/&gt;&lt;/a&gt;&lt;a class='socialicon' target='_blank' href='" + website + "'&gt;&lt;img src='https://maxcdn.icons8.com/Color/PNG/96/Network/domain-96.png' /&gt;&lt;/a&gt;&lt;/div&gt;&lt;/div&gt;";
            var icon = customIcons[type] || {};
            var marker = new google.maps.Marker({
              map: map,
              position: point,
              icon: icon.icon,
              type: type,
              origin: new google.maps.Point(0, 0),
              anchor: new google.maps.Point(0, 0),
              shadow: icon.shadow
            });
      gmarkers1.push(markers);
  
  
  filterMarkers = function (type) {
      for (i = 0; i &lt; markers.length; i++) {
          marker = gmarkers1[i];
          // If is same category or category not picked
          if (marker.type == type || type.length === 0) {
              marker.setVisible(true);
          }
          // Categories don't match
          else {
              marker.setVisible(false);
          }
      }
  }
            bindInfoWindow(marker, map, infoWindow, html);
          }
        });
  
        
      
  
      }
      function bindInfoWindow(marker, map, infoWindow, html) {
        google.maps.event.addListener(marker, 'click', function() {
          infoWindow.setContent(html);
          infoWindow.open(map,marker);
        });
      }
  
  
      function downloadUrl(url, callback) {
        var request = window.ActiveXObject ?
            new ActiveXObject('http://brewslocal.com/phpsqlajax_genxml.php') :
            new XMLHttpRequest;
        request.onreadystatechange = function() {
          if (request.readyState == 4) {
            request.onreadystatechange = doNothing;
            callback(request, request.status);
          }
        };
        request.open('GET', url, true);
        request.send(null);
      }
  
  
  
  
      function doNothing() {}
      //]]&gt;
  
  
          &lt;/script&gt;
   &lt;/head&gt;
  
      &lt;body onload="initialize()"&gt;
  
      &lt;div class="menu-icon"&gt;
          &lt;img src="menu-button.png" title="Menu" width="100"&gt;
          &lt;/div&gt;
      &lt;div class="close-icon"&gt;
          &lt;img src="close-button.png" title="Multiply" width="100"&gt;
          &lt;/div&gt;
       &lt;div class="filter-icon"&gt;
          &lt;img src="search-button.png" title="Search" width="96"&gt;
         &lt;/div&gt;
      &lt;div class="main-menu"&gt;
          &lt;div class="logo-main-menu"&gt;
              &lt;img src="main-logo.png"/&gt;
          &lt;/div&gt;
          &lt;ul class="nav-menu-main"&gt;
              &lt;li&gt;&lt;a href="" class="menu-button"&gt;
                  Search A Location&lt;/a&gt;
              &lt;/li&gt;
              &lt;li&gt;&lt;a href="" class="menu-button"&gt;
                  View Breweries&lt;/a&gt;
              &lt;/li&gt;
              &lt;li class="menu-button push-second"&gt;
                  Map Legend  &lt;span class="glyphicon glyphicon-chevron-down" style="height: 100px; width: 100px; color: #fff;"&gt;&lt;/span&gt;
                  &lt;ul class="second-menu"&gt;
                      &lt;li&gt;&lt;a href="" class="menu-button"&gt;
                          &lt;img src="brew-marker.png"/&gt;Brewery&lt;/a&gt;
                      &lt;/li&gt;
                      &lt;li&gt;&lt;a href="" class="menu-button"&gt;
                          &lt;img src="pub-marker.png" /&gt;Brewpub&lt;/a&gt;
                      &lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
    
      &lt;div class="overlay-background"&gt;
  
      &lt;/div&gt;
           &lt;div class="search-box"&gt;
               &lt;input type="text" placeholder="Enter A Location" /&gt;&lt;div class="search-image"&gt;&lt;a href=""&gt;&lt;img src="/near-button.png" title="Near Me" width="96"&gt;&lt;/a&gt;&lt;/div&gt;
           &lt;/div&gt;
              &lt;div id="map"&gt;&lt;/div&gt;
  
      &lt;div class="show-brewery"&gt;
          &lt;div class="brewery-logo" id="breweryimage"&gt;
              
          &lt;/div&gt;
      &lt;/div&gt;
                         
                      &lt;/div&gt;
  
  
    &lt;script&gt;
  
  $(document).ready(function(){
      $(".menu-icon").click(function(){
          $("#map").animate({"left": "60%"},700);
          $(".main-menu").animate({"display": "block"},700);
          $(".menu-icon").animate({"left": "60%","top": "-200px"},700);
          $(".close-icon").animate({"top": "25px"},700);
          $(".filter-icon").animate({"right": "-135px"},700);
      });
  });
  
  $(document).ready(function(){
      $(".close-icon").click(function(){
          $("#map").animate({"left": "0px"},700);
          $(".main-menu").animate({"display": "none"},700);
          $(".menu-icon").animate({"left": "15px","top": "25px"},700);
          $(".close-icon").animate({"top": "-200px"},700);
          $(".filter-icon").animate({"right": "15px"},700);
      });
  });
  
  $(document).ready(function(){
      $(".push-second").click(function(){
          $(".second-menu").slideToggle();
      });
  });
  
  $(document).ready(function(){
      $(".overlay-background").click(function(){
          $(".search-box").animate({"top": "-200px"},500);
          $(".overlay-background").delay(200).slideToggle();
      });
  });
  
  $(document).ready(function(){
      $(".filter-icon").click(function(){
          $(".overlay-background").slideToggle(500);
          $(".search-box").delay(100).animate({"top": "50%"},500);
      });
  });
  
  
  
              &lt;/script&gt;
          &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;?xml version='1.0' encoding='utf-8'?&gt;
  &lt;widget id="com.phonegap.simpleApp" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0"&gt;
      &lt;name&gt;Simple App&lt;/name&gt;
      &lt;description&gt;
          Hello World sample application that responds to the deviceready event.
      &lt;/description&gt;
      &lt;author email="support@phonegap.com" href="http://phonegap.com"&gt;
          PhoneGap Team
      &lt;/author&gt;
      &lt;content src="index.html" /&gt;
      &lt;preference name="DisallowOverscroll" value="true" /&gt;
      &lt;preference name="OpenAllWhitelistURLsInWebView" value="true" /&gt;
      &lt;preference name="android-minSdkVersion" value="14" /&gt;
      &lt;plugin name="cordova-plugin-battery-status" source="npm" spec="~1.1.1" /&gt;
      &lt;plugin name="cordova-plugin-camera" source="npm" spec="~2.1.1" /&gt;
      &lt;plugin name="cordova-plugin-media-capture" source="npm" spec="~1.2.0" /&gt;
      &lt;plugin name="cordova-plugin-console" source="npm" spec="~1.0.2" /&gt;
      &lt;plugin name="cordova-plugin-contacts" source="npm" spec="~2.0.1" /&gt;
      &lt;plugin name="cordova-plugin-device" source="npm" spec="~1.1.1" /&gt;
      &lt;plugin name="cordova-plugin-device-motion" source="npm" spec="~1.2.0" /&gt;
      &lt;plugin name="cordova-plugin-device-orientation" source="npm" spec="~1.0.2" /&gt;
      &lt;plugin name="cordova-plugin-dialogs" source="npm" spec="~1.2.0" /&gt;
      &lt;plugin name="cordova-plugin-file" source="npm" spec="~4.1.1" /&gt;
      &lt;plugin name="cordova-plugin-file-transfer" source="npm" spec="~1.5.0" /&gt;
      &lt;plugin name="cordova-plugin-geolocation" source="npm" spec="~2.1.0" /&gt;
      &lt;plugin name="cordova-plugin-globalization" source="npm" spec="~1.0.3" /&gt;
      &lt;plugin name="cordova-plugin-inappbrowser" source="npm" spec="~1.3.0" /&gt;
      &lt;plugin name="cordova-plugin-media" source="npm" spec="~2.2.0" /&gt;
      &lt;plugin name="cordova-plugin-network-information" source="npm" spec="~1.2.0" /&gt;
      &lt;plugin name="cordova-plugin-splashscreen" source="npm" spec="~3.2.1" /&gt;
      &lt;plugin name="cordova-plugin-statusbar" source="npm" spec="~2.1.2" /&gt;
      &lt;plugin name="cordova-plugin-vibration" source="npm" spec="~2.1.0" /&gt;
      &lt;plugin name="cordova-plugin-whitelist" source="npm" spec="~1.2.1" /&gt;
      &lt;platform name="android"&gt;
          &lt;icon density="ldpi" src="www/res/icon/android/drawable-ldpi-icon.png" /&gt;
          &lt;icon density="mdpi" src="www/res/icon/android/drawable-mdpi-icon.png" /&gt;
          &lt;icon density="hdpi" src="www/res/icon/android/drawable-hdpi-icon.png" /&gt;
          &lt;icon density="xhdpi" src="www/res/icon/android/drawable-xhdpi-icon.png" /&gt;
          &lt;icon density="xxhdpi" src="www/res/icon/android/drawable-xxhdpi-icon.png" /&gt;
          &lt;icon density="xxxhdpi" src="www/res/icon/android/drawable-xxxhdpi-icon.png" /&gt;
          &lt;splash density="land-ldpi" src="www/res/screen/android/drawable-land-ldpi-screen.png" /&gt;
          &lt;splash density="land-mdpi" src="www/res/screen/android/drawable-land-mdpi-screen.png" /&gt;
          &lt;splash density="land-hdpi" src="www/res/screen/android/drawable-land-hdpi-screen.png" /&gt;
          &lt;splash density="land-xhdpi" src="www/res/screen/android/drawable-land-xhdpi-screen.png" /&gt;
          &lt;splash density="land-xxhdpi" src="www/res/screen/android/drawable-land-xxhdpi-screen.png" /&gt;
          &lt;splash density="land-xxxhdpi" src="www/res/screen/android/drawable-land-xxxhdpi-screen.png" /&gt;
          &lt;splash density="port-ldpi" src="www/res/screen/android/drawable-port-ldpi-screen.png" /&gt;
          &lt;splash density="port-mdpi" src="www/res/screen/android/drawable-port-mdpi-screen.png" /&gt;
          &lt;splash density="port-hdpi" src="www/res/screen/android/drawable-port-hdpi-screen.png" /&gt;
          &lt;splash density="port-xhdpi" src="www/res/screen/android/drawable-port-xhdpi-screen.png" /&gt;
          &lt;splash density="port-xxhdpi" src="www/res/screen/android/drawable-port-xxhdpi-screen.png" /&gt;
          &lt;splash density="port-xxxhdpi" src="www/res/screen/android/drawable-port-xxxhdpi-screen.png" /&gt;
      &lt;/platform&gt;
      &lt;platform name="ios"&gt;
          &lt;icon height="57" platform="ios" src="www/res/icon/ios/icon.png" width="57" /&gt;
          &lt;icon height="114" platform="ios" src="www/res/icon/ios/icon@2x.png" width="114" /&gt;
          &lt;icon height="40" platform="ios" src="www/res/icon/ios/icon-40.png" width="40" /&gt;
          &lt;icon height="80" platform="ios" src="www/res/icon/ios/icon-40@2x.png" width="80" /&gt;
          &lt;icon height="50" platform="ios" src="www/res/icon/ios/icon-50.png" width="50" /&gt;
          &lt;icon height="100" platform="ios" src="www/res/icon/ios/icon-50@2x.png" width="100" /&gt;
          &lt;icon height="60" platform="ios" src="www/res/icon/ios/icon-60.png" width="60" /&gt;
          &lt;icon height="120" platform="ios" src="www/res/icon/ios/icon-60@2x.png" width="120" /&gt;
          &lt;icon height="180" platform="ios" src="www/res/icon/ios/icon-60@3x.png" width="180" /&gt;
          &lt;icon height="72" platform="ios" src="www/res/icon/ios/icon-72.png" width="72" /&gt;
          &lt;icon height="144" platform="ios" src="www/res/icon/ios/icon-72@2x.png" width="144" /&gt;
          &lt;icon height="76" platform="ios" src="www/res/icon/ios/icon-76.png" width="76" /&gt;
          &lt;icon height="152" platform="ios" src="www/res/icon/ios/icon-76@2x.png" width="152" /&gt;
          &lt;icon height="29" platform="ios" src="www/res/icon/ios/icon-small.png" width="29" /&gt;
          &lt;icon height="58" platform="ios" src="www/res/icon/ios/icon-small@2x.png" width="58" /&gt;
          &lt;icon height="87" platform="ios" src="www/res/icon/ios/icon-small@3x.png" width="87" /&gt;
          &lt;splash height="1136" platform="ios" src="www/res/screen/ios/Default-568h@2x~iphone.png" width="640" /&gt;
          &lt;splash height="1334" platform="ios" src="www/res/screen/ios/Default-667h.png" width="750" /&gt;
          &lt;splash height="2208" platform="ios" src="www/res/screen/ios/Default-736h.png" width="1242" /&gt;
          &lt;splash height="1242" platform="ios" src="www/res/screen/ios/Default-Landscape-736h.png" width="2208" /&gt;
          &lt;splash height="1536" platform="ios" src="www/res/screen/ios/Default-Landscape@2x~ipad.png" width="2048" /&gt;
          &lt;splash height="768" platform="ios" src="www/res/screen/ios/Default-Landscape~ipad.png" width="1024" /&gt;
          &lt;splash height="2048" platform="ios" src="www/res/screen/ios/Default-Portrait@2x~ipad.png" width="1536" /&gt;
          &lt;splash height="1024" platform="ios" src="www/res/screen/ios/Default-Portrait~ipad.png" width="768" /&gt;
          &lt;splash height="960" platform="ios" src="www/res/screen/ios/Default@2x~iphone.png" width="640" /&gt;
          &lt;splash height="480" platform="ios" src="www/res/screen/ios/Default~iphone.png" width="320" /&gt;
      &lt;/platform&gt;
      &lt;platform name="wp8"&gt;
          &lt;icon height="99" platform="wp8" src="www/res/icon/wp8/ApplicationIcon.png" width="99" /&gt;
          &lt;icon height="159" platform="wp8" src="www/res/icon/wp8/Background.png" width="159" /&gt;
          &lt;splash height="1280" platform="wp8" src="www/res/screen/wp8/screen-portrait.jpg" width="768" /&gt;
      &lt;/platform&gt;
      &lt;platform name="windows"&gt;
          &lt;icon height="150" platform="windows" src="www/res/icon/windows/Square150x150Logo.scale-100.png" width="150" /&gt;
          &lt;icon height="30" platform="windows" src="www/res/icon/windows/Square30x30Logo.scale-100.png" width="30" /&gt;
          &lt;icon height="50" platform="windows" src="www/res/icon/windows/StoreLogo.scale-100.png" width="50" /&gt;
          &lt;splash height="300" platform="windows" src="www/res/screen/windows/SplashScreen.scale-100.png" width="620" /&gt;
          &lt;icon height="120" platform="windows" src="www/res/icon/windows/StoreLogo.scale-240.png" width="120" /&gt;
          &lt;icon height="44" platform="windows" src="www/res/icon/windows/Square44x44Logo.scale-100.png" width="44" /&gt;
          &lt;icon height="106" platform="windows" src="www/res/icon/windows/Square44x44Logo.scale-240.png" width="106" /&gt;
          &lt;icon height="70" platform="windows" src="www/res/icon/windows/Square70x70Logo.scale-100.png" width="70" /&gt;
          &lt;icon height="71" platform="windows" src="www/res/icon/windows/Square71x71Logo.scale-100.png" width="71" /&gt;
          &lt;icon height="170" platform="windows" src="www/res/icon/windows/Square71x71Logo.scale-240.png" width="170" /&gt;
          &lt;icon height="360" platform="windows" src="www/res/icon/windows/Square150x150Logo.scale-240.png" width="360" /&gt;
          &lt;icon height="310" platform="windows" src="www/res/icon/windows/Square310x310Logo.scale-100.png" width="310" /&gt;
          &lt;icon height="150" platform="windows" src="www/res/icon/windows/Wide310x150Logo.scale-100.png" width="310" /&gt;
          &lt;icon height="360" platform="windows" src="www/res/icon/windows/Wide310x150Logo.scale-240.png" width="744" /&gt;
          &lt;splash height="1920" platform="windows" src="www/res/screen/windows/SplashScreenPhone.scale-240.png" width="1152" /&gt;
      &lt;/platform&gt;
      &lt;access origin="*" /&gt;
  
      &lt;platform name="android"&gt;
              &lt;access origin="*" /&gt;
          &lt;allow-intent href="market:*" /&gt;
      &lt;/platform&gt;
      &lt;platform name="ios"&gt;
          &lt;access origin="*.google.*" /&gt;
              &lt;access origin="*" /&gt;
          &lt;allow-intent href="itms:*" /&gt;
          &lt;allow-intent href="itms-apps:*" /&gt;
      &lt;/platform&gt;
      &lt;access origin="*" /&gt;
  &lt;/widget&gt;</code></pre>
  </div>
  </div>
  </p>