0

I am using the two reference samples in the api, toggle and dynamic toggle. I tried to use the method in the basic toggle but the setvisbiblelayers doesn't seem to like my kml layers and I get a javascript error

Object #<HTMLInputElement> has no method 'setVisibleLayers'

Here is where I add my basemap and kml layers.

            dojo.require("esri.map");
            dojo.require("esri.layers.KMLLayer");

            var layer, map, visible = [];

            function init() {
              var beginExt = new esri.geometry.Extent(-81.26, 40.64, -74.10, 42.29, new esri.SpatialReference({wkid:4326}));
              var revExt = esri.geometry.geographicToWebMercator(beginExt);
              var imageParameters = new esri.layers.ImageParameters();
              imageParameters.layerIds = ['base'];
              imageParameters.layerOption = esri.layers.ImageParameters.LAYER_OPTION_SHOW;

              map = new esri.Map("map",{
                basemap:"topo",
                extent:revExt,
                sliderStyle:"small"
              });


              var kml10url = "https://dl.dropboxusercontent.com/...kmz file";
              var hospital2010kml = new esri.layers.KMLLayer(kml10url, {id:"hospital2010kml"});
              var kml00url = "https://dl.dropboxusercontent.com/...kmz file";
              var hospital2000kml = new esri.layers.KMLLayer(kml00url, {id:"hospital2000kml"});
              map.addLayer(hospital2010kml);
              map.addLayer(hospital2000kml);

This works fine. I am able to see both of the layers and the basemap. However when I try to toggle between the layers nothing. So I tried this, which used to work in 2.6 but no longer works in 3.5.

  function updateLayerVisibility() {
                var inputs = dojo.query(".list_item"), input;

                for (var i=0, il=inputs.length; i<il; i++) {
                    if (inputs[i].checked) {
                        console.log("Input Length " +inputs.length);
                        console.log("Inputs in checked " +inputs[i]);
                        if('hospital2010kml' === inputs[i].id)
                        {
                            console.log('Showing hospital2010kml visibility');
                            hospital2010kml.show();
                        }
                        else if('hospital2000kml' === inputs[i].id)
                        {
                            console.log('Showing hospital2000kml visibility');
                            hospital2000kml.show();
                        }
                    console.log(inputs[i].id);  
                    }
                    else{
                        console.log("Input Length Hide " +inputs.length);
                        console.log("Inputs in checked Hide " +inputs[i]);
                        if('hospital2010kml' === inputs[i].id)
                        {
                            console.log('Hiding hospital2010kml visibility');
                            hospital2010kml.hide();
                        }
                        else if('hospital2000kml' === inputs[i].id)
                        {
                            console.log('Hiding hospital2000kml visibility');
                            hospital2000kml.hide();
                        }
                    }
                }

This then gives the error:

SCRIPT438: Object doesn't support property or method 'hide'

It gives an error for show as well. Anybody know how to toggle two separate kml layers? The API says there is a show and hide for kmllayers so I don't know what is up?

  • 1
    Just before calling .show() or .hide(), try inspecting the layer objects themselves by calling console.log(hospital2010kml); -- the object will show up in the developer console and you can inspect its properties/methods etc. If it's a valid KMLLayer object, it should have show/hide methods, as you said. – greenlaw Jun 3 '13 at 15:05
  • @greenlaw thanks for the tip. So apparently there is something wrong with it because it just comes back as [object HTMLInputElement]. On my 2.6 API version it shows up fine. So something up with 3.5 that doesn't like me code. Hmmmm – Xaxum Jun 4 '13 at 0:43
1

The issue was I did not have my kml variables defined outside the init function so when it got to the update layers function it didn't know it was a kml layer. For some reason when I logged the id to console it worked but it was just generic object hence the no show hide commands. I added the declaration outside the init as follows:

var layer, map, hospital2000kml, hospital2010kml, visible = [];

Now it is working... Wow I wasted a lot of time on something I should have caught hours ago.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.