Hello,Does anyone know how to add a selection symbol over the results of a relational query? I would like the user to click on a symbol on the map and also bring up new selection symbols for the events that are related to it. Here is the code: <script type="text/javascript" language="Javascript">
dojo.require("esri.map");
dojo.require("esri.tasks.query");
dojo.require("esri.toolbars.draw");
dojo.require("dojox.color.Palette");
dojo.require("esri.layers.FeatureLayer");
dojo.require("dojox.grid.DataGrid");
dojo.require("dojo.data.ItemFileReadStore");
dojo.require("dijit.layout.BorderContainer");
dojo.require("dijit.layout.ContentPane");
var map, wellFeatureLayer, toolbar, grid, store, resizeTimer;
var selectionSymbol;
function init() {
var startExtent = new esri.geometry.Extent(-90.5328,40.4344,-87.2582,45.64041, new esri.SpatialReference({wkid:4326}) );
//
map = new esri.Map("mapDiv", {extent:esri.geometry.geographicToWebMercator(startExtent)});
dojo.connect(map, "onLoad", initTopQueryFunctionality);
var tiledLayer = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer");
map.addLayer(tiledLayer);
//
var imageParams = new esri.layers.ImageParameters();
// 0 = Events Points
imageParams.layerIds = [0];
imageParams.layerOption = esri.layers.ImageParameters.LAYER_OPTION_SHOW;
//content for the info-window
var content = "<b>Object ID:</b> ${EventID}<br>" +
"<b>Event ID:</b> ${City}<br>"+
"<b>Fee:</b> $${EventName}<br>"+
"${ObjectID}";
//Adds the entire Map we've created and placed on the server
var dynamicLayer = new esri.layers.ArcGISDynamicMapServiceLayer("http://studentgisserver.uww.edu/ArcGIS/rest/services/Workforce/MapServer", {imageParameters:imageParams});
map.addLayer(dynamicLayer);
// Adds icon over the point after clicked
// var selectionSymbol = new esri.symbol.SimpleMarkerSymbol().setColor("white");
//Allows the Events point (layerIds = 0) to be used in query
wellFeatureLayer = new esri.layers.FeatureLayer("http://studentgisserver.uww.edu/ArcGIS/rest/services/Workforce/MapServer/0", {
mode: esri.layers.FeatureLayer.MODE_SELECTION,
outFields: ["*"],
//The info in the Event pop-up window
infoTemplate: new esri.InfoTemplate("Event: ${EventName}", content)
});
selectionSymbol = new esri.symbol.SimpleMarkerSymbol();
//STYLE_ can be : CROSS,SQUARE,X, OR DIAMOND
selectionSymbol.setStyle(esri.symbol.SimpleMarkerSymbol.STYLE_DIAMOND);
selectionSymbol.setSize(16);
selectionSymbol.setColor(new dojo.Color([200,225,150,0.9]));
//Adds the selectionSymbol to the Events layer
wellFeatureLayer.setSelectionSymbol(selectionSymbol);
//findsRelatedRecords for the Events layer
dojo.connect(wellFeatureLayer, "onSelectionComplete", findRelatedRecords);
map.addLayer(wellFeatureLayer);
dojo.connect(map, "onClick", findWells);
}
function initTopQueryFunctionality(map) {
dojo.connect(dijit.byId('mapDiv'), 'resize', function() {
resizeMap();
});
}
function findRelatedRecords(features) {
console.log('finding related records', features, features.length);
var relatedTopsQuery = new esri.tasks.RelationshipQuery();
relatedTopsQuery.outFields = ["*"];
relatedTopsQuery.relationshipId = 0;
// Create array of objectIds
var ids = dojo.map(features, function (f) {
return f.attributes.ObjectID;
});
console.log('ids: ', ids);
relatedTopsQuery.objectIds = ids;
wellFeatureLayer.queryRelatedFeatures(relatedTopsQuery, function (recs) {
console.log('related: ', recs);
// Build an array for the grid
var items = [];
// Recs is an object where each property is the objectid for a feautre
// with related records
for (id in recs) {
// For each related record, create an item which will correspond to
// a row in the data grid
dojo.forEach(recs[id].features, function (feat) {
var graphic = feat;
graphic.setSymbol(selectionSymbol);
map.graphics.add(graphic);
alert('set symbol 4')
items.push(feat.attributes);
});
}
//Create data object to be used in store
var data = {
// Identifier and label are case-sensitive
identifier: "OBJECTID",
//This field needs to have unique values
label: "ObjectID",
items: items
};
//Create data store and bind to grid.
store = new dojo.data.ItemFileReadStore({
data: data
});
grid.setStore(store);
grid.setQuery({
OBJECTID: '*'
});
});
}
function findWells(evt) {
grid.setStore(null);
var selectionQuery = new esri.tasks.Query();
var tol = map.extent.getWidth()/map.width * 5;
var x = evt.mapPoint.x;
var y = evt.mapPoint.y;
var queryExtent = new esri.geometry.Extent(x-tol,y-tol,x+tol,y+tol,evt.mapPoint.spatialReference);
selectionQuery.geometry = queryExtent;
wellFeatureLayer.selectFeatures(selectionQuery,esri.layers.FeatureLayer.SELECTION_NEW);
//wellFeatureLayer.setSelectionSymbol(selectionSymbol);
}
//Handle resize of browser
function resizeMap(){
clearTimeout(resizeTimer);
resizeTimer = setTimeout(function(){
map.resize();
map.reposition();
}, 500);
}
dojo.addOnLoad(init);
</script>
I cannot seem to figure this out. Please help!! Thanks!Patrick