Hello;
I have to make some modifications to the WAB 2.3 Developer Edition Directions widget and I do not know if it is possible.
The URL of the route tasks web service is set into the options parameter of the constructor of the directions class:
var options = {
...
routeTaskUrl: this.config.routeTaskUrl,
...
}
this._dijitDirections = new Directions (options, directionContainer);
After of the creation of the widget with this._dijitDirections.startup (); the travel modes select element is displayed and you can select diferents travel models: driving distance, driving time, rural driving time, etc.
I need to change the URL of the Route Task service depending on which travel mode has been selected in the select element, but I do not know if it is possible because the ULR is set into the widget before the select element is displayed.
Any ideas?.
Best regards.
Solved! Go to Solution.
Alberto,
I have not tested this but this should work in theory (added lines 64 thru 69 in the Widget.js):
startup: function(){
this.inherited(arguments);
this.portal = portalUtils.getPortal(this.appConfig.portalUrl);
this._preProcessConfig().then(lang.hitch(this, function(){
var routeParams = new RouteParameters();
var routeOptions = this.config.routeOptions;
if(routeOptions){
if(routeOptions.directionsLanguage){
routeParams.directionsLanguage = routeOptions.directionsLanguage;
}
else{
routeParams.directionsLanguage = dojoConfig.locale || "en_us";
}
routeParams.directionsLengthUnits = routeOptions.directionsLengthUnits;
routeParams.directionsOutputType = routeOptions.directionsOutputType;
if(routeOptions.impedanceAttribute){
routeParams.impedanceAttribute = routeOptions.impedanceAttribute;
}
}
var options = {
map: this.map,
searchOptions: this.config.searchOptions,
routeParams: routeParams,
routeTaskUrl: this.config.routeTaskUrl,
dragging: true,
showClearButton: true,
mapClickActive: true
};
//set units on root for API-3.20
if(this.config.routeOptions && this.config.routeOptions.directionsLengthUnits) {
options.directionsLengthUnits = this.config.routeOptions.directionsLengthUnits;
}
if(this.config.trafficLayerUrl){
this._trafficLayer = new ArcGISDynamicMapServiceLayer(this.config.trafficLayerUrl);
options.trafficLayer = this._trafficLayer;
options.traffic = true;
}else{
options.traffic = false;
options.showTrafficOption = false;
}
this.setDoNotFetchTravelModes(options).then(lang.hitch(this, function() {
html.empty(this.directionController);
var directionContainer = html.create('div', {}, this.directionController);
//Only init Directions dijit when we can access the route task url.
esriRequest({
url: options.routeTaskUrl,
content: {
f: 'json'
},
handleAs: 'json',
callbackParamName: 'callback'
}).then(lang.hitch(this, function() {
this._dijitDirections = new Directions(options, directionContainer);
//html.place(this._dijitDirections.domNode, this.directionController);
this._dijitDirections.startup();
console.info(this._dijitDirections);
this.own(on(this._dijitDirections, 'load', lang.hitch(this, this._onDirectionsActivate)));
this.own(on(this._dijitDirections._travelModeSelector, 'change', lang.hitch(this, function(evt){
//Now destroy the this._dijitDirections
this.config.routeTaskUrl = "ypur new url";
this.destroy();
this.startup();
})));
......
:
Alberto,
I have not tested this but this should work in theory (added lines 64 thru 69 in the Widget.js):
startup: function(){
this.inherited(arguments);
this.portal = portalUtils.getPortal(this.appConfig.portalUrl);
this._preProcessConfig().then(lang.hitch(this, function(){
var routeParams = new RouteParameters();
var routeOptions = this.config.routeOptions;
if(routeOptions){
if(routeOptions.directionsLanguage){
routeParams.directionsLanguage = routeOptions.directionsLanguage;
}
else{
routeParams.directionsLanguage = dojoConfig.locale || "en_us";
}
routeParams.directionsLengthUnits = routeOptions.directionsLengthUnits;
routeParams.directionsOutputType = routeOptions.directionsOutputType;
if(routeOptions.impedanceAttribute){
routeParams.impedanceAttribute = routeOptions.impedanceAttribute;
}
}
var options = {
map: this.map,
searchOptions: this.config.searchOptions,
routeParams: routeParams,
routeTaskUrl: this.config.routeTaskUrl,
dragging: true,
showClearButton: true,
mapClickActive: true
};
//set units on root for API-3.20
if(this.config.routeOptions && this.config.routeOptions.directionsLengthUnits) {
options.directionsLengthUnits = this.config.routeOptions.directionsLengthUnits;
}
if(this.config.trafficLayerUrl){
this._trafficLayer = new ArcGISDynamicMapServiceLayer(this.config.trafficLayerUrl);
options.trafficLayer = this._trafficLayer;
options.traffic = true;
}else{
options.traffic = false;
options.showTrafficOption = false;
}
this.setDoNotFetchTravelModes(options).then(lang.hitch(this, function() {
html.empty(this.directionController);
var directionContainer = html.create('div', {}, this.directionController);
//Only init Directions dijit when we can access the route task url.
esriRequest({
url: options.routeTaskUrl,
content: {
f: 'json'
},
handleAs: 'json',
callbackParamName: 'callback'
}).then(lang.hitch(this, function() {
this._dijitDirections = new Directions(options, directionContainer);
//html.place(this._dijitDirections.domNode, this.directionController);
this._dijitDirections.startup();
console.info(this._dijitDirections);
this.own(on(this._dijitDirections, 'load', lang.hitch(this, this._onDirectionsActivate)));
this.own(on(this._dijitDirections._travelModeSelector, 'change', lang.hitch(this, function(evt){
//Now destroy the this._dijitDirections
this.config.routeTaskUrl = "ypur new url";
this.destroy();
this.startup();
})));
......
:
Don't forget to mark this question as answered by clicking on the "Mark Correct" link on the reply that answered your question.
Perhaps this is not entirely related to the original post, but I am going to attempt to piggyback on this:
Are you able to limit which modes of travel are available on the directions widget?