AnsweredAssumed Answered

Custom Floor switcher widget WAB

Question asked by chricks on May 4, 2015
Latest reply on Oct 10, 2016 by chricks

I've been trying to make a custom widget to switch between floors using radio buttons. I have a portal web map for each floor and want the radio button to display that floor with I click on it. It doesn't display to new map when clicked. What to do to make it work? Thanks!

 

define([

    'jimu/BaseWidget',

    "esri/dijit/BasemapLayer",

    "esri/arcgis/utils",

    'esri/layers/ImageParameters',

    'dojo/domReady!'

], function(

    BaseWidget,

    BasemapLayer,

    arcgisUtils,

    ImageParameters) {

    function FloorSwitchWidget(params) {

        this.constructor(params);

    }

    var map, baseStartup;

 

 

    FloorSwitchWidget.prototype = BaseWidget.prototype;

    FloorSwitchWidget.prototype.templateString =

        '<div><b>Choose a floor to view</b><br><br>\

    <input type="radio" name= "FLOOR" value="basement" id="basement">  Basement<br>\

    <input type="radio" name= "FLOOR" value="first" id="first">  First Floor<br>\

    <input type="radio" name= "FLOOR" value="second" id="second">  Second Floor<br>\

    <input type="radio" name= "FLOOR" value="third" id="third">  Third Floor</div>';

    baseStartup = FloorSwitchWidget.prototype.startup;

 

 

    FloorSwitchWidget.prototype.startup = function() {

        console.log('FloorSwitchWidget startup');

        baseStartup.call(this);

        map = this.map;

 

 

 

 

 

 

        var elem1 = document.getElementById('first');

        var elem2 = document.getElementById('second');

 

 

        elem1.addEventListener('click', getFirst);

        elem2.addEventListener('click', getSecond);

 

 

 

 

    };

 

 

 

 

    function getFirst() {

        console.log(' 1st clicked')

        arcgisUtils.createMap("99f08409990c4ac9bf49920d111c0d25", "map").then(function(response) {

 

 

            map = response.map;

 

 

 

 

        });

 

 

    }

 

 

    function getSecond() {

        console.log(' 2nd clicked')

        arcgisUtils.createMap("1508e30da03f4b2f83e6226435dfb172", "map").then(function(response) {

            map = response.map;

 

 

        });

 

 

    }

 

 

    FloorSwitchWidget.hasStyle = false;

    FloorSwitchWidget.hasUIFile = false;

    FloorSwitchWidget.hasLocale = false;

    FloorSwitchWidget.hasConfig = false;

    return FloorSwitchWidget;

});

Outcomes