issue with query and marker

TonyRopson · ‎10-17-2011

hi,
Right now the map displays one web page but I am trying to get a marker on the area that is returned by the query.
Thanks

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>CC test map</title>
    <link href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.5/js/dojo/dijit/themes/claro/claro.css" rel="stylesheet" type="text/css" >
    <script type="text/javascript" src="http://o.aolcdn.com/dojo/1.2.3/dojo/dojo.xd.js"></script>  
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.5"></script>
    <script type="text/javascript">
        dojo.require("esri.tasks.query");
        dojo.require("esri.map"); 
        function init() {
          
          map = new esri.Map("mapDiv");
          var layer = new esri.layers.ArcGISDynamicMapServiceLayer("http://lrs.co.columbia.wi.us/ArcGIS/rest/services/LRS/TaxParcels_Parcels/MapServer")
           map.addLayer(layer);

            queryTask = new esri.tasks.QueryTask("http://lrs.co.columbia.wi.us/ArcGIS/rest/services/LRS/TaxParcels_Parcels/MapServer/0");

            query = new esri.tasks.Query();
            query.returnGeomertry = true;
            query.text = "11177-153";

        queryTask.execute(query, showResults);
 }

 function showResults(featureSet) {

     map.graphics.clear();
     symbol = new esri.symbol.SimpleMarkerSymbol();
     symbol.setStyle(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE);
     symbol.setSize(10);
     symbol.setColor(new dojo.Color([255, 255, 0, 0.5]));
var resultFeatures = featureSet.features;
     for (var i = 0, il = resultFeatures.length; i < il; i++) {

         var graphic = resultFeatures;
         graphic.setSymbol(symbol);

         map.graphics.add(graphic);
     }
 }    
  </script>
</head>
<body>
 <div id="mapDiv" style="width:600px; height:600px; border:1px solid #000;"></div> 

  <input type="button" value="Get Details" onclick=" init()" /> 

</body>
</html>

derekswingley1 · ‎10-17-2011

Hi Tony,

Some suggestions:
-you don't need to load dojo yourself, it's included in the JS API so you can remove your script tag referencing the AOL CDN
-your query returns polygons so you need to use a SimpleFillSymbol, not a SimpleMarkerSymbol (the latter is for points)
-typo when defining query.returnGeomety (your code uses "returnGeomertry")
-use resultFeatures.features in your for loop to add graphics

Here's a working example with these changes:


<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>CC test map</title>
    <link href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.5/js/dojo/dijit/themes/claro/claro.css" rel="stylesheet" type="text/css" >
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.5"></script>
    <script type="text/javascript">
        dojo.require("esri.tasks.query");
        dojo.require("esri.map"); 
        function init() {
          map = new esri.Map("mapDiv");
          var layer = new esri.layers.ArcGISDynamicMapServiceLayer("http://lrs.co.columbia.wi.us/ArcGIS/rest/services/LRS/TaxParcels_Parcels/MapServer")
          map.addLayer(layer);
          dojo.connect(dojo.byId('queryButton'), 'onclick', runQuery);
        }

        function runQuery() {
          queryTask = new esri.tasks.QueryTask("http://lrs.co.columbia.wi.us/ArcGIS/rest/services/LRS/TaxParcels_Parcels/MapServer/0");
          query = new esri.tasks.Query();
          query.returnGeometry = true;
          query.text = "11177-153";
          queryTask.execute(query, showResults);
        }

        function showResults(resultFeatures) {
          console.log('result: ', resultFeatures);
          map.graphics.clear();
          var symbol = new esri.symbol.SimpleFillSymbol();
          for (var i = 0, il = resultFeatures.features.length; i < il; i++) {
             var graphic = resultFeatures.features;
             graphic.setSymbol(symbol);
             map.graphics.add(graphic);
          }
          // zoom to the feature
          if ( resultFeatures.features.length > 0 ) {
          map.setExtent(esri.graphicsExtent(resultFeatures.features));
          }
       }    
       dojo.ready(init);
  </script>
</head>
<body class="claro">
 <div id="mapDiv" style="width:600px; height:600px; border:1px solid #000;"></div> 

  <input type="button" value="Get Details" id="queryButton" /> 

</body>
</html>

TonyRopson · ‎10-18-2011

works good thanks