AnsweredAssumed Answered

I want when i click on the grid, then drawing a symbol on the map, but my code does not work

Question asked by sinharcgis on Aug 20, 2014
Latest reply on Aug 20, 2014 by sinharcgis

require([

    "esri/map",

      "dojo/ready",

      "dgrid/OnDemandGrid",

       "dojo/dom",

       "dojo/on",

       "esri/graphic",

       "esri/geometry/Point",

      "dgrid/Selection",

      "dojo/store/Memory",

      "dojo/_base/array",

      "dojo/dom-style",

      "dijit/registry",

      "esri/tasks/query",

      "esri/Color",

      "esri/symbols/SimpleMarkerSymbol",

      "esri/InfoTemplate",

      "dojo/_base/Color",

       "esri/renderers/SimpleRenderer",

      "esri/layers/FeatureLayer",

      "esri/symbols/SimpleFillSymbol",

      "esri/symbols/SimpleLineSymbol",

      "esri/tasks/QueryTask",

      "dojo/_base/declare",

      "dojo/number",

      "dojo/on",

      "dojo/parser",

      "dijit/layout/BorderContainer",

      "dijit/layout/ContentPane"

      ], function (

      map,

        ready,

        Grid,

        dom,

        on,

        graphic,

        Point,

        Selection,

        Memory,

        array,

        domStyle,

        registry,

        Query,

        Color,

        SimpleMarkerSymbol,

        InfoTemplate,

        Color1,

        SimpleRenderer,

        FeatureLayer,

        SimpleFillSymbol,

        SimpleLineSymbol,

        QueryTask,

        declare,

        dojoNum,

        on,

        parser

      ) {

          ready(function () {

 

              parser.parse();

              //               

              // create the dgrid

              window.grid = new (declare([Grid, Selection]))({

                  // use Infinity so that all data is available in the grid

                  bufferRows: Infinity,

                  columns: {

 

                      "id": { "label": "STT" },

                      //                      "maso": { "label": "Mã", "formatter": dojoNum.format },

                      "ten": { "label": "Tên" },

                      "diachi": { "label": "địa chỉ" }

                      //                      "dientich": { "label": "Diện tích", "formatter": dojoNum.format }

                  }

              }, "timkiem");

              // add a click listener on the ID column

              grid.on(".field-id:click", selectState);

 

            

 

              window.map = map;

                       var layer = new esri.layers.ArcGISTiledMapServiceLayer("http://192.166.3.252:6080/arcgis/rest/services/NENCHUNG/Nen_chung1/MapServer");

                      myMap.addLayer(layer);

              window.statesUrl = "http://192.166.3.252:6080/arcgis/rest/services/NENCHUNG/Nen_chung1/MapServer/2";

              window.outFields = ["OBJECTID", "ten", "diaChi"];

 

 

              queryTask1 = new QueryTask(window.statesUrl);

              //initialize query

              query1 = new esri.tasks.Query();

              query1.returnGeometry = true;

              query1.outFields = window.outFields;

 

              //initialize InfoTemplate

              infoTemplate1 = new InfoTemplate("${OBJECTID}", "Name : ${OBJECTID}<br/> State : ${ten}<br />Population : ${diaChi}");

 

//              create symbol for selected features

              symbol1 = new SimpleMarkerSymbol();

              symbol1.setStyle(SimpleMarkerSymbol.STYLE_CIRCLE);

              symbol1.setSize(80);

              symbol1.setColor(new Color([255, 255, 0, 1]));

         

 

              var fl = new FeatureLayer(window.statesUrl, {

                  id: "states",

                  mode: 1, // ONDEMAND, could also use FeatureLayer.MODE_ONDEMAND

                  outFields: window.outFields

 

              });

              fl.on("load", function () {

                  fl.maxScale = 0; // show the states layer at all scales

                

              });

 

          

 

              //change cursor to indicate features are click-able

              fl.on("mouse-over", function () {

                  myMap.setMapCursor("pointer");

              });

              fl.on("mouse-out", function () {

                  myMap.setMapCursor("default");

              });

 

            

 

              myMap.addLayer(fl);

 

              myMap.on("layers-add-result", populateGrid(Memory));

           

 

              function populateGrid(Memory) {

                  var qt = new QueryTask(window.statesUrl);

                  //                  TENHUYEN LIKE'%" + dom.byId("search-text").value + "%'

                  var query = new Query();

                  query.where = "ten LIKE'%" + dom.byId("search-text").value + "%'";

                  query.returnGeometry = false;

                  query.outFields = window.outFields;

                  qt.execute(query, function (results) {

                      var data = array.map(results.features, function (feature) {

                          return {

                              // property names used here match those used when creating the dgrid

                              "id": feature.attributes[window.outFields[0]],

                              "ten": feature.attributes[window.outFields[1]],

                              "diachi": feature.attributes[window.outFields[2]]

                              //                              "dientich": feature.attributes[window.outFields[3]]

                          }

                      });

                      var memStore = new Memory({ data: data });

                      window.grid.set("store", memStore);

                  });

              }

              // fires when a row in the dgrid is clicked

              function selectState(e) {

                  query1.where = "1=1";

                  //execute query

                  queryTask1.execute(query1, showResults);

                

              }

 

           

              function showResults(featureSet) {

 

                  //remove all graphics on the maps graphics layer

                  myMap.graphics.clear();

 

                  //Performance enhancer - assign featureSet array to a single variable.

                  var resultFeatures = featureSet.features;

 

                  //Loop through each feature returned

                  for (var i = 0, il = resultFeatures.length; i < il; i++) {

                      //Get the current feature from the featureSet.

                      //Feature is a graphic

                      var graphic = resultFeatures[i];

                      graphic.setSymbol(symbol1);

 

                      //Set the infoTemplate.

                   graphic.setInfoTemplate(infoTemplate1);

 

                      //Add graphic to the map graphics layer.

                      myMap.graphics.add(graphic);

 

                  }

              }        

 

 

            

 

          });

      });

 

  }

Outcomes