Dear All,
i am trying to make my first custom widget in web app builder.below is my code.after querying from my feature layer i want to make a graphic and zoom to that feature.my query work and return one feature.But when i want to make a graphic and add this graphic on map.it throws error.my custom widget code is given below.
define(['dojo/_base/declare','jimu/BaseWidget',"esri/tasks/query", "esri/tasks/QueryTask",
"esri/geometry/Polygon","esri/geometry/Extent","esri/symbols/SimpleFillSymbol",'esri/layers/GraphicsLayer',
"esri/SpatialReference","esri/symbols/SimpleLineSymbol","esri/graphic",'esri/map','dojo/_base/lang',
"jimu/loaderplugins/jquery-loader!./js/jquery.min.js, ./js/bootstrap.min.js,./js/select2.min.js,./js/jquery.plugin.min.js"
],
function(declare,BaseWidget, Query, QueryTask,Polygon,Extent,SimpleFillSymbol,GraphicsLayer,SpatialReference,SimpleLineSymbol,Graphic,Map,lang) {
var clazz = declare([BaseWidget], {
baseClass: 'Test',
name: 'Test',
startup: function startup() {
$('#cmbRegions').select2();
this.inherited(arguments);
this.onOpen();
this.init();
this.executeTask();
},
_getMapId: function(){
alert(this.map.id);
},
onOpen:function onOpen(){
var panel=this.getPanel();
panel.position.width=300;
panel.position.height=300;
panel.setPosition(panel.position);
panel.panelManager.normalizePanel(panel);
},
executeTask:function executeTask(){
var strURL="https://localhost:6080/arcgis/rest/services/Complex_New_App/MapServer/12";
var query = new Query();
var queryTask = new QueryTask(strURL);
query.where = "1=1";
query.outSpatialReference = {wkid:4326};
query.returnGeometry = false;
query.returnDistinctValues=true;
query.outFields = ["Aname"];
queryTask.execute(query, function(results){
$('#cmbRegions').empty().trigger("change");
$("#cmbRegions").append('<option value=اختر selected>اختر</option>');
for(var k=0;k<results.features.length;k++){
var newOption = new Option(results.features[k].attributes.Aname, k, false, false);
$('#cmbRegions').append(newOption).trigger('change');
}
});
},
//***********************************************************************************************************************//
init: function init() {
//***************************************************************************//
$('#cmbRegions').on('select2:select', function (e) {
var data = e.params.data;
var strURL="https://localhost:6080/arcgis/rest/services/Complex_New_App/MapServer/12";
var query = new Query();
var queryTask = new QueryTask(strURL);
query.where = "Aname="+"'"+data.text+"'";
query.outSpatialReference = {wkid:4326};
query.returnGeometry = true;
query.outFields = ["Aname"];
queryTask.execute(query, function(results){
alert(results.features.length);
var polygon = results.features[0].geometry;
var polygonExtent = polygon.getExtent();
var extent = new esri.geometry.Extent(polygonExtent.xmin, polygonExtent.ymin, polygonExtent.xmax, polygonExtent.ymax, new SpatialReference({ wkid: 4326 }));
var pg = new Polygon(new esri.SpatialReference({ wkid: 4326 }));
if (pg.rings.length > 0) {
for (var i = 0; i < pg.rings.length; i++) {
var ring = pg.rings[i];
pg.addRing(ring);
}
}
var ext=pg;
var centerPt = ext.getCentroid();
var graphic = new Graphic(polygon);
var sfs = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_DIAGONALCROSS, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([51, 102, 255, 2]), 4), new dojo.Color([51, 102, 255, 4]));
graphic.setSymbol(sfs);
this.map.graphics.clear();-------------------------------------Error line
this.map.graphics.add(graphic);----------------------------Error Line
});
});
//***************************************************************************//
},
//*****************************************************************************************************************************//
});
return clazz;
});
please help.......................
Thanks in advance
