[OpenLayers-Users] editingtoolbar position in custom application
R. Ortner
reinhard.ortner at edu.fh-kaernten.ac.at
Mon Nov 5 05:12:09 EST 2007
I actually made it work for the LayerSwithcher by deactivating a few
parameters in the LayerSwitcher.js:
//this.div.style.top = "100px"; //25px default
//this.div.style.right = "0px";
in the html page:
#layerswitcher {
width: 24.7%;
height: 70%;
border: 0px solid black;
top: 100;
left: 0px;
now i have to find this for the editingtoolbar
R. Ortner wrote:
>
> 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 similar 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#a13584094
Sent from the OpenLayers Users mailing list archive at Nabble.com.
More information about the Users
mailing list