[OpenLayers-Users] OverviewMap Container

Thu Nov 8 05:37:08 EST 2007

The Openlayers css is included programmically and overriding your css:

see: Map.js or Openlayers.js:

// only add a new node if one with an equivalent url hasn't already
// been added
if(addNode) {
     var cssNode = document.createElement('link');
     cssNode.setAttribute('rel', 'stylesheet');
     cssNode.setAttribute('type', 'text/css');
     cssNode.setAttribute('href', this.theme);
     document.getElementsByTagName('head')[0].appendChild(cssNode);
}

So try as told here:
http://www.openlayers.org/dev/examples/custom-style.html

 >> cut
If you care to modify the style of any OpenLayers element, include the 
default stylesheet as a link and declare any style modifications below 
that link. These style declarations can be in other linked stylesheets 
or in style tags. In addition, construct your map with options that 
include {theme: null}. This will disable the default method of loading 
the stylesheet and allow you to declare style rules in your own linked 
stylesheets or style tags.
<< end cut

Richard Duivenvoorde

R. Ortner wrote:
> hi,
> 
> no, i only use my own stylesheet, here is the beginning of my html file:
> 
> 
> <!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/OpenLayers-2.5/theme/geoland_theme/geoland_style.css"
> type="text/css" />
>     <style type="text/css">
> 		
> 		.olControlOverviewMapElement 
> 		{
> 				background-color: green;
> 		} 
>   
> 		.olControlOverviewMapExtentRectangle 
> 		{
> 				border: 2px dotted 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()],  // Weltkugelsymbol
> (Zoom to max extend)  unter dem Zoomregler entfernt
> 			};  
> 			
> 			// options 2 --> optionen für die OverviewMap
> 			var options2 = {projection: "EPSG:31258",
> 							units: 'm',
> 							maxExtent: new OpenLayers.Bounds(390730, 119473, 594760, 238680),
> 							format: 'jpeg',
> 							transparent:"false"
> 							// layers: [lg_wms]
> 							// Baselayer wird automatisch geladen
> 			};
> 						
> 			map = new OpenLayers.Map(('map'),options, { controls: [] });
> 
> 
> 
> 
> 
> --------------------
> 
> what scripts are liable for overwriting the container color?
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> Richard Duivenvoorde wrote:
>> Hi Reinhard,
>>
>> looks like the styles from you stylesheet are overridden by script?
>>
>> Did you include the default stylesheet as a link and declare any style 
>> modifications below that link?
>>
>> Like shown/mentioned here:
>> http://www.openlayers.org/dev/examples/custom-style.html
>>
>> Richard Duivenvoorde
>>
>> R. Ortner wrote:
>>> Hi,
>>>
>>> i put the Overviewmap outside my map with the <div option...
>>>
>>> now i tried to change the color of the container by changing it in the
>>> style.css .olControlOverviewMapElemet Section but no effect.
>>> I made a new custom styleX.css, but it in the html file in the stylesheet
>>> section, but still no effect so far the container color is blue!
>>>
>>> then i tried to but this:
>>>
>>> .olControlOverviewMapElement {
>>> 		background-color: green;
>>>   } 
>>>
>>> to the style section of my html file;
>>> What happens is that when i load the map, very short before the overview
>>> is
>>> loaded the color is green and then it is overwritten by the standard blue
>>> color!
>>>
>>> does anyone know why?
>> _______________________________________________
>> Users mailing list
>> Users at openlayers.org
>> http://openlayers.org/mailman/listinfo/users
>>
>>
> 