I'm venturing into a new world of hybrid mobile development to test the waters and I have a new project I'm currently starting. I can't divulge the specifics yet, but the very first part is to get Google Maps working. I had a harder time doing this than I thought.
1. Assuming you have Phonegap installed and configured correctly, lets create a new project
phonegap create jsmap1 com.kendrickcoleman.jsmap1 jsmap1
2. Lets add some plugin repositories that allow Phonegap to access the native APIs of the phone for Geolocation, accelerometer, and orientation
phonegap local plugin add org.apache.cordova.geolocation phonegap local plugin add org.apache.cordova.device-motion phonegap local plugin add org.apache.cordova.device-orientation
3. Go get your Google Maps API
- go to https://console.developers.google.com and login
- Create a Public Google Maps API Browser Key.
- New Public Key
- Browser Key
- Leave it blank unless you know what domain this will be accessed from
- Click Create
4. Edit your CSS, HTML, and Javscript to the following.
5. Now you can spin up the emulator or run phonegap serve to create a listener and use your Phonegap application to debug everything in real time.