Try to add a graphic layer but got 'TypeError: this.map.addLayer is not a function

chunguangWayneZhang · ‎05-20-2023

This is something kind of puzzle me. Hope someone can help.

I have a queried feature set that I want to add to the map as a graphic layer.

I have a cope of codes that seems in the right scope with lang.hitch included in the function queryfeatures. but somehow I couldn't get rid of the this.map.addLayer(myGraphicLayer) with 'TypeError: this.map.addLayer is not a function error. I checked community. The error is most like caused by out of scope. But it seems it is not the issue. Thanks for you help.

-------------------------------------------------------------------------------------------------------------

layer.queryFeatures(featureQuery, lang.hitch(this, function (featureSet) { //there is a lang.hitch here

if (featureSet && featureSet.features.length > 0) {

var parcelSymbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,

new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,

Color.fromArray([0, 255, 255]),

//new Color([0, 255, 255]),

4))

var marketgraphics = new GraphicsLayer({

graphics: featureSet.features

});

this.map.addLayer(marketgraphics); //here is the error

KenBuja · ‎05-22-2023

Since it's being called within the showResult function, you'll have to add the lang.hitch here

queryTask.execute(query, lang.hitch(this, showResults));

View solution in original post

KenBuja · ‎05-22-2023

Are you calling that inside another function? If so, you probably don't have lang.hitch when calling that higher function.

chunguangWayneZhang · ‎05-22-2023

Thanks for your help. The whole function is inside layer.queryFeatures( which is the first line here and ends the last line with ). The this.map works on other functions.

layer.queryFeatures(featureQuery, lang.hitch(this, function (featureSet) {

if (featureSet && featureSet.features.length > 0) {

var parcelSymbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,

new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,

Color.fromArray([0, 255, 255]),

//new Color([0, 255, 255]),

4))

var marketgraphics = new GraphicsLayer({

graphics: featureSet.features

});

this.map.addLayer(marketgraphics);

marketgraphics.renderer = new SimpleRenderer(parcelSymbol);

marketgraphics.graphics = featureSet.features;

marketgraphics.redraw();

jimuUtils.zoomToFeatureSet(this.map, featureSet).then(null, function (err) {

});;

}

}), lang.hitch(this, function () {

}));

KenBuja · ‎05-22-2023

Are you using that snippet inside of another then statement? As an example, I have to use lang.hitch several times in this code that does authentication

   esriId
      .getCredential(info.portalUrl, {
        oAuthPopupConfirmation: true
      })
      .then(
        lang.hitch(this, function () {
          this._portal = new arcgisPortal.Portal(this._portalUrl);
          this._portal
            .signIn()
            .then(
              lang.hitch(this, function (portalUser) {
                this.welcomeNote.innerHTML =
                  this.nls.welcome + portalUser.firstName + "!";
                const portal = portalUser.portal;
                const queryParams = {
                  num: 100,
                  q: 'owner: ' + this._ownerName + ' AND type: "Feature Service" AND title: "' + this._baseGridLayerName + '"'
                };
                portal.queryItems(queryParams).then(
                  lang.hitch(this, function (result) {
                    if (result.total > 0) {
                      if (
                        array.some(
                          result.results,
                          lang.hitch(this, function (item) {
                            if (item.url !== null) {

chunguangWayneZhang · ‎05-22-2023

Actually, it is not called in another then statement or function. Just inside that layer.queryFeatures function. The layer.queryFeatures function is in a ELSE statement.

Thanks again

KenBuja · ‎05-22-2023

Can you post the entire function?

chunguangWayneZhang · ‎05-22-2023

This seems has issue with a post. Tried several times to post the whole function but doesn

chunguangWayneZhang · ‎05-22-2023

Yes, here is the whole function in the if () statement. There is lang.hitch as well. Thanks

if (layerInfo) {

layerInfo.getLayerObject().then(lang.hitch(this, function (layer) {

var gs = getGraphics(layer, resultFeature.attributes[layer.objectIdField]);

var parcelSymbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,

new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,

new Color("purple"),

4))

if (gs && gs.length > 0) {

var queryTask = new QueryTask(this.nls.marketTbl);

var query = new esri.tasks.Query();

query.returnGeometry = false;

query.outFields = [

"PIN", "COMPPARCEL1", "COMPPARCEL2", "COMPPARCEL3", "COMPPARCEL4", "COMPPARCEL5"

];

query.where = "PIN ='" + gs[0].attributes["PIN"] + "'";

console.log("PIN ='" + gs[0].attributes["PIN"] + "'")

queryTask.execute(query, showResults);

function showResults(results) {

var resultItems = [];

var whereclause = "";

var resultCount = results.features.length;

if (resultCount >= 1) {

for (var i = 0; i < resultCount; i++) {

var featureAttributes = results.features[i].attributes;

for (var attr in featureAttributes) {

resultItems.push(attr + ":" + featureAttributes[attr]);

whereclause += "PIN ='" + featureAttributes[attr] + "' OR ";

}

console.log(whereclause)

}

else {

console.log("Can not find market model parcels")

return;

}

var featureQuery = new FeatureQuery(this.parcelFC);

featureQuery.where = whereclause.slice(0, -3);

//featureQuery.where = "(UPPER(PIN) = '16074500690') OR (UPPER(PIN) = '16096000350' OR UPPER(PIN) = '16074400610') OR(UPPER(PIN) = '16074400720') OR(UPPER(PIN) = '16074400630')";

console.log(whereclause.slice(0, -3))

//featureQuery.where = whereclause.slice(0, -3);

featureQuery.outSpatialReference = this.map.spatialReference;

featureQuery.outFields = ["*"];

featureQuery.returnGeometry = true;

var parcelSymbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,

new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,

Color.fromArray([0, 255, 255]),

//new Color([0, 255, 255]),

4))

layer.setSelectionSymbol(parcelSymbol);

layer.selectFeatures(featureQuery, FeatureLayer.SELECTION_NEW, lang.hitch(this, function (results) {

layer.setSelectionSymbol(parcelSymbol);

}));

layer.queryFeatures(featureQuery, lang.hitch(this, function (featureSet) {

if (featureSet && featureSet.features.length > 0) {

var parcelSymbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,

new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,

Color.fromArray([0, 255, 255]),

//new Color([0, 255, 255]),

4))

var marketgraphics = new GraphicsLayer({

graphics: featureSet.features

});

this.map.addLayer(marketgraphics);

marketgraphics.renderer = new SimpleRenderer(parcelSymbol);

marketgraphics.graphics = featureSet.features;

marketgraphics.redraw();

jimuUtils.zoomToFeatureSet(this.map, featureSet, 1.8).then(null, function (err) {

});;

}

}), lang.hitch(this, function () {

}));

}

chunguangWayneZhang · ‎05-22-2023

Tried to post entire function but won't allow me to post it somehow. Here is the top part and the next following part was posted before. Thanks.

if (layerInfo) {

layerInfo.getLayerObject().then(lang.hitch(this, function (layer) {

var gs = getGraphics(layer, resultFeature.attributes[layer.objectIdField]);

var parcelSymbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,

new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,

new Color("purple"),

//new Color([0, 255, 255]),

4))

if (gs && gs.length > 0) {

var queryTask = new QueryTask(this.nls.marketTbl);

var query = new esri.tasks.Query();

query.returnGeometry = false;

query.outFields = [

"PIN", "COMPPARCEL1", "COMPPARCEL2", "COMPPARCEL3", "COMPPARCEL4", "COMPPARCEL5"

];

query.where = "PIN ='" + gs[0].attributes["PIN"] + "'";

console.log("PIN ='" + gs[0].attributes["PIN"] + "'")

queryTask.execute(query, showResults);

function showResults(results) {

var resultItems = [];

var whereclause = "";

var resultCount = results.features.length;

if (resultCount >= 1) {

for (var i = 0; i < resultCount; i++) {

var featureAttributes = results.features[i].attributes;

for (var attr in featureAttributes) {

resultItems.push(attr + ":" + featureAttributes[attr]);

whereclause += "PIN ='" + featureAttributes[attr] + "' OR ";

}

console.log(whereclause)

}

else {

console.log("Can not find market model parcels")

return;

}

var featureQuery = new FeatureQuery(this.parcelFC);

featureQuery.where = whereclause.slice(0, -3);

console.log(whereclause.slice(0, -3))

//featureQuery.where = whereclause.slice(0, -3);

featureQuery.outSpatialReference = this.map.spatialReference;

featureQuery.outFields = ["*"];

featureQuery.returnGeometry = true;

var parcelSymbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,

new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,

Color.fromArray([0, 255, 255]),

//new Color([0, 255, 255]),

4))

layer.setSelectionSymbol(parcelSymbol);

layer.selectFeatures(featureQuery, FeatureLayer.SELECTION_NEW, lang.hitch(this, function (results) {

layer.setSelectionSymbol(parcelSymbol);

}));

KenBuja · ‎05-22-2023

Since it's being called within the showResult function, you'll have to add the lang.hitch here

queryTask.execute(query, lang.hitch(this, showResults));