[OpenLayers-Users] Ancored Popup Autosize troubles

smithfield willsmithfield at gmail.com
Wed Jan 28 10:12:37 EST 2009


Unfortunately, that didn't really answer the question.  Could you be more
specific?

Thanks.


小粟 wrote:
> 
> I just checked the content size and set the popup size dynamicly.
> 
> Regards,
> suen
> 
> ----- Original Message ----- 
> From: "smithfield" <willsmithfield at gmail.com>
> To: <users at openlayers.org>
> Sent: Tuesday, January 27, 2009 9:40 AM
> Subject: [OpenLayers-Users] Ancored Popup Autosize troubles
> 
> 
>> 
>> Hello list.  I have my map just about where I need it but the anchored
>> popups
>> are giving me a hard time.  I have tried to include the autosize command
>> with little luck.  Any thoughts?
>> 
>> Regards-WS
>> 
>> <html xmlns="http://www.w3.org/1999/xhtml">
>>  <head>
>>    <title>World Map</title>
>>    <style type="text/css">
>>        #map {
>>            width: 1000px;
>>            height: 600px;
>>            border: 1px solid black;
>>        }
>>    </style>
>> 
>>    <script
>> src='http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAjpkAC9ePGem0lIq5XcMiuhR_wWLPFku8Ix9i2SXYRVK3e45q1BQUd_beF8dtzKET_EteAjPdGDwqpQ'></script>
>>    <script type="text/javascript"
>> src="http://openlayers.org/api/OpenLayers.js"></script>
>>    <script type="text/javascript" src="data/world_borders.js"></script>
>>    <script type="text/javascript">
>>        var map;
>>        var popup;
>> 
>>       
>>        function init(){
>> 
>>            var options = {
>>                projection: new OpenLayers.Projection("EPSG:900913"),
>>                displayProjection: new OpenLayers.Projection("EPSG:4326"),
>>                units: "m",
>>                maxResolution: 156543.0339,
>>                numZoomLevels: 10,
>> 
>>                maxExtent: new OpenLayers.Bounds(-20037508.34,
>> -20037508.34,
>>                                                 20037508.34, 20037508.34)
>>            }; 
>> 
>> 
>>            map = new OpenLayers.Map('map',options);
>> 
>>         
>>            var gmap = new OpenLayers.Layer.Google("Google Streets", 
>>            {
>>                'sphericalMercator': true
>>            });
>> 
>> 
>>            map.addLayer(gmap);
>> 
>>           
>>            var colors =
>> ["#7d0000","#be0b00","#e65100","#ff9700","#fcc900"];
>> 
>>            var ranges = [15,30,45,60,75]; 
>>            var context = {
>>                getColor: function(feature) {
>>                    for (var i = 0; i < ranges.length; i++){
>>                       if (feature.attributes.Act_T <= ranges[i]){
>>                           return colors[i];
>>                           //return "#99000d";
>>                       }
>>                    }
>>                }
>>            };
>> 
>>            var template = {
>>                fillColor: "${getColor}", // using
>> context.getColor(feature)
>>                fillOpacity: ".75",
>>                strokeColor:"black",
>>                strokeWidth:1
>>            };
>> 
>>            var style = new OpenLayers.Style(template, {context:
>> context});
>>            var styleMap = new OpenLayers.StyleMap({'default': style,
>> select: {fillColor: "333333"}, hover: {fillColor: "333333"}});  
>> 
>>            var geoJSON = new OpenLayers.Format.GeoJSON();
>>            var world_borders = new OpenLayers.Layer.Vector("Open Source
>> Activity",{styleMap:styleMap, isBaseLayer: false, 
>>            projection: new OpenLayers.Projection("EPSG:4326"), 
>>            attribution: " www.zzzzz.com zzzz "});
>>            world_borders.addFeatures(geoJSON.read(features));
>>            map.addLayer(world_borders);
>> 
>>           
>>            var select = new
>> OpenLayers.Control.SelectFeature(world_borders,{hover:true,clickFeature:createPopup,onUnselect:unSelect});
>>            map.addControl(select);
>>            select.activate();
>> 
>>            map.addControl(new OpenLayers.Control.MousePosition());
>>            var center = new OpenLayers.LonLat(0,30);
>>           
>> center.transform(map.displayProjection,map.getProjectionObject());
>>            map.setCenter(center, 2);
>>        }
>>        
>>        
>>        function createPopup(feature){
>>            if (popup != null) {
>>                map.removePopup(popup);
>>                popup.destroy();
>>                popup = null;
>>            }
>>            feature.lonlat =
>> feature.geometry.getBounds().getCenterLonLat();
>> 
>>            if (popup == null) {
>> 
>>                popup = new OpenLayers.Popup.Anchored ("popup",
>> feature.lonlat, new OpenLayers.Size(200,200),
>> null, null, null, 
>>                           function () { 
>>                               map.removePopup( popup ); popup.destroy();
>> popup = null;
>>                           });
>> 
>> 
>>                var content = "<div>"+ feature.attributes.CNTRY_NAME +
>> "</div><br>" +
>>                    "<div><table>" +
>>                    "<tr><th align='right'>Overall Rank:</th><td> " +
>> feature.attributes.Act_T + "</td></tr>" +
>>                    "<tr><th align='right'>Government Rank:</th><td> " +
>> feature.attributes.Act_G + "</td></tr>" +
>>                    "<tr><th align='right'>Industry Rank:</th><td>" +
>> feature.attributes.Act_I + "</td></tr>" +
>>                    "<tr><th align='right'>Community Rank:</th><td> " +
>> feature.attributes.Act_C + " </td></tr>" +
>>                    "</table></div>";
>>                popup.setContentHTML(content);
>> 
>>                popup.setBackgroundColor("white");
>>                popup.setOpacity(1);
>>                popup.events.register('mousemove', popup, function (e)
>> {try{e.stopPropagation();}catch(e){}});
>>                map.addPopup(popup);
>> 
>>          } else {
>>                map.removePopup(popup);
>>                popup.destroy();
>>                popup = null;
>>           }
>> 
>>        }
>> 
>>        
>>       function unSelect(){
>>            if (popup != null) {
>>                map.removePopup(popup);
>>                popup.destroy();
>>                popup = null;
>>            }
>>        }
>> 
>> 
>>    </script>
>>  </head>
>>  <body onload="init()">
>>    <center>
>>      <div id="map"></div>
>>    </center>
>>  </body>
>> </html>
>> 
>> 
>> any thoughts on disabling the scroll wheel would be great too!
>> 
>> Thanks
>> -- 
>> View this message in context:
>> http://n2.nabble.com/Ancored-Popup-Autosize-troubles-tp2221855p2221855.html
>> Sent from the OpenLayers Users mailing list archive at Nabble.com.
>> 
>> _______________________________________________
>> 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
> 
> 

-- 
View this message in context: http://n2.nabble.com/Ancored-Popup-Autosize-troubles-tp2221855p2232720.html
Sent from the OpenLayers Users mailing list archive at Nabble.com.




More information about the Users mailing list