Hi everyone, I'm new at javascript and developping widgets for WAB for developpers. js widget
I am currently trying to develop an off-panel widget, which aim would be geolocating the user and creating a point in a layer I previously published on ArcGIS Server as a Feature Service. (Works like a panic button)
I am having some trouble at finding out what could be wrong with this.addGraphic (line 65) at the function zoomToLocation.
Console says the following:
Uncaught TypeError: this.addGraphic is not a function
at zoomToLocation (Widget.js?wab_dv=2.15:65)
Here is my code:
define([
'dojo/_base/declare',
'jimu/BaseWidget',
'esri/graphic',
'esri/geometry/Point',
'esri/symbols/SimpleMarkerSymbol',
'esri/symbols/SimpleLineSymbol',
'esri/Color',
"esri/layers/FeatureLayer"
],
function(declare, BaseWidget, Graphic, Point, SimpleMarkerSymbol, SimpleLineSymbol, Color, FeatureLayer) {
return declare([BaseWidget], {
baseClass: 'jimu-widget-panico',
name: "Panico",
graphic: null,
currLocation: null,
watchId: null,
postCreate: function() {
this.initFunc();
},
initFunc: function(){
if(navigator.geolocation) {
navigator.geolocation.getCurrentPosition(this.zoomToLocation, this.locationError);
}
else {
alert("error.");
}
},
locationError: function(error) {
if(navigator.geolocation) {
navigator.geolocation.clearWatch(this.watchId);
}
switch (error.code) {
case error.PERMISSION_DENIED:
alert("Location not provided");
break;
case error.POSITION_UNAVAILABLE:
alert("Current location not available");
break;
case error.TIMEOUT:
alert("Timeout");
break;
default:
alert("unknown error");
break;
}
},
zoomToLocation: function(location) {
var pt = new Point(location.coords.longitude, location.coords.latitude);
this.addGraphic(pt);
this.map.centerAndZoom(pt, 12);
var featureLayer = new FeatureLayer("https://localhost:6443/arcgis/rest/services/..../FeatureServer/0", {
outFields: ["*"]
});
graphic = new Graphic(pt);
featureLayer.applyEdits([graphic], null, null);
},
addGraphic: function(pt){
var symbol = new SimpleMarkerSymbol(
SimpleMarkerSymbol.STYLE_CIRCLE,
12,
new SimpleLineSymbol(
SimpleLineSymbol.STYLE_SOLID,
new Color([210, 105, 30, 0.5]),
8
),
new Color([210, 105, 30, 0.9])
);
graphic = new Graphic(pt, symbol);
this.map.graphics.add(graphic);
}
});
});
