function initMap() {
  map = new GMap2( $("#gmap_div").get(DIND) );
  map.setCenter(new GLatLng(37.785, -122.2), 6); // need this ...
  map.addMapType(G_PHYSICAL_MAP);
  map.setMapType(G_PHYSICAL_MAP);
  map.addMapType(G_SATELLITE_3D_MAP); // add google earth api
  addMyMaps(map);
  map.addControl(new GSmallMapControl());
  map.addControl(new GMapTypeControl());
  map.addControl(new GScaleControl());
  map.addControl(new GOverviewMapControl());
  map.enableContinuousZoom();
  map.enableDoubleClickZoom();
  MAP[DIND].map = map;
}


function initMarkerControls() {
  $('#control_content').append('<div id="marker_controls" class="marker_controls"></div>');
  var html = 'Number of Categories:&nbsp;<select id="nbins_ui" '
           + 'style="font-family:Verdana,sans-serif; font-size:10px;">'
           + '<option value=2>2</option><option value=4>4</option>'
           + '<option value=6 selected=true>6</option><option value=8>8</option>'
           + '<option value=10>10</option></select><br>';
  $('#marker_controls').append(html);


  // Selector - Marker Transparancy
  html = myspacer + 'Transparency:&nbsp;&nbsp;&nbsp;<select id="trans_ui" '
                  + 'style="font-family:Verdana,sans-serif; font-size:10px;">'
                  + '<option value=0 selected=true>0</option><option value=10>10</option>'
                  + '<option value=20>20</option><option value=30>30</option>'
                  + '<option value=40>40</option><option value=50>50</option>'
                  + '<option value=60>60</option><option value=70>70</option>'
                  + '<option value=80>80</option><option value=90>90</option>'
                  + '</select><br>';
  $('#marker_controls').append(html);

            // Minimum value text box
  html = myspacer + 'Minimum Value:&nbsp;<input type=text id="minval_ui" size=10 '
                  + 'style="font-family:Verdana,sans-serif; font-size:10px;">'
                  + '</input><br>';
  $('#marker_controls').append(html);
  $('#minval_ui').val(DATA.realmin.toFixed(DATA[0].rdecimal));

  // Maximum value text box
  html = myspacer + 'Maximum Value:&nbsp;<input type=text id="maxval_ui" size=10 '
                  + 'style="font-family:Verdana,sans-serif; font-size:10px;">'
                  + '</input><br>';
  $('#marker_controls').append(html);
  $('#maxval_ui').val(DATA.realmax.toFixed(DATA[0].rdecimal));

  // Refresh button
  html = myspacer + '<button id="map_refresh_ui">Refresh Map</button><br>';
  $('#marker_controls').append(html);
  $('#map_refresh_ui').click(function () { refreshMap(); } );
}


function initMapAccordion() {
  // remove legend and contents it if it exits
  $('#map_accordion').remove();
  var html = '<div id="map_accordion">' +
             '<div>' +
             '<div class="title"><a>Map Legend</a></div>' +
             '<div id="legend_content" style="overflow:auto; background-color: white;height: 300;"></div>' +
             '</div>' +
             '<div>' +
             '<div class="title"><a>Map Controls</a></div>' +
             '<div id="control_content"></div>' +
             '</div>' +
             '<div>' +
             '<div class="title"><a>Map Layers</a></div>' +
             '<div id="layerselector_content"></div>' +
             '</div>' +
             '</div>';
  $('#tab-map').append(html);
  $('#map_accordion').accordion({
    header: 'div.title',
    alwaysOpen: false,
    autoHeight: false,
    active: '.title:first'
  });

  initLayerSelector();
}

function refreshMap() {
  // Take user inputs and edit the map accordingly.
  nbins = $('#nbins_ui').val();

  var mytrans = $('#trans_ui').val();
  myopacity = 1 - mytrans/100;

  var tmp = $('#minval_ui').val();
  DATA.min = parseFloat(tmp);
  var tmp = $('#maxval_ui').val();
  DATA.max = parseFloat(tmp);

  MAP[DIND].map.clearOverlays();
  $('#map_legend').remove();
  //$("input[ name='contour_toggle']").attr('checked',false);
  $("input[ name='contour_toggle']").remove();
  $("#contour_layer_label").remove();
  RkrigRMP();
  processData();
  addMarkers();
}


function initLayerSelector() {
  // remove div if it is there
  $('#map_layer_selector').remove();
  // add layer selector to map accordion
  var html = '<div id="map_layer_selector" class="map_layer_selector"></div>';
  $('#layerselector_content').append(html);
  html = '<input type="checkbox" name="marker_toggle" checked="checked">&nbsp;<a>Data Markers</a></input><br>';
  $('#map_layer_selector').append(html);

  // attach event listener to radio buttons
  $("input[ name='marker_toggle']").click( function() {    //@ removed deprecated in jquery 1.2 no longer works in 1.3
    if ( $("input[ name='marker_toggle']").attr('checked') ) { 
      for (var i=0; i<MAP[DIND].markerhandle.length; i++) {
        MAP[DIND].map.addOverlay(MAP[DIND].markerhandle[i]);
      }
    } else {
      for (var i=0; i<MAP[DIND].markerhandle.length; i++) {
        MAP[DIND].map.removeOverlay(MAP[DIND].markerhandle[i]);
      }
    }
  });
}