How To Display A Google Map On Worklight App

I have the following files in Worklight. I want to load the map on the worklight app. It is visible in the 'Design' view but neither on simulator nor on emulator. Kindly help. //in

Solution 1:

Major revision to the answer based on the comments and edits made to the question

See the following Worklight 6.1.0.1 sample project, that demonstrates page navigation and loading of Google Maps in another page in the app.

This sample is based on the same multi-page sample provided by IBM, that your code snippets above are based on:

• Multi-page application with Google Maps

Tesed in Worklight Console preview as well as iOS Simulator.

Solution 2:

Better separate the Javascript from the index.html file and then follow the below steps.

You can simply pass the value on onchange event like

<select onchange="initialize(" + this.value + ")">

Then

function initialize(value) { // process the value
  var myLatlng1 = new google.maps.LatLng(28.5084805,77.2272778);
  var myLatlng2 = new google.maps.LatLng(28.6473116,77.1559846);
  var mapOptions = {
    zoom: 11,
    switch(value){
     case "south": center: myLatlng1; break;
     case "west": center: myLatlng2; break;
    }
}