Hello!I'm trying to add a feature layer(a simply line feature, storing locally in arcgis server) to a map. Then select it for querying and highlighting. The query part works fine. But I couldn't get it highlighted. Can someone have a look at my code and show me the hint? Thank you very much for help.<!DOCTYPE html> <html> <head> <title>Pigeon Schematics</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/dojo/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.9/js/esri/css/esri.css" /> <style> html, body { width: 100%; height: 100%; margin: 0; } /*left*/ #leftContainer{ width: 12%; } /*middle*/ #middleContainer{ padding: 0; } #handle{ background: url(../handle.png) center center no-repeat; cursor: ew-resize; width: 10px; position: absolute; top: 0; right: 0; bottom: 0; } #mapDiv1{ padding: 0; height: 70%; } #mapDiv2{ padding: 0; height: 30%; } /*right*/ #rightContainer{ padding:0; width:10%; font-size: 15px; } #legendDiv{ font-size: 10px; } #att1{ height:50%; } #att2{ height:50%; } </style> <script src="http://js.arcgis.com/3.9/"></script> <script> // function init() { // //alert("Dojo ready, version:" + dojo.version); // // More initialization here // } require([ "esri/map", "esri/InfoTemplate", "esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleFillSymbol", "esri/Color", "esri/arcgis/utils", "esri/dijit/Legend", "esri/layers/FeatureLayer", "esri/layers/ArcGISDynamicMapServiceLayer", "esri/graphic", "esri/tasks/query", "esri/tasks/QueryTask", "dojo/parser", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dijit/layout/AccordionContainer", "dijit/layout/TabContainer", "dojo/domReady!" ], function(Map, InfoTemplate, SimpleLineSymbol, SimpleFillSymbol, Color, arcgisUtils, Legend, FeatureLayer, ArcGISDynamicMapServiceLayer, Graphic, Query, QueryTask, parser){ parser.parse(); //add services var map1; var url3 = "http://localhost:6080/arcgis/rest/services/Pigeon/PigeonShape/FeatureServer/3"; map1 = new Map("mapDiv1",{ basemap: "topo", center: [6.161323, 52.256595], zoom: 16, slider: false, }); var featureLayerSpoor = new FeatureLayer(url3, { mode: FeatureLayer.MODE_ONDEMAND, outFields: ["*"] }); map1.addLayers([featureLayerSein, featureLayerWisselNummber, featureLayerSpoor, featureLayerWissel]); //add legend var legend = new Legend({ map: map1 },"legendDiv"); legend.startup(); var selectionSymbol = new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color([255,255,0,0]), 3); featureLayerSpoor.setSelectionSymbol(selectionSymbol); //map1 Click evt // map1.on("click", executeQueryTask); queryTaskSpoor = new QueryTask(url3); querySpoor = new Query(); querySpoor.outSpatialReference = {"wkid":28992}; querySpoor.returnGeometry = true; querySpoor.outFields = ["*"]; dojo.connect(map1, "onClick", executeQueryTask); dojo.connect(map1.infoWindow, "onHide"); function executeQueryTask(evt){ map1.infoWindow.hide(); map1.graphics.clear(); var centerPoint = new esri.geometry.Point(evt.mapPoint.x,evt.mapPoint.y,evt.mapPoint.spatialReference); var mapWidth = map1.extent.getWidth(); //Divide width in map units by width in pixels var pixelWidth = mapWidth/map1.width; var tolerance = 8 * pixelWidth; console.log(mapWidth, tolerance); //Build tolerance envelope and set it as the query geometry var queryExtent = new esri.geometry.Extent(1,1,tolerance,tolerance,evt.mapPoint.spatialReference); querySpoor.geometry = queryExtent.centerAt(centerPoint); queryTaskSpoor.execute(querySpoor, function(fset){ showFeature(fset.features[0],evt)}); }; function showFeature(feature, evt){ map1.graphics.clear(); var graphic = feature; // graphic.setSymbol(symbol); var graphic =new Graphic(feature.geometry, selectionSymbol); // graphic.setInfoTemplate(infoTemplate_spoorshp); console.log(feature); console.log(graphic); map1.graphics.add(graphic); var attr = feature.attributes; var content_spoorshp = "objectid_1 : " + attr.objectid_1 + "<br />spoornumme : " + attr.spoornumme + "<br />objectnaam : " + attr.objectnaam + "<br />objectid : " + attr.objectid + "<br />van : " + attr.kmvan + "<br />to : " + attr.kmtot + "<br />length : " + attr.shape_leng; map1.infoWindow.setTitle("Spoor"); map1.infoWindow.setContent(content_spoorshp); (evt) ? map1.infoWindow.show(evt.screenPoint,map1.getInfoWindowAnchor(evt.screenPoint)) : null; }; }); </script> </head> <body class="claro"> <div id="topContainer" data-dojo-type="dijit/layout/BorderContainer" style="width: 100%; height: 100%;"> <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'">Pigeon Schematics</div> <div id="leftContainer" data-dojo-type="dijit/layout/AccordionContainer" data-dojo-props="region:'left'"> <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="title:'Tool', selected:true"> <div id="tool1"></div> </div> <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="title:'Others'"> This pane could contain tools or additional content </div> </div> <div id="middleContainer" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="region:'center', design:'sidebar'"> <div id="mapDiv1" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'" > </div> <div id="mapDiv2" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'bottom'" > </div> </div> <div id="rightContainer" data-dojo-type="dijit/layout/TabContainer" data-dojo-props="region:'right'" > <div data-dojo-type="dijit/layout/ContentPane" title="Legend"> <div id="legendDiv"></div> </div> <div data-dojo-type="dijit/layout/ContentPane" title="Attribute"> <div id="att1" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'">1</div> <div id="att2" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'bottom'">2</div> </div> </div> <div id="bottomContainer" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'bottom'">CGI GEO-ICT</div> </body> </html>
