Hi, i tried to implement the editingtoolbar-outside example into my application. Basically it worked to put the toolbar outside my map but the toolbar is displayed on the top right of my html page. How/Where can i change that? I expected that the position is managed by the style section with .olControlEditingToolbar, but changes there have no effect!
here is my html code for the toolbar: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html xmlns="http://www.w3.org/1999/xhtml";> <head> <link rel="stylesheet" href="/usr/share/openlayers-2.5/theme/default/style.css" type="text/css" /> <style type="text/css"> .olControlEditingToolbar { float:left; right: 0px; height: 30px; width: 150px; } #map { width: 800px; height: 500px; border: 0px solid black; position: absolute; top: 40; right: 25%; <!-- float:center; --> } #layerswitcher { width: 25%; height: 60%; border: 0px solid black; } </style> <script src="http://172.21.18.45/openlayers/lib/OpenLayers.js";></script> <script type="text/javascript"> var map; function init(){ var options = { scales: [800000, 600000, 250000, 125000, 75000, 30000, 10000], 'projection':'EPSG:31258', 'units':'m', 'maxExtent': new OpenLayers.Bounds(390730, 119473, 594760, 238680), 'maxResolution': "auto", controls: [new OpenLayers.Control.MouseDefaults()], layers: [l_wms], minRatio: 8, maxRatio: 128 }; map = new OpenLayers.Map($('map'),options, { controls: [] }); map.addControl(new OpenLayers.Control.PanZoomBar()); map.addControl(new OpenLayers.Control.MouseToolbar()); //map.addControl(new OpenLayers.Control.MousePosition()); //map.addControl(new OpenLayers.Control.OverviewMap()); map.addControl(new OpenLayers.Control.Scale()); map.addControl(new OpenLayers.Control.LayerSwitcher({'div':OpenLayers.Util.getElement('layerswitcher'), activeColor:"red"})); map.addControl(new OpenLayers.Control.OverviewMap(options)); //--------------- EditToolbar --------------- // vlayer = new OpenLayers.Layer.Vector( "Custom Layer"); // map.addControl(new OpenLayers.Control.EditingToolbar(vlayer)); vlayer = new OpenLayers.Layer.Vector( "Editable" ); var container = document.getElementById("panel"); var panel = new OpenLayers.Control.EditingToolbar( vlayer, {div: container} ); map.addControl(panel); //END ------- Edit Toolaber -------------- // ------------------------------------------------------------ Layer ---------------------------------------------------------------------// // ------------------------------------------------------------------------------------------------ // ---------------------------------- WMS ----------------------------------------------------- // ------------------------------------------------------------------------------------------------ var g_wms = new ..... var l_wms = new ..... var b_wms = new ..... var lg_wms = new ..... var l_st_wms = new ..... //--------------- Define Layers ------------- map.addLayers([l_wms, b_wms, g_wms, lg_wms, l_st_wms, vlayer]); //map.addControl(new OpenLayers.Control.LayerSwitcher()); //LayerSwitcher Panel map.zoomToMaxExtent(); } </script> </head> <body onload="init()"; style="color: rgb(0, 0, 0); background-color: rgb(0, 0, 0);"> <!-- <h1>Orthophotos</h1> --> <div id="layerswitcher" style="float:center;"></div> <div style="margin-left: 20%;" id="map"; ></div> <div id="panel" class="olControlEditingToolbar"></div> </body> </html> ------ I have a simmilar problem with the layerswitcher outside the map, it is also displayed on the right of my application but the layerswitcher change the position when I make changes in the style section (but the background of the layer allways remain on the right side of the html page) -- View this message in context: http://www.nabble.com/editingtoolbar-position-in-custom-application-tf4750311.html#a13583238 Sent from the OpenLayers Users mailing list archive at Nabble.com. _______________________________________________ Users mailing list [email protected] http://openlayers.org/mailman/listinfo/users
