[OpenLayers-Users] Forcing FramedCloud autoResize when using stylesheets

Adrian Popa adrian_gh.popa at romtelecom.ro
Mon Nov 16 01:36:56 EST 2009


No ideas about this one?

Adrian Popa wrote:
> I did some more digging and it seems the png image which has the 
> elements (borders) of the framed cloud has rather small dimensions:
> # file 
> cloud-popup-relative.png                                                                                                                                     
>
> cloud-popup-relative.png: PNG image data, 676 x 736, 8-bit colormap, 
> non-interlaced
>
> I edited the file and increased the width of the image to 1276. I 
> "streched" the popup window to use the whole width. I looked into 
> openlayers/lib/OpenLayers/Popup/FramedCloud.js and expanded the 
> default sizes for the image and the popup to fit the new image size. 
> If I test this setup, the popup extends ok around my content, but the 
> right-most side of the popup loses its rounded corners. Also the 
> "connector" (I guess it's called a stem) between the marker and the 
> popup is sometimes distorted or blank.
>
> This has to do with the definitions of offsets in the positionBlocks. Eg:
>
> positionBlocks: {                                                 
>     "tl": {                                                       
>         'offset': new OpenLayers.Pixel(44, 0),                    
>         'padding': new OpenLayers.Bounds(8, 40, 8, 9),            
>         'blocks': [                                               
>             { // top-left                                         
>                 size: new OpenLayers.Size('auto', 'auto'),        
>                 anchor: new OpenLayers.Bounds(0, 51, 22, 0),      
>                 position: new OpenLayers.Pixel(0, 0)              
>             },                                                    
>             { //top-right                                         
>                 size: new OpenLayers.Size(22, 'auto'),            
>                 anchor: new OpenLayers.Bounds(null, 50, 0, 0),    
>                 position: new OpenLayers.Pixel(-638, 0)           
>             },                                                    
>             { //bottom-left                                       
>                 size: new OpenLayers.Size('auto', 19),            
>                 anchor: new OpenLayers.Bounds(0, 32, 22, null),   
>                 position: new OpenLayers.Pixel(0, -631)           
>             },                                                    
>             { //bottom-right                                      
>                 size: new OpenLayers.Size(22, 18),                
>                 anchor: new OpenLayers.Bounds(null, 32, 0, null), 
>                 position: new OpenLayers.Pixel(-638, -632)        
>             },                                                    
>             { // stem                                             
>                 size: new OpenLayers.Size(81, 35),                
>                 anchor: new OpenLayers.Bounds(null, 0, 0, null),  
>                 position: new OpenLayers.Pixel(0, -688)           
>             }                                                     
>         ]                                                         
>     },                                                            
> ...
>
> Can somebody explain the following:
> 1. bottom-right, bottom-left, top-right, top-left are intended to 
> "carve-out" the rounded popup corners?
> 2. what is "stem" supposed to be?
> 3. How is the position coordinates measured from the file? What do 
> negative coordinates mean (are they measuring from right to left)?
> 4. Is there a more automated way to update these offsets from a file - 
> or should they be imputed by hand - and trial and error?
> 5. Is anyone else interested in wider popups? Usualy you shouldn't 
> need them on normal screens, but I need to display them on large 
> 4000x4000 screens... If there are people interested, I will submit a 
> patch...
> 6. Oh - is there a way to get wider popups without editing the 
> image/offsets? I guess the background of the picture is not "streched" 
> to fit the popup (current behavior).
>
> Thanks,
> Adrian
>
> Adrian Popa wrote:
>> Update:
>>  - it seems I was partially wrong. The div settings for the decoration 
>> divs are correct  - but it seems the popup background image doesn't get 
>> any larger... I will look into it.
>>
>> Adrian Popa wrote:
>>   
>>> Hello everyone,
>>>
>>> I have done some more digging, and it seems the FramedCloud popup has 
>>> a default maximum width of 600px (or so it seems when I inspect items 
>>> with firebug). I tried to set max size to something larger 
>>> (popup.maxSize = new OpenLayers.Size(1300, 1000);) and it seems to 
>>> work (partially).
>>>
>>> The popup gets larger to accomodate content with width greater than 
>>> 600px, but not all the popup's decorations are streched.
>>>
>>> My popup's base id is "activeAlarm" - and from what I can tell the 
>>> following divs get resized:
>>> * activeAlarm_contentDiv
>>> * activeAlarm_GroupDiv
>>> * activeAlarm
>>> ... but the following divs don't get resized:
>>> * activeAlarm_FrameDecorationDiv_1
>>> * activeAlarm_FrameDecorationDiv_2
>>> * activeAlarm_FrameDecorationDiv_3
>>> * activeAlarm_FrameDecorationDiv_4
>>>
>>> I have attached an image that illustrates this. Note that also the 
>>> background of the popup isn't streched (remains transparent) (most 
>>> likely it's one of the decoration divs...).
>>>
>>> Is this a known bug, or am I doing something wrong? If it's a bug, is 
>>> there a quick workaround? I can think of setting the width parameter 
>>> for all the decoration divs, but I'm hoping it won't be necessary...
>>>
>>> Thanks,
>>> Adrian
>>>
>>> Adrian Popa wrote:
>>>     
>>>> Hello everyone,
>>>>
>>>> If this subject has been discussed before, please point me to the 
>>>> relevant thread.
>>>>
>>>> I have a FramedCloud popup which gets its content through an ajax 
>>>> call. Everything works ok  (the popup is the same size as the 
>>>> content) if I don't change the size of the fonts in the popup. In 
>>>> some cases, I have to override the default font size and make it 
>>>> bigger. In these cases, the popup doesn't resize properly. For 
>>>> instance, if the content has 'font-size: 11px' it fits the popup, but 
>>>> if the content has 'font-size: 22px', the popup grows in height, but 
>>>> the width remains the same as the first case.
>>>>
>>>> By the way, my content is usually a table (which has applied the 
>>>> style='font-size: 22px;' attribute).
>>>>
>>>> My questions are:
>>>> 1. Is this behavior a known problem or should autoResize work without 
>>>> problems?
>>>> 2. I could call - as a workaround a function to autoRezise the popup 
>>>> after the ajax call completes. Question is - what is this function? 
>>>> (I haven't found anything in the api)
>>>> 3. I could set maxSize/minSize - but I have no idea how to calculate 
>>>> the width/height of my content (in case there are no other 
>>>> workarounds I could *estimate* it based on number of characters per 
>>>> line + font size - but it's way too cumbersome to be a real solution)
>>>>
>>>> Thanks,
>>>> Adrian.
>>>>
>>>> _______________________________________________
>>>> Users mailing list
>>>> Users at openlayers.org
>>>> http://openlayers.org/mailman/listinfo/users
>>>>
>>>>   
>>>>       
>>
>> _______________________________________________
>> Users mailing list
>> Users at openlayers.org
>> http://openlayers.org/mailman/listinfo/users
>>
>>   
>
> ------------------------------------------------------------------------
>
> _______________________________________________
> Users mailing list
> Users at openlayers.org
> http://openlayers.org/mailman/listinfo/users
>   

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.osgeo.org/pipermail/openlayers-users/attachments/20091116/385c732c/attachment.html


More information about the Users mailing list