Using google maps cordova plugin

I have followed the wiki to the tee.

I have gotten the map to display, but then it disappears immediately.

var map;
document.addEventListener("deviceready", function() {
  var div = document.getElementById("map_canvas");

  // Initialize the map view
  map = plugin.google.maps.Map.getMap(div);
  alert("mapped");
  // Wait until the map is ready status.
  map.addEventListener(plugin.google.maps.event.MAP_READY, onMapReady);
}, false);

function onMapReady() {
  var button = document.getElementById("button");
  button.addEventListener("click", onBtnClicked, false);
}

function onBtnClicked() {
  alert("going full screen");
  map.showDialog();
}

I am seeing the map and my alert("mapped") pops up. As soon as i close the alert popup, map disappears and I am left with just a white page with the button to make it full screen.

Tapping on the button, nothing happens. Not even the alert fires.

What am I doing wrong?

PS - This is not an API key issue. I had that problem initially, but then sorted it out. I am not even getting that blank map frame with google logo. Its just a white page with my html elements.

PhoneGap-GoogleMaps-Plugin

Full Screen