clicking feature point not opening info window

akpagaakpaga — Wed, 06 Jun 2012 14:39:42 GMT

Can someone please let me know know as to why when i click on my feature points , the info window is not showing up:

<html>
 <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=7, IE=9" />
    <!--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>Editable FeatureLayer in Selection Only Mode with Attribute Inspector</title>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/dojo/dijit/themes/claro/claro.css">
    <style>
      html, body {
        height: 98%; width: 98%;
        padding: 0;
        overflow:hidden;
      }
      #mapDiv{
        padding:0;
        border: solid 2px #705B35;
      }
      .roundedCorners {
        -moz-border-radius: 4px;
        border-radius: 4px;
      }
      #detailPane{
        height:20px;
        color:#570026;
        font-size:12pt;
        font-weight:600;
        overflow:hidden;
      }
      .dj_ie .infowindow .window .top .right .user .content { position: relative; }
      .dj_ie .simpleInfoWindow .content {position: relative;}

      .esriAttributeInspector {height:100px;}
      .esriAttributeInspector .atiLayerName {display:none;}
      .saveButton {
        padding-left:45px;
         margin:0px;width:16px; height:16px;
       }
    </style>
   
    <script type="text/javascript">     var dojoConfig = { parseOnLoad: true };</script>
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.8"></script>

    <script type="text/javascript" language="Javascript">
     dojo.require("dijit.layout.BorderContainer");
     dojo.require("dijit.layout.ContentPane");
     dojo.require("esri.map");
     dojo.require("esri.dijit.AttributeInspector-all");


     var map;
     var updateFeature;

     function init() {
      //This sample requires a proxy page to handle communications with the ArcGIS Server services. You will need to  
      //replace the url below with the location of a proxy on your machine. See the 'Using the proxy page' help topic
      //for details on setting up a proxy page.
      esri.config.defaults.io.proxyUrl = "proxy.ashx";
      esri.config.defaults.io.alwaysUseProxy = true;

      var startExtent = new esri.geometry.Extent({
       "xmin": -10591408.5633053,
       "ymin": 3383311.8650482,
       "xmax": -10541870.717486,
       "ymax": 3428122.96783653,
       "spatialReference": {
        "wkid": 3857


       }
      });

      map = new esri.Map("mapDiv", {
       extent: startExtent
      });
      dojo.connect(map, "onLoad", function () {
       //resize the map when the browser resizes
       dojo.connect(dijit.byId('mapDiv'), 'resize', map, map.resize);
      });

      dojo.connect(map, "onLayersAddResult", initSelectToolbar);

      var tiledLayer = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer");
      map.addLayer(tiledLayer);


 

      var petroFieldsMSL = new esri.layers.ArcGISDynamicMapServiceLayer("http://test.com/ArcGIS/rest/services/Houston/Test/MapServer");
      petroFieldsMSL.setDisableClientCaching(true);

      map.addLayer(petroFieldsMSL);
       

      var petroFieldsFL = new esri.layers.FeatureLayer("http://test.com/ArcGIS/rest/services/Houston/Test/FeatureServer/0", {
       mode: esri.layers.FeatureLayer.MODE_SELECTION,
       outFields: ["APP_ID","OBJECTID","VACANT"]
      });
    

      var selectionSymbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_NULL, new esri.symbol.SimpleLineSymbol("dashdot", new dojo.Color("yellow"), 2), null);
      petroFieldsFL.setSelectionSymbol(selectionSymbol);

      dojo.connect(petroFieldsFL, "onEditsComplete", function () {
       petroFieldsMSL.refresh();
      });

      map.addLayers([petroFieldsFL]);
     }



     function initSelectToolbar(results) {


      var petroFieldsFL = results[0].layer;
      var selectQuery = new esri.tasks.Query();


      dojo.connect(map, "onClick", function (evt) {
       selectQuery.geometry = evt.mapPoint;
       petroFieldsFL.selectFeatures(selectQuery, esri.layers.FeatureLayer.SELECTION_NEW, function (features) {
        if (features.length > 0) {
         //store the current feature
         updateFeature = features[0];
         map.infoWindow.setTitle(features[0].getLayer().name);
         map.infoWindow.show(evt.screenPoint, map.getInfoWindowAnchor(evt.screenPoint));
        } else {
         map.infoWindow.hide();
        }
       });

      });

      dojo.connect(map.infoWindow, "onHide", function () {
       petroFieldsFL.clearSelection();
      });



      var layerInfos = [{ 'featureLayer': petroFieldsFL,
       'showAttachments': true,
       'isEditable': true,
       'fieldInfos': [
           { 'fieldName': 'APP_ID', 'isEditable': true, 'tooltip': 'APP_ID', 'label': 'APP_ID:' },
           { 'fieldName': 'Vacant', 'isEditable': true, 'tooltip': 'Vacant', 'label': 'Vacant:' },
           
           ]
      }];



      var attInspector = new esri.dijit.AttributeInspector({
       layerInfos: layerInfos
      },
          dojo.create("div")
        );

      //add a save button next to the delete button
      var saveButton = new dijit.form.Button({ label: "Save", "class": "saveButton" });
      dojo.place(saveButton.domNode, attInspector.deleteBtn.domNode, "after");


      dojo.connect(saveButton, "onClick", function () {
       updateFeature.getLayer().applyEdits(null, [updateFeature], null);
      });


      dojo.connect(attInspector, "onAttributeChange", function (feature, fieldName, newFieldValue) {
       //store the updates to apply when the save button is clicked
       updateFeature.attributes[fieldName] = newFieldValue;
      });

      dojo.connect(attInspector, "onNext", function (feature) {
       updateFeature = feature;
       console.log("Next " + updateFeature.attributes.objectid);
      });


      dojo.connect(attInspector, "onDelete", function (feature) {
       feature.getLayer().applyEdits(null, null, [feature]);
       map.infoWindow.hide();
      });



      map.infoWindow.setContent(attInspector.domNode);
      map.infoWindow.resize(325, 210);


     }

     dojo.addOnLoad(init);

    </script>
  </head>
 
  <body class="claro">
    <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="design:'headline', gutters:false" style="width:100%;height:100%;">
      <div id="detailPane" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'">
        Houston App
      </div>
      <div data-dojo-type="dijit.layout.ContentPane" class="roundedCorners" data-dojo-props="region:'center'" id="mapDiv"></div>
    </div>
  </body>

</html>

Re: clicking feature point not opening info window

akpagaakpaga — Wed, 06 Jun 2012 19:18:09 GMT

changing this line of code to the following way helped me

selectQuery.geometry = pointToExtent(map, evt.mapPoint, 3); //buffers click point by number of pixels(3)

...

function pointToExtent(map, point, toleranceInPixel) {
var pixelWidth = map.extent.getWidth() / map.width;
var toleraceInMapCoords = toleranceInPixel * pixelWidth;
return new esri.geometry.Extent(point.x - toleraceInMapCoords,
point.y - toleraceInMapCoords,
point.x + toleraceInMapCoords,
point.y + toleraceInMapCoords,
map.spatialReference);
}

Re: clicking feature point not opening info window

JenniferGaa — Thu, 07 Jun 2012 12:36:08 GMT

Because if you don't use a function like pointtoExtent the user has to click exactly on the point in order for the infoWindow to pop up. 🙂

topic Re: clicking feature point not opening info window in ArcGIS JavaScript Maps SDK Questions

clicking feature point not opening info window

Re: clicking feature point not opening info window

Re: clicking feature point not opening info window