ThinkGeo.com    |     Documentation    |     Premium Support

Some Overlays resize on zoom, some do not

 I was having a problem with server.transfer which I described in another post.


In an attempt at a workaround I moved my client login to the main application page with the map.


 


In order to access map.overlays on the client side there must be a reference to the map overlays on page load.  So in the page load I specify all my overlays and leave them blank, simply as placeholders so that the client can reference them.


 


Then, upon successful login, I launch a client side function to initiate a callback.  The call back clears the map.customoverlays collection, then adds the new overlays back to the customoverlays collection, and redraws the overlays on the client side.


When I zoom, the base map zooms, and my marker overlay zooms, but my custom LayerOverlays do not zoom/resize with the rest of the map.


 


 



Hi Eric, 
  
 Does this still a problem for you? 
  
 We are trying fix the server.transfer problem and will update that in your ticket. 
  
 Regards, 
  
 Don

I started a new project and this problem is recurring, I don’t know what I did to fix it before

Hello Eric, 
  
 Sorry it’s really long time, can you provide some sample we can recreate your problem? 
  
 Regards, 
  
 Gary

Below is sample code.  the SAmapInitialize method is called from the pageload event. 
  
 After we have some information about the user, based on login, the state we are looking at,  the SAmapReset method is called via Callback. 
  
 after some other client information is generated, a zip code list,  SAmapUpdate is called via Callback. 
  
 The problem is that PSA and TSA overlays do not zoom with the rest of the map. 
  
 I have a deployed web application so you can see what I am talking about, but I don’t want to post the username and password here. 
  
  
  
  public static void SAmapInitialize(ref Map map)
        {
            map.MapUnit = GeographyUnit.DecimalDegree;
            map.CurrentExtent = new RectangleShape(-121.5, 40.5, -120.5, 39.5);

            LayerOverlay ZipBordersOverlay = new LayerOverlay(“ZipBorderOverlay”);
            ZipBordersOverlay.IsBaseOverlay = false;
            ZipBordersOverlay.Layers.Clear();
            ZipBordersOverlay.Layers.Add(GetStateLayer(statepath, “zip”));

            map.StaticOverlay.Layers.Clear();

            map.CustomOverlays.Add(ZipBordersOverlay);
            map.CustomOverlays.Add(GetHighwaysOverlay(""));

            map.CustomOverlays.Add(zipSAoverlay("", “PSA”, “”));
            map.CustomOverlays.Add(zipSAoverlay("", “TSA”, “”));
        }

        public static void SAmapReset(ref Map map, string statepath)
        {
            map.StaticOverlay.Layers.Clear();
            map.CustomOverlays.Clear();
            map.StaticOverlay.Layers.Add(GetStateLayer(statepath, “base”));

            LayerOverlay ZipBordersOverlay = new LayerOverlay(“ZipBorderOverlay”);
            ZipBordersOverlay.IsBaseOverlay = false;
            ZipBordersOverlay.Layers.Clear();
            ZipBordersOverlay.Layers.Add(GetStateLayer(statepath, “zip”));
            ZipBordersOverlay.IsVisible = true;
            ZipBordersOverlay.Layers[0].IsVisible = true;

            map.CustomOverlays.Add(ZipBordersOverlay);
            map.CustomOverlays.Add(GetHighwaysOverlay(statepath));

            //map.CustomOverlays.Add();
            //map.CustomOverlays.Add();
        }

        public static void SAmapUpdate(ref Map map, string statepath, string tsalist, string psalist)
        {
            map.CustomOverlays.Remove(“PSA”);
            map.CustomOverlays.Remove(“TSA”);
            map.CustomOverlays.Add(zipSAoverlay(psalist, “PSA”, statepath));
            map.CustomOverlays.Add(zipSAoverlay(tsalist, “TSA”, statepath));
        }  


        public static Layer GetStateLayer(string statepath, string type)
        {
            ShapeFileFeatureLayer stateLayer = new ShapeFileFeatureLayer(statepath + @"\zips\zips.shp");

            if (type == “base”) { 
                stateLayer.ZoomLevelSet.ZoomLevel01.DefaultAreaStyle = AreaStyles.CreateSimpleAreaStyle(GeoColor.StandardColors.LightGray, GeoColor.StandardColors.LightGray); 
            }
            if (type == “zip”) {
                stateLayer.ZoomLevelSet.ZoomLevel01.DefaultAreaStyle = AreaStyles.CreateSimpleAreaStyle(GeoColor.SimpleColors.Transparent, GeoColor.StandardColors.White); 
            }

            //stateLayer.ZoomLevelSet.ZoomLevel01.DefaultAreaStyle = AreaStyles.CreateSimpleAreaStyle(GeoColor.StandardColors.LightGray, GeoColor.StandardColors.LightGray);
            stateLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;

            return stateLayer;
        }


        public static LayerOverlay GetZipBorderOverlay(string statepath)
        {
            ShapeFileFeatureLayer ZipBorderLayer = new ShapeFileFeatureLayer();
            if (statepath != “”) { ZipBorderLayer = new ShapeFileFeatureLayer(statepath + @“zips\zips.shp”); }

            ZipBorderLayer.Name = “ZipBorderLayer”;
            AreaStyle BaseStyle = new AreaStyle();
            BaseStyle.OutlinePen.Color = GeoColor.StandardColors.White;

            ZipBorderLayer.ZoomLevelSet.ZoomLevel01.DefaultAreaStyle = BaseStyle;
            ZipBorderLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;

            LayerOverlay ZipBorderOverlay = new LayerOverlay(“ZipBorderOverlay”);
            ZipBorderOverlay.Layers.Add(ZipBorderLayer);

            return ZipBorderOverlay;
        }
        public static LayerOverlay GetHighwaysOverlay(string statepath)
        {
            ShapeFileFeatureLayer highwayslayer = new ShapeFileFeatureLayer();
            if (statepath != “”) { highwayslayer = new ShapeFileFeatureLayer(@“C:\Map_Data\US\highways\in101503.shp”); }

            LayerOverlay HighwayOverlay = new LayerOverlay(“HighwaysOverlay”);
            HighwayOverlay.IsBaseOverlay = false;

            highwayslayer.ZoomLevelSet.ZoomLevel01.DefaultLineStyle = LineStyles.CreateSimpleLineStyle(GeoColor.SimpleColors.Black, 2, false);
            highwayslayer.ZoomLevelSet.ZoomLevel01.DefaultTextStyle = TextStyles.Highway5(“ROUTE”);
            highwayslayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;

            //ShapeFileFeatureLayer labellayer = new ShapeFileFeatureLayer(@“C:\Map_Data\CA\labels\labels.shp”);
            //ShapeFileFeatureLayer labellayer = new ShapeFileFeatureLayer(statepath + @“labels\labels.shp”);
            //labellayer.ZoomLevelSet.ZoomLevel01.DefaultTextStyle = TextStyles.City3(“NAME”);
            //labellayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;

            HighwayOverlay.Layers.Add(highwayslayer);
            //HighwayOverlay.Layers.Add(labellayer);

            return HighwayOverlay;
        }

public static LayerOverlay zipSAoverlay (string ziplist, string sa, string statepath)
        {
            string[] zipArray = ziplist.Split(’,’);

            ShapeFileFeatureLayer shapefilelayer = new ShapeFileFeatureLayer();
            InMemoryFeatureLayer zipLayer = new InMemoryFeatureLayer();

            if (statepath != “”)
            {
                shapefilelayer = new ShapeFileFeatureLayer(statepath + @“zips\zips.shp”);                

                shapefilelayer.Open();
                foreach (string zip in zipArray)
                {
                    zipLayer.InternalFeatures.Add(shapefilelayer.QueryTools.GetFeaturesByColumnValue(“ZCTA5CE10”, zip)[0]);
                }

                shapefilelayer.Close();
            }

            if (sa == “TSA”) { zipLayer.ZoomLevelSet.ZoomLevel01.DefaultAreaStyle = AreaStyles.CreateSimpleAreaStyle(GeoColor.SimpleColors.LightBlue); }
            else { zipLayer.ZoomLevelSet.ZoomLevel01.DefaultAreaStyle = AreaStyles.CreateSimpleAreaStyle(GeoColor.SimpleColors.LightRed); }
            zipLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;

            LayerOverlay SAoverlay = new LayerOverlay(sa);
            SAoverlay.Layers.Add(zipLayer);



            return SAoverlay;

        }


 


Is it possible for me to private message or email you a login, so you can see the problem yourself.

The statepath is simply used to select the correct shape file, for testing any shape file with area shapes will do, the zipSAoverlay method simply generates an overlay with a few area featrues selected.

Hello Eric, 
  
 Thanks for your further information, you can send to forumsupport@thinkgeo.com
  
 Regards, 
  
 Gary

Hello Eric, 
  
 Thanks for your further information and sample website, I can see these two problems, but still I can’t recreate in my side. 
  
 So for the first one, panzoombar does not work in the chrome, I can see the problem in the default page, but after I click “Service Area”, panzoombar works fine in that page, so I think it’s some code conflict maybe, I want to debug on that site, but once I try to run debug tools, the site ask me to re-login, and I can’t type password once the chrome devtools is running, I can’t debug on this, is that possible you can set a temp site that remove the login and I can debug? 
  
 For the zoom problem, what’s the “red layer” layer name(I think it’s this one does not zoom)? I don’t see you using projection, so are you put that layer in an InteractiveOverly or something similar? 
  
 Regards, 
  
 Gary

Regarding the minimap, the red and blue layers are "TSA" and "PSA" overlays, they are in the custom overlay collection on the secondary map, and are first setup in SAmapInitialize, via the zipSAOverlay method, and are refreshed via Callback to SAmapUpdatemethod, and which again calls zipSAoverlay.


 


More to follow.



I have checked and i can open chome dev tools just fine without a refresh, I don’t know what the problem is.  I just hit Ctrl + Shift + I

I have noticed that the panZoomBar items are given Id’s.  I think it’s possible that the two maps generate conflicting Id’s and the Chrome DOM doesn’t like this. 
  
 Assuming this is the problem do you have a suggested workaround?

Hello Eric, 
  
 Thanks for your further information, I tried add two map control into one page, and one control named Map1, one named Map2. 
 Then I test with PanZoomBar, but I can’t recreate the problem, can you show me some of your client side code? How do you add your map? 
  
 And for the debug problem, yes I can open the Chrome dev tools, but once I add breakpoint and begin to debug, I have to click the run button of the dev tools, then it will refresh the page, then your login block me and it’s impossible to type the password in the Chrome. 
  
 I think if you can provide more code, better have a self-contained sample, it’s much easier to find out the root cause. 
  
 Regards, 
  
 Gary

I have emailed you a copy of my project, it is database connected, so won’t run well, but you can see the code now. 
  
 I am able to setbreakpoints in chrome debug mode, and proceed running code without any sort of issue, I don’t know what you are talking about. 
  
 The login is somewhat necessary as it hooks up to the database, which provides client specific information for the program to run correctly.

The SA… methods refer to the small secondary map.

 Hello Eric,


 
 About the pan zoom bar problem, I split the two maps from your code and try to recreate it, still failed, attachment is the sample code I test for, can you have a look at and point me where is the difference?
 
Also about the id problem, if you mean two panzoombar in both map have the id "panzoombar", I think it's ok.
 
 Regards,
 
 Gary

PanZoomBarProblem.zip (1.43 KB)

Any information on the difference in zoom levels between overlays??

Hello Eric, 
  
 I tried your website again today try to debug the "overlays not all zooming together" problem, but I have noticed the red layer and yellow layer works good now, can you confirm if the bug fixed? Or how can I recreate that again? 
  
 Sorry for the inconvenience. 
  
 Regards, 
  
 Gary

The bug is not fixed, but I figured out a work around. 
  
 With the open layers API I redraw the overlays when ever the map is zoomed. 
  
         olMap.events.register("zoomend", olMap, zoomSA); 
  
 function zoomSA(e) { 
     var psa = e.object.getLayer("PSA"); 
     var tsa = e.object.getLayer("TSA"); 
     psa.redraw(true); 
     tsa.redraw(true); 
     psa.setVisibility(true); 
     tsa.setVisibility(true); 
 }

Hello Eric, 
  
 Ok, if you still need us to do anything, just feel free to let me know. 
  
 Regards, 
  
 Gary