Latest Contributions by AlexGole

Hi all, I am working on getting my web application to do something similar to the ArcGIS API for JavaScript Sandbox. The goal is to create a popup infowindow when the user hovers a certain graphic on the map. This uses the GraphicLayer module. The problem here Is that I am already managing other graphic layers that I want to clear separately. In order to do . I use GL.id ="name"; I tried to replicate this for this info window when users hover but it seems like I am not getting any good results. Here is the code infoTemplate on hover (starts when I setup a querytask): dojo.connect(map, "onLoad", function () {                          initialExtent = map.extent;                          dojo.create("div", {                              className: "esriSimpleSliderHomeButton",                              title: 'Zoom to Full Extent',                              onclick: function () {                                  if (initialExtent === undefined) {                                      initialExtent = map.extent;                                  }                                  map.setExtent(initialExtent);                              }                          }, dojo.query(".esriSimpleSliderIncrementButton")[0], "after");                          //get rid of the javascript:void(0) statusbar message.                          domAttr.remove(dojo.query(".action.zoomTo", map.infoWindow.domNode)[0], 'href');                          domAttr.set(dojo.query(".action.zoomTo", map.infoWindow.domNode)[0], 'style', 'cursor:pointer;');                          //add the overview map                          domStyle.set(dojo.query(".draggable")[0], "display", "block");                          overviewMapDijit = new esri.dijit.OverviewMap({                              map: map,                              width: 250,                              height: 150,                              attachTo: "top-right"                          }, dojo.byId('overviewMapDiv'));                          overviewMapDijit.startup();                          domStyle.set(dojo.query(".draggable")[0], "display", "none");                          //Adding the two Graphics Layers here                          var CoordGL = new GraphicsLayer();                          CoordGL.id = 'coordinatesGL';                          var DrawGL = new GraphicsLayer();                          DrawGL.id = 'drawGL';                          var TreatGraphicsLayer = new GraphicsLayer();                          TreatGraphicsLayer.id = 'TreatGL';                          //combine all the map add layers into this one                          map.addLayers([CoordGL, DrawGL, dynaLayer1, TreatGL]);                          //combine the two different map onLoad listeners you had into this one listener                          selectionToolbar = new Draw(map);                          selectionToolbar.on("draw-end", function (evt) {                              selectionToolbar.deactivate();                              //fixed issue with extra "solid" in the symbol                              var symbol3 = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID, new SimpleLineSymbol("dash", new Color([255, 0, 0]), 2), new Color([255, 255, 0, 0.25]));                              var gra = new Graphic(evt.geometry, symbol3);                              map.getLayer("drawGL").add(gra);                          });                          var queryTask = new QueryTask("http://webgisdevint1/arcgis/rest/services/Alex_Try/Labeling/MapServer/1");                          //build query filter                          var query = new Query();                          query.returnGeometry = true;                          query.outFields = ["Proj_Name", "Treat_Name", "Treat_Num", "Treat_Cost", "AlexStatus"];                          query.outSpatialReference = { "wkid": 102100 };                          query.where = "Selection = 'All'";                          var infoTemplate = new InfoTemplate();                          var content = "<b>Status: </b>${AlexStatus}<br/>" +                                        "<b>Treatment Name: </b>${Treat_Name}<br/>" +                                        "<b>Treatment Number: </b>${Treat_Num}<br/>" +                                        "<b>Treatment Cost: </b>${Treat_Cost}";                          infoTemplate.setTitle("${Proj_Name}");                          infoTemplate.setContent(content);                          map.infoWindow.resize(245, 125);                          //Can listen for complete event to process results                          //or can use the callback option in the queryTask.execute method.                          queryTask.on("complete", function (event) {                              map.graphics.clear();                              var highlightSymbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,                                new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,                                  new Color([255, 0, 0]), 3), new Color([125, 125, 125, 0.35]));                              var symbol5 = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,                                new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,                                  new Color([255, 255, 255, 0.35]), 1), new Color([125, 125, 125, 0.35]));                              var features = event.featureSet.features;                                                                                        //QueryTask returns a featureSet.                              //Loop through features in the featureSet and add them to the map.                              var featureCount = features.length;                              for (var i = 0; i < featureCount; i++) {                                  //Get the current feature from the featureSet.                                  var graphic = features; //Feature is a graphic                                  graphic.setSymbol(symbol5);                                  graphic.setInfoTemplate(infoTemplate);                                  map.getLayer("TreatGL").add(graphic);                              }                              map.graphics.enableMouseEvents();                              //listen for when the mouse-over event fires on the countiesGraphicsLayer                              //when fired, create a new graphic with the geometry from event.graphic                              //and add it to the maps graphics layer                              TreatGraphicsLayer.on("mouse-over", function (event) {                                  map.getLayer("TreatGL").clear();//use the maps graphics layer as the highlight layer                                  var graphic = event.graphic;                                  map.infoWindow.setContent(graphic.getContent());                                  map.infoWindow.setTitle(graphic.getTitle());                                  var highlightGraphic = new Graphic(graphic.geometry, highlightSymbol);                                  map.graphics.add(highlightGraphic);                                  map.infoWindow.show(event.screenPoint,                                    map.getInfoWindowAnchor(event.screenPoint));                              });                              //listen for when map.graphics mouse-out event is fired                              //and then clear the highlight graphic                              //and hide the info window                              map.graphics.on("mouse-out", function () {                                  map.getLayer("TreatGL").clear();                                  map.infoWindow.hide();                              });                          });                          queryTask.execute(query);                      Here is my script: Cal Fire JQuery Template What am I doing wrong here? Thank you, Alex ... View more

Hi all, I am looking to have something similar to the TOC widget slider but, I would change the layer's opacity by click a bootstrap button. I am looking for a looping javascript that would allow the users to go from 0% - 100% by clicking. I am not really sure how to do this. Any help is welcome, thanks, Alex ... View more

Hi all, I am trying to get bootstraps checkboxes to work with toggling layers. I am not quite sure why it is not working. Here is the ESRI template script that I modified: <!DOCTYPE html> <html>   <head>     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">     <!--The viewport meta tag is used to improve the presentation and behavior of the samples       on iOS devices-->     <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">     <title>Explicitly Create Map Service Layer List</title> <link rel="stylesheet" href="https://community.esri.com//ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/themes/smoothness/jquery-ui.css" /> <link rel="stylesheet" href="https://community.esri.com//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> <link rel="stylesheet" href="https://community.esri.com//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">     <link rel="stylesheet" href="http://js.arcgis.com/3.11/dijit/themes/claro/claro.css">     <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css">     <script src="http://js.arcgis.com/3.11/"></script>     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"></script> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>     <script>       var map;       require([         "esri/map",         "esri/layers/ArcGISDynamicMapServiceLayer",         "esri/layers/ImageParameters",         "dojo/dom",         "dojo/on",         "dojo/query",         "dojo/domReady!"       ],         function (Map, ArcGISDynamicMapServiceLayer, ImageParameters, dom, on, query) {           var layer, visibleLayerIds = [];           map = new Map("map");           //Use the ImageParameters to set the visibleLayerIds layers in the map service during ArcGISDynamicMapServiceLayer construction.           var imageParameters = new ImageParameters();           imageParameters.layerIds = [2];           imageParameters.layerOption = ImageParameters.LAYER_OPTION_SHOW;           //can also be: LAYER_OPTION_EXCLUDE, LAYER_OPTION_HIDE, LAYER_OPTION_INCLUDE           layer = new ArcGISDynamicMapServiceLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer",             {"imageParameters": imageParameters});           map.addLayer(layer);           on(dom.byId("layer0CheckBox"), "change", updateLayerVisibility);           on(dom.byId("layer1CheckBox"), "change", updateLayerVisibility);           function updateLayerVisibility () {             var inputs = query(".list_item");             var inputCount = inputs.length;             //in this application layer 2 is always on.             visibleLayerIds = [2];             for (var i = 0; i < inputCount; i++) {               if (inputs.checked) {                 visibleLayerIds.push(inputs.value);               }             }             if (visibleLayerIds.length === 0) {               visibleLayerIds.push(-1);             }             layer.setVisibleLayers(visibleLayerIds);           }         });     </script>   </head>   <body>   This sample loads an ArcGISDynamicMapServiceLayer and presents check boxes for only the layers that should be toggled on and off by users.  <br />     <br />         Layer List : <span id="layer_list"><div class="btn-group" data-toggle="buttons">   <label class="btn btn-primary active">     <input type="checkbox" class='list_item' id='layer1CheckBox' value=0> cities   </label>   <label class="btn btn-primary">     <input type="checkbox" class='list_item' id='layer0CheckBox' value=1> river   </label> </div>         </span><br />         <br />     <div id="map" class="claro" style="width:600px; height:400px; border:1px solid #000;"></div>   </body> </html> Any help is welcome, Thank you, Alex ... View more