[OpenLayers-Users] Customising the OL interface

Matthew Doyle mtd at bom.gov.au
Fri Jun 6 03:45:25 EDT 2008


Thank you Richard for your suggestion to check panel.html in the examples,
but this doesn't fulfill exactly what I am trying to do.

I wish to re-position and re-size (the former being the more important,
rather than the latter) the PanZoomBar controls so that they are laid out
like in  http://img511.imageshack.us/img511/8654/exampleinterfacepc0.jpg
this image .

I have attempted to do this with CSS, but I see that the PanZoomBar controls
are heavily hardcoded (size, filename, position) within the OpenLayers JS
library: (PanZoomBar.js)

	  var sz = new OpenLayers.Size(18,18);
(...)
	  this._addButton("panup", "north-mini.png", centered, sz);
        px.y = centered.y+sz.h;
        this._addButton("panleft", "west-mini.png", px, sz);
        if (this.zoomWorldIcon) {
            this._addButton("zoomworld", "zoom-world-mini.png", px.add(sz.w,
0), sz);
            wposition *= 2;
        }
        this._addButton("panright", "east-mini.png", px.add(wposition, 0),
sz);
        this._addButton("pandown", "south-mini.png", centered.add(0,
sz.h*2), sz);
        this._addButton("zoomin", "zoom-plus-mini.png", centered.add(0,
sz.h*3+5), sz);
(...)

It doesn't seem immediately able to customise these controls.

So, I ask; how, if at all possible, can I do this? 

Cheers and regards,
Matt





Matthew Doyle wrote:
> 
> Hi OL users,
> 
> We have designed a new set of icons to replace the basic set in the
> OpenLayers theme and now wish to redesign some of the aspects on where
> these should be and how they should work.
> 
> I assumed this to be an easy process which is completely controlled via
> CSS, but have spent the day scratching my head at how some aspects of the
> interface is driven. Simply replacing a few images with the new icons does
> work for the current interface, but we wish to change the position of,
> say, the top left panning buttons and change the size of the increase zoom
> 'plus' button. It doesn't seem immediately obvious how to do this, and
> looks as though some on-the-fly processing of icons is done through the JS
> via element.style="..." 
> 
> I'm sure there have been many others who have already been through this
> process, so i am ask you, is there any FAQ or "how to" on customising the
> OpenLayers interface? 
> 
> I apologise if this is an easy one, but trawling through the style.css
> didn't define some aspects i thought it would.
> 
> Many thanks in advance,
> Matt
> 
> 
> 

-- 
View this message in context: http://www.nabble.com/Customising-the-OL-interface-tp17506906p17686454.html
Sent from the OpenLayers Users mailing list archive at Nabble.com.




More information about the Users mailing list