CODEWITHSUNDEEP
javascriptwindows-8windows-store-appswinjs
Aleksandar Mihajlovski
Aleksandar Mihajlovski

Reputation: 113

Google is undefined error - Windows 8 metro application

function initialize() {
var mapOptions = {
    center: new google.maps.LatLng(41.001188, 21.330084),
    zoom: 8
};

I'm building Windows 8 metro application using Javascript and I only have one HTML file where I call Initialize function to show Google Map, but the application fails because of this error: "Google is undefined" Does anyone know how can I fix this?

Upvotes: 0

Views: 680

Answers (3)

Vikas Garg
Vikas Garg

Reputation: 190

In case if anyone is facing this issue still then consider to mention this line it first:

        <script src='//maps.googleapis.com/maps/api/js?sensor=false'></script>

And then mention any js resource or anything which is based on the Google Maps Javascript API version 3.

Upvotes: 0

Kraig Brockschmidt - MSFT
Kraig Brockschmidt - MSFT

Reputation: 7024

The issue you're likely having is that you cannot load remote script into the "Local Context" in which an app normally runs. This is spelled out on Features and restrictions by context.

You can load remote script into the "web context" which means you use an x-ms-webview element as the element that hosts the map, and point the Webview to an HTML file that has the remote script reference. I use a similar approach (for Bing Maps) in the sample I build in Chapter 2 (page 72) of my free ebook, Programming Windows Store Apps with HTML, CSS, and JavaScript, Second Edition. In that chapter I start by using an iframe, and then change to x-ms-webview in Chapter 4 (starting on page 191). I also show how to communicate with the iframe/Webview so the app can drive it.

The upshot is that if you try to load remote script into the local context, it's ignored and thus the google namespace will be undefined.

As an alternate approach, you could try downloading the remote script and include it as part of your package, referring to it like you would other JS files in your project. However, there are other restrictions in the local context that might cause this script to fail itself, especially if it's trying to load other remote script. Thus the iframe/Webview approach is more reliable.

By the way, the content URI stuff in the manifest has no bearing on this matter; that applies specifically to the privileges you grant to remote script once it's loaded. See "App Content URIs" in Chapter 4 of the aforementioned book (page 197)

Upvotes: 1

bpires
bpires

Reputation: 79

Could it be that you are missing a reference to the Google API in your HTML file? Something like this inside the Head section:

<script src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=visualization"></script>

Upvotes: 0

Related Questions