0

I'm developing a custom widget for WebApp Builder. The widget calls a Geoprocessing service and the result must be added to map, but when I call a function this.map.addLayer() I receive the error message:

this.map.addLayer is not a function

This is the snippet of my code:

submitGpLr: function (tab1) {
            let params = {
                json: tab1
            };
            // lancia il geoprocessing, i callback sono sotto
            this.gpLr.submitJob(params, lang.hitch(this, this.gpLrJobComplete), this.gpLrJobStatus, this.gpLrJobFailed);
        },


        gpLrJobComplete: function (jobinfo) {
            this.gpLr.getResultData(jobinfo.jobId, "Output_Layer", function (results) {
                console.log(results);
                let jsonResult = results.value;
                // function addResultToMap
                let SR = jsonResult.spatialReference;
                let GT = "esriGeometryPolyline";
                let layerDefinition = {
                    "geometryType": GT,
                    "spatialReference": SR,
                    "fields": jsonResult.fields
                };
                let featureCollection = {
                    layerDefinition: layerDefinition,
                    featureSet: {
                        "geometryType": GT,
                        "spatialReference": SR,
                        "features": jsonResult.features
                    }
                };
                let resultLayer = new FeatureLayer(featureCollection, {
                    showLabels: true,
                    spatialReference: SR
                });

                let sls = new esri.symbol.SimpleLineSymbol(
                    esri.symbol.SimpleLineSymbol.STYLE_SOLID,
                    new esri.Color([255, 0, 0]), 3.5
                );

                this.map.addLayer(resultLayer);


            });


        },
        gpLrJobFailed: function (err) {
            console.log("errore generico");
            console.log(err);
        },
        gpLrJobStatus: function () {

        }

and this is the snippet of global define:

define([
    'dojo/_base/declare',
    'dojo/_base/array',
    'dijit/_WidgetsInTemplateMixin',
    'jimu/BaseWidget',
    'jimu/dijit/Message',
    'esri/domUtils',
    'esri/dijit/Popup',
    'esri/arcgis/utils',
    'esri/layers/ArcGISDynamicMapServiceLayer',
    'esri/layers/FeatureLayer',
    'dojo/on',
    'dojo/topic',
    'dojo/query',
    'dojo/_base/html',
    'dojo/dom-class',
    'dojo/dom-construct',
    'dojo/dom',
    'dojo/_base/lang',
    'dojo/promise/all',
    'jimu/WidgetManager',
    'jimu/PanelManager',
    'jimu/MapManager',
    'dojo/i18n!esri/nls/jsapi',
    'jimu/FeatureActionManager',
    'jimu/dijit/FeatureActionPopupMenu',
    'jimu/utils',
    'dojo/_base/array',
    'dojo/query',
    'dijit/layout/ContentPane',
    'dijit/layout/TabContainer',
    'dojox/grid/DataGrid',
    'dojo/data/ItemFileWriteStore',

    './layerUtil',
    'jimu/LayerInfos/LayerInfos',
    'dojox/form/CheckedMultiSelect',
    'dojo/store/Memory',
    'esri/tasks/RelationshipQuery',
    'esri/request',
    'esri/tasks/QueryTask',
    'esri/tasks/query',
    'esri/tasks/Geoprocessor',
    'jimu/dijit/LoadingIndicator',
    'dgrid/Grid',
    'dstore/RequestMemory',
    'dstore/Trackable',
    'dgrid/OnDemandGrid',
    'dgrid/extensions/ColumnHider',
    'dgrid/extensions/ColumnReorder',
    'dgrid/extensions/ColumnResizer'

],
function (
    declare,
    array,
    _WidgetsInTemplateMixin,
    BaseWidget,
    Message,
    domUtils,
    Popup,
    utils,
    ArcGISDynamicMapServiceLayer,
    FeatureLayer,
    on,
    topic,
    query,
    html,
    domClass,
    domConstruct,
    dom,
    lang,
    all,
    WidgetManager,
    PanelManager,
    MapManager,
    esriBundle,
    FeatureActionManager,
    PopupMenu,
    jimuUtils,
    array,
    dojoQuery,
    ContentPane,
    TabContainer,
    DataGrid,
    ItemFileWriteStore,
    layerUtil,
    LayerInfos,
    CheckedMultiSelect,
    Memory,
    RelationshipQuery,
    esriRequest,
    QueryTask,
    Query,
    Geoprocessor,
    LoadingIndicator,
    Grid,
    RequestMemory,
    OnDemandGrid, ColumnHider, ColumnReorder, ColumnResizer
) {
    return declare([BaseWidget, _WidgetsInTemplateMixin], {
        position: {width: 800},
        baseClass: 'widget-popuppanel',
        name: 'PopupPanel',
        label: 'Informazioni',
        popup: null,
        zt: null,
        clearSel: null,
        popupMenu: null,
        featureActionManager: null,
        inPanel: null,
        popupContent: null,
        selChgEvt: null,
        clearFeatsEvt: null,
        setFeatsEvt: null,
        prevBtnEvt: null,
        nextBtnEvt: null,
        clearEvt: null,
        zoomToEvt: null,
        clearSelEvt: null,
        resizeEvt: null,
        domains: null,
        initialized: false,
        layerObjectArray: [],
        layerObjectForId: {},
        gp: null,
        gpLr: null,
        muifTabJson: null,
        ineUpdateTabJson: null,
        ineNewTabJson: null,
        mainCp: {},
        grids: {},
        currentGridOriginalData: {"MU": null, "IU": null, "IN": null},

How can I fix this error? I don't try the error in my code.

  • Is this in scope? Set a breakpoint and check. If not you may need to Lang.hitch it in – KHibma Sep 8 at 1:49
  • Yes it is...i have check – dev_ Sep 8 at 8:41
0

If the scope in the callback function (lang.hitch) is not the problem try to access the map object using:

var map = this.wabWidget.map; inside your function.

I once had this problem.

gpLrJobComplete: function (jobinfo) {
          var map = this.wabWidget.map;
          //and then add layers

         map.addLayer(resultLayer);

        },

If you are instantiating your widget into another widget

myWidget: function(){

        this.myWidgetId= new myWidgetId({
            wabWidget: this 

        }).placeAt(this.mydomNode);
      },

good luck!

0

You need to add a lang.hitch to the line

this.gpLr.getResultData(jobinfo.jobId, "Output_Layer", function (results) {

so it's like this

this.gpLr.getResultData(jobinfo.jobId, "Output_Layer", lang.hitch(this, function (results) {

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.