<script src='http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAl9RMqSzhPUXAfeBCXOussRTQDbvAygy0cfGJr8dEMAYKf3RWNBQqP9mjKIsqTfmAlz5LOJ3Xpy5s4w'></script>

  <script type="text/javascript">
        var lon = 5;
        var lat = 40;
        var zoom = 5;
        var map, layer;

        function init(){
            layer = new OpenLayers.Layer.WMS( "OpenLayers WMS",
                    "http://vmap0.tiles.osgeo.org/wms/vmap0", {layers: 'basic'} );
            
            

            vlayer = new OpenLayers.Layer.Vector( "Editable" );
            map = new OpenLayers.Map( 'map', {
                controls: [
                    new OpenLayers.Control.PanZoom(),
                    new OpenLayers.Control.EditingToolbar(vlayer)                            
                ]
             });
            
            var gmap = new OpenLayers.Layer.Google(
        "Google Streets", // the default
        {numZoomLevels: 20}
    );
    // Add layer to map
    map.addLayer(gmap);

            map.addLayers([layer, vlayer]);

            map.setCenter(new OpenLayers.LonLat(lon, lat), zoom);


           

        }

   
    </script>

 var map, layer;

        function init(){
            
        layer = new OpenLayers.Layer.WMS( "OpenLayers WMS",
                    "http://vmap0.tiles.osgeo.org/wms/vmap0", {layers: 'basic'} );
        
  // Add Styles
  var myStyles = new OpenLayers.StyleMap({
            "default": new OpenLayers.Style({
                fillColor: "#000",
                fillOpacity: 0.3, 
                strokeColor: "#000",
                strokeOpacity: 0.3,
                strokeWidth: 1,
                graphicZIndex: 1
            }),
            "select": new OpenLayers.Style({
                fillColor: "#ccc",
                fillOpacity: 0.6,
                strokeColor: "#ccc", 
                strokeWidth: 1,
                label: "Label for Mouseover",
                labelAlign: "cc",
                fontColor: "#333333",
                fontOpacity: 0.9,
                fontFamily: "Arial",
                fontSize: 14,
                graphicZIndex: 2
            })
        });

        vlayer = new OpenLayers.Layer.Vector( "Editable",{
            styleMap: myStyles,
            rendererOptions: {zIndexing: true}
        });
        
        map = new OpenLayers.Map( 'map', {
         
        // Add Openlayers Map Controls 
        controls: 
        
                 [
                    new OpenLayers.Control.LayerSwitcher(),
                    new OpenLayers.Control.PanZoom(),
                    new OpenLayers.Control.MousePosition(),
                    new OpenLayers.Control.ScaleLine(),
                    new OpenLayers.Control.OverviewMap(),
                    new OpenLayers.Control.EditingToolbar(vlayer) 
                                               
                 ]    
         });
            
// Make Variables for Google Version 3 
var gphy = new OpenLayers.Layer.Google(
    "Google Physical",
    {type: google.maps.MapTypeId.TERRAIN}
);
var gmap = new OpenLayers.Layer.Google(
    "Google Streets", // the default
    {numZoomLevels: 20}
);
var ghyb = new OpenLayers.Layer.Google(
    "Google Hybrid",
    {type: google.maps.MapTypeId.HYBRID, numZoomLevels: 20}
);
var gsat = new OpenLayers.Layer.Google(
    "Google Satellite",
    {type: google.maps.MapTypeId.SATELLITE, numZoomLevels: 22}
); 

    // Add layers to map
    map.addLayers([gphy, gmap, ghyb, gsat]);

    map.addLayers([layer, vlayer]);
    
    // Google.v3 uses EPSG:900913 as projection, so we have to transform our coordinates
    map.setCenter(new OpenLayers.LonLat(10.2, 48.9).transform(
    new OpenLayers.Projection("EPSG:4326"), 
    map.getProjectionObject()
), 5);

   var panel = new OpenLayers.Control.Panel();
    panel.addControls([
        new OpenLayers.Control.Button({
            displayClass: "helpButton", trigger: function() {alert('help')}, title: 'Help'
        })
    ]);
     map.addControl(panel);