JS AP! 4.0 Query Results Popup Display

2331
10
Jump to solution
08-18-2016 08:57 AM
DavidColey
Frequent Contributor

Hello - in continuing 3.x - 4.x functionality migraiton I'm running into some problems getting the popup to display query return results.  We (mstranovsky) have a setup sort of like a near me, where we're returning a an intersect based on the search select-result event.  In 3.x it's really straight-forward:

s.on("select-result", showResults);
function showResults(evt) {
 
 mapMain.graphics.clear();
 
 if (evt.source.name == "Search by Address" || evt.source.name == "Search by Street") { //s.activeSource.name
 console.log(evt.source.name);
 
 qPoint = evt.result.feature.geometry;
 buffer = geometryEngine.geodesicBuffer(qPoint, [1], 9035, true);
 //console.log(qPoint); //console.log(buffer); 
 var symbol = new SimpleFillSymbol();
 symbol.setColor(new Color([100,100,100,0.15]));
 symbol.setOutline(null);
 
 var graphicPoly = new Graphic(buffer, symbol);
 mapMain.graphics.add(graphicPoly); //geometry
 
 var queryTran = new Query;
 queryTran.geometry = buffer;
 var tranQuery = lyrMobBnds.selectFeatures(queryTran, FeatureLayer.SELECTION_NEW);
myPopup.setFeatures([tranQuery]);
 myPopup.show(qPoint); //buffer
 }

always worked really well, pass the event point into the geometry engine, buffer it, pass that geom to the query, select the feautures, pass and show the popup.

For 4.x, here's what I'm doing:

app.search.on("select-result", showResults);
 function showResults(evt) {
 app.activeView.graphics.clear;
 
 if (evt.source.name == "Search by Address" || evt.source.name == "Search by Street") { //s.activeSource.name
 console.log(evt.source.name);
 
 qPoint = evt.result.feature.geometry;
 buffer = geometryEngine.geodesicBuffer(qPoint, [1], 9035, true);
 //console.log(qPoint); //console.log(buffer); 
 var symbol = new SimpleFillSymbol({
 color: [100,100,100,0.15],
 style: "solid",
 outline: { // autocasts as esri/symbols/SimpleLineSymbol
 color: "white",
 width: 0
 }
 });
 
 var graphicPoly = new Graphic(buffer, symbol);
 app.activeView.graphics.add(graphicPoly); //geometry
 
 var queryTran = new Query;
 queryTran.geometry = buffer;
 var tranQuery = lyrMobBnds.queryFeatures(queryTran).then(function(mobResult) { //, FeatureLayer.SELECTION_NEW);
 console.log(mobResult);
 app.activeView.popup.open({
 features: [mobResult],
 location: qPoint//result.geometry.centroid
 });
 });

consol.log are clearly showing a result, but I cannot get the result to open in the poup.  I keep getting a type error:

"TypeError: this.selectedFeature.getEffectivePopupTemplate is not a function"

I am not entirely certain I have my query setup correctly, but since the console log is showing the selectedFeature.  Any insight is appreciated-

Thanks

David

Tags (1)
0 Kudos
1 Solution

Accepted Solutions
DavidColey
Frequent Contributor

Thanks Robert, what I can see now is that queryFeatures wants to work against graphics, not features.  If I had done a little more homework by going to the 3.x-4.x functionality matrix

Functionality matrix | ArcGIS API for JavaScript 4.0 

I would have seen that a selectFeatures method for a feature layer (like I'm doing in 3.x) isn't ready yet.  So in my workflow I'm not interested in setting up a template on the graphic as I'd just have to re-write my returns anyway

Thanks-

David

View solution in original post

10 Replies
RobertScheitlin__GISP
MVP Emeritus

David,

   The likely issue is that you need to define a popup template for the graphic in the results as the error is saying that it can not get the template that is associated with the layer that the graphic comes from.

DavidColey
Frequent Contributor

Oh now I can see that.  I'll see what I can do . . . 

0 Kudos
DavidColey
Frequent Contributor

Thanks Robert, what I can see now is that queryFeatures wants to work against graphics, not features.  If I had done a little more homework by going to the 3.x-4.x functionality matrix

Functionality matrix | ArcGIS API for JavaScript 4.0 

I would have seen that a selectFeatures method for a feature layer (like I'm doing in 3.x) isn't ready yet.  So in my workflow I'm not interested in setting up a template on the graphic as I'd just have to re-write my returns anyway

Thanks-

David

JohnGrayson
Esri Regular Contributor

I wonder if this would work:

app.activeView.popup.open({
 features: mobResult.features,
 location: qPoint
 });
DavidColey
Frequent Contributor

Hi John, that's interesting.  I tried it and do see a popup but it still can't access the content.  I also tried 

app.activeView.popup.open({
 features: mobResult.attributes,
 location: qPoint
 });

and the popup briefly displayed a Project title, but it's unstable - i.e. project title attribute only appeared once in the title

0 Kudos
JohnGrayson
Esri Regular Contributor

Make sure the returned features (mobResult.features) in the resulting FeatureSet have the popupTemplate defined.

DavidColey
Frequent Contributor

The feature layers have a defined template, but I am not creating a FeatureSet from the graphics. 

0 Kudos
JohnGrayson
Esri Regular Contributor

- The 'queryFeatures(...)' method returns a FeatureSet (FeatureLayer) So in this line:

var tranQuery = lyrMobBnds.queryFeatures(queryTran).then(function(mobResult)

...the variable 'mobResult' is a FeatureSet.  As Robert suggests above, you might need to assign a popup template to each Graphic before passing them into the popup.

DavidColey
Frequent Contributor

Ok John thanks, that wasn't clear to me.  I'll definently need to use this method elswhere, but not here.  So at this point I'm going to leave this alone for until 'selectFeatures' functionality is restored hopefully at 4.1.  There is other functionality I need (layer list, routing. print), plus the popup needs to be able to read domain descriptions and there is more work with it's paging functionality. 

0 Kudos