ThinkGeo.com    |     Documentation    |     Premium Support

Setting Layers Visible on client-side

#1

Hi,


was just wondering if it is possible to set layers visible on the client-side.


Any info will be greatly appreciated.


thanks


Govin



#2

Hi, Govin


Yes, we can. There are many methods that can implement your requirements. I suggest that you use our built-in client-side JavaScript call back function that is OnOverlaysDrawing. And it will be called before adding the layers colletion to map control. Please refer to the codes in the attachment.
 
One thing you need to pay more attention, which is that you can’t change the visibility of the base layer, but if you need to that please let us know. I will help you with that.
 
If you still have issues then please let us know.
 
Thanks,
 
Khalil

OnOverlaysDrawing.zip (333 Bytes)

#3

Hi Khalil, 
  
 thanks for the reply. What I am actually looking for is something similar to the OverlaySwitcher. The web app is not using the OverlaySwitcher, but a div with checkboxes for the different layers and I want to be able to set a layer visible/invisible when the corresponding checkbox is clicked. Any information or sample code to show me how to do this will be greatly appreciated. 
  
 thanks 
 Regards 
 Govin

#4

 


Govin,
Here is a snip code that maybe is helpful to you.
<script language="javascript" type="text/javascript">
        function layerCheck() {
            var map = Map1.GetOpenLayersMap();
            var layer = map.getLayer("overlay id");
            var checker = document.getElementById("id of checkbox");
            layer.setVisibility(checker.checked);
        }
    </script>
 
Any questions please let us know. Thanks.
Johnny

#5

Hey, 
  
 My problem is that once the layer.visibility is set to false, returning it to true does not make the layer visible again, even though the visibility is verified as true??? 
  
     function hidepsabutton() {

        var map = Map1.GetOpenLayersMap();
        var layer = map.getLayer("UserOverlay");
        var checker = document.getElementById("checkbox");
        layer.setVisibility(checker.checked);
        alert(layer.visibility);

    } 

#6

Hi Eric, 
  
 I tested that work well. 
  
 Here is my test code: 
  
 
        var b = true;

        function hidepsabutton() {
            var map = Map1.GetOpenLayersMap();
            var layer = map.getLayer("UserOverlay");
            var checker = document.getElementById("checkbox");
            b = !b;
            layer.setVisibility(b);
            alert(layer.visibility);
        } 
 
  
  
           <checkbox id="checkbox" onclick="javascript:hidepsabutton();return false;">changestatus</checkbox>
 
  
  
                LayerOverlay overlay = new LayerOverlay("UserOverlay");
                overlay.IsBaseOverlay = false;                
                ShapeFileFeatureLayer countyLayer = new ShapeFileFeatureLayer(MapPath("~/SampleData/world/cntry02.shp"));
                countyLayer.ZoomLevelSet.ZoomLevel01.DefaultAreaStyle = AreaStyles.CreateSimpleAreaStyle(GeoColor.SimpleColors.Red, GeoColor.FromArgb(100, GeoColor.SimpleColors.Blue));
                countyLayer.ZoomLevelSet.ZoomLevel01.ApplyUntilZoomLevel = ApplyUntilZoomLevel.Level20;

                overlay.Layers.Add(countyLayer);
                Map1.CustomOverlays.Add(overlay); 


#7

Thank you for your reply, but this doesn’t solve my problem. 
  
 So if I toggle the layer visibility off, than toggle it again to On, the layer is not visible until the map is Zoomed in or out… 
  
 could this be just on my pc?? 
  
 I really don’t think so

#8

Eric, 
  
 I think you can create a clean project then copy and test my code. 
  
 So that we can make sure whether that’s caused by your some other code or because your environment. 
  
 Because I tested that in my machine works well. 
  
 Regards, 
  
 Don

#9

Still have the same problem, layer does not reappear until after the map is zoomed causing, some sort of rerendering of the map. 
 



function hidepsabutton() {

    var map = Map1.GetOpenLayersMap();
    var layer = map.getLayer("UserOverlay");
    var checker = document.getElementById("PSAcheckbox");
    layer.setVisibility(checker.checked);
}


 

#10

Eric, 
  
 Could you attach your test project in this post? 
  
 Regards, 
  
 Don

#11

 Here, attached are my project files, the link goes to a webversion.  The first checkbox is linked to the layer, it turns of the layer with the submit button.


 


pinonanalytics.com/eric/webform1.aspx


 


 



ProjectFiles.zip (2.92 KB)

#12

Hi Eric,


I tested your online sample, it looks I can show or hide the PSA layer correct many times.


The link as below shows how I teste it: screencast.com/t/X3XkibacaW


Please let me know if I didn't test follow correct way.


Regards,


Don



#13

Thanks Don, I figured it out, so it works properly in IE9 but does not work properly in Chrome.  Why I do not know.  But it’s a browser compatibility issue not a code issue.

#14

Hi Eric, 
  
 Yes that don’t works in chrome browser. Sorry my default browser is IE so I haven’t found that. 
  
 For chrome we have some other issues also, sorry I think we don’t have a good solution for that now, but you can vote in helpdesk.thinkgeo.com/EnhancementTracker for ask our developer make better support for chrome. 
  
 Regards, 
  
 Don