I have 2 points feature class, stores, Customers and polyline feature(spider diagram- link each customer to its store), sotreID is a field in all 3 layers attribute tables.
I am trying to create the functionality so that when a user clicks on any store, it's related point feature from customers to be shown on my web app map as well as the spider diagram to be displayed on the map I don't need to show related table on related info in popup info, There is a similar example here Feature layer query multiple , but it's not exactly what I'm looking for because its showing only related tables.
I am wondering how to accomplish this tasks. I have 2 ideas
1- onclick pass the storeID to definition query on the customer feature and show the results in the map or.
2- use relationshipquery.
Any hints or sample Code.
Solved! Go to Solution.
I solved it. its my bad with Javascript
featureLayer.setDefinitionExpression("ED='ED'");
map.addLayer(featureLayer);
featureLayer.on("mouse-out", closeDialog);
/////////////////////////
fld="SiteID";
featureLayer.on("Click", function(events){
var testval=events.graphic.attributes[fld];
//alert( testval);
featureLayer2.setDefinitionExpression('siteID = ' + testval);
featureLayer3.setDefinitionExpression('siteID = ' + testval);
map.addLayer(featureLayer3);
map.addLayer(featureLayer2);
});
I think you're on the right track and both options will work. I would go for the definition expression option (FeatureLayer | API Reference | ArcGIS API for JavaScript 3.19 ).
Thank you Bsson, do you have any snippets code for the definition expression
See the example in the link I provided.
This is the code i have so far.. Still need help fixing the code.
<script src="https://js.arcgis.com/3.19/"></script>
<script>
var map;
require([
"esri/map", "esri/layers/FeatureLayer",
"esri/tasks/query", "esri/geometry/Circle",
"esri/graphic","esri/lang", "esri/InfoTemplate", "esri/symbols/SimpleMarkerSymbol",
"esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleFillSymbol", "esri/renderers/SimpleRenderer",
"esri/config", "esri/Color", "dojo/number", "dojo/dom-style",
"dijit/TooltipDialog", "dijit/popup", "dojo/dom", "dojo/domReady!"
], function(
Map, FeatureLayer,
Query, Circle,
Graphic,esriLang, InfoTemplate, SimpleMarkerSymbol,
SimpleLineSymbol, SimpleFillSymbol, SimpleRenderer,
esriConfig, Color, number,domStyle,ToolTipDialog,dijitPopup, dom
) {
map = new Map("mapDiv", {
basemap: "streets",
center: [-96.685226, 33.167420],
zoom: 14,
});
var featureLayer = new FeatureLayer("ELECTION_STATS_HM_Test/MapServer/0",{
mode: FeatureLayer.MODE_ONDEMAND,
outFields: ["*"]
// opacity: 0.5
});
var featureLayer2 = new FeatureLayer("ELECTION_STATS_HM_Test/MapServer/2",{
mode: FeatureLayer.MODE_ONDEMAND,
outFields: ["*"]
//opacity: 0.5
});
featureLayer.on("mouse-over", showTooltip);
// featureLayer.on("click", showVotes);
featureLayer.on("mouse-out", closeDialog);
featureLayer.setDefinitionExpression("ED='ED'");
map.addLayer(featureLayer2);
map.addLayer(featureLayer);
});
//roster
function showVotes(evt){
// var vsite = evt.graphic.attributes.SiteID;
// console.log(vsite);
// featureLayer2.setDefinitionExpression("siteID=vsite");
}
//tooltip
function showTooltip(evt){
closeDialog();
var tipContent = "<b>Poll Place</b>: " + " <font color='green'>"+ evt.graphic.attributes.POLLPLACE + "</font> " +
"<br><b>ED Count</b>: " + " <font color='green'>" + evt.graphic.attributes.ED_Count + "</font> " + "<br><b>Site ID</b>: " + " <font color='green'>" + evt.graphic.attributes.SiteID + "</font> " ;
var site= evt.graphic.attributes.SiteID;
console.log(site);
var dialog = new dijit.TooltipDialog({
id: "tooltipDialog",
content: tipContent,
style: "position: absolute; width: 250px; font: normal normal bold 6pt Tahoma;z-index:100"
});
dialog.startup();
dojo.style(dialog.domNode, "opacity", 0.85);
dijit.placeOnScreen(dialog.domNode, {x: evt.pageX, y: evt.pageY}, ["TL", "BL"], {x: 10, y: 10});
}
function closeDialog() {
var widget = dijit.byId("tooltipDialog");
if (widget) {
widget.destroy();
}
}
</script>
I solved it. its my bad with Javascript
featureLayer.setDefinitionExpression("ED='ED'");
map.addLayer(featureLayer);
featureLayer.on("mouse-out", closeDialog);
/////////////////////////
fld="SiteID";
featureLayer.on("Click", function(events){
var testval=events.graphic.attributes[fld];
//alert( testval);
featureLayer2.setDefinitionExpression('siteID = ' + testval);
featureLayer3.setDefinitionExpression('siteID = ' + testval);
map.addLayer(featureLayer3);
map.addLayer(featureLayer2);
});