Enhanced Basemap Gallery Widget 2.8 - 05/1/2018

12 Kudos · Enhanced Basemap Gallery Widget 2.8 - 05/1/2018

Here is another enhancement to a widget for the Web App Builder.

Live Preview Site

Web AppBuilder for ArcGIS | Help - Enhanced Basemap Gallery

List of the latest enhancements and changes:

Fixed issue when adding a second basemap to fade and the original basemap came from the web map the widget would hang.

List of the older enhancements and changes:

Fixed issue with new basemap thumbnail urls having bad paths.
Fixed issue with default basemaps not appearing in widgets configuration UI.
Fixed issue with thumbnail image chooser link hotspot being above the thumbnail image instead of on it, in the widget configuration UI.
Fixed references to missing images in the widgets code
Adding missing default.jpg
Fixed issue that the OTB Basemap Gallery and the eBasemap Gallery has with empty basemap object being added to the json when using basemaps that were not the same spatial reference as the webmap.
Redesigned the widgets UI completely base on some suggestions from Jeremie Cornet
Add my ability to check the widgets version by holding Alt button and clicking anywhere on the widget.
Released for Version 1.1 of the WAB
Version 1.0.3.0 had a bug where the widget would not create the hybrid mashup basemap in certain browsers.
Default basemap is selected when the widget opens.
Added the ability to mashup 2 selected basemaps into a hybrid mashup basemap.
A slider is added when a hybrid mashup basemap is created to adjust the opacity levels for the selected basemaps in the hybrid mashup. When the hybrid is removed the default basemap is selected again.

MelanieHammond1 · ‎12-12-2014

You are doing some great work Robert. I was interested in this one, but can't seem to get it to work. In your working example, when I choose to basemap layers a mashup is not created. Any ideas?

RobertScheitlin__GISP · ‎12-12-2014

Melanie,

Are you trying my Live preview site? Have you read the help website on how to use the widget? Once you check the "Create a hybrid basemap...." checkbox did you then check the 2 basemaps that you want to mashup?

MelanieHammond1 · ‎12-17-2014

This is what I get from this site- ArcGIS Web Application

RobertScheitlin__GISP · ‎12-17-2014

Melanie,

Thanks for providing the screenshot. This lead me to test other browsers and find the issue. Please clear your browsers cache and try the live preview site again.

khairulamri · ‎12-17-2014

its works for me, very useful. thanks heaps

zhongrenGu · ‎12-29-2014

hi ,i want to know ,how to add my map and operate the map via widget, I studied web app builder three weeks,but i can't understand the principle of it, my final goal is to write a custom widget, can you help me ,give me some advince?? thank you very much!!

JeremieCornet1 · ‎01-05-2015

Hi Robert,

Thanks for this great widget (as allways) !

I think the GUI could be more simple/user-friendly.

What do you think of this GUI ? :

- an header section with the one (or two) basemap(s) selected

-> if 1 basemap : basemap centered

-> if 2 basemaps :

- the slider appears

- remove buttons on basemaps

- between the 2 basemaps, a switch button

- an other section with all others basemaps. On each basemap, 2 buttons : 1 for setting as the only basemap and the other for adding in current basemaps (if allready 2 current basemaps, replace the second).

I'm interested to participate !

RobertScheitlin__GISP · ‎01-06-2015

Jeremie,

Could you provide a drawing/sketch of the UI design you are proposing? I would like to get feedback from other users on what you are proposing and a sketch of the UI changes will help me and others to grasp your suggestions.

JeremieCornet1 · ‎01-06-2015

Of course.

I was thinking of something like that for 1 selected basemap :

And something like that for a mashup :

For selection mecanism, i propose :

2 icons per basemap (over img) in available basemaps :

- the first for setting as only basemap (a check icon)

- the second for adding in mashup (an add icon)

If the current basemap is a mashup, 1 remove icon per selected basemap

TimJacobsen · ‎06-11-2015

I find this widget very useful, it allows us to keep the layerlist widget uncluttered and is a good answer to multi-layer transparencies. Also the layerlist transparency sliders are well hidden for public users, this widget helps. We use our services as items for the gallery so I need to associate an image with a layer. Each time a change is made to an app the correlation between and layer and it’s image corrupts. Any suggestions?

HumzaAkhtar · ‎06-16-2015

The widget is amazing. The only issue I am having is that the slider does not work properly when I select Bing Street and Bing Imagery and try to create their hybrid mashed basemap. Has any one experienced that ? For the ESRI maps, the widget hybrid function works great, but not for bing maps. I am attaching a screenshot of the issue here:

It can be seen that the slider is just fading away bing road map and not displaying aerial map.

TimJacobsen · ‎06-18-2015

It seems the issue was a variable being set for the URL int C:\arcgis-web-appbuilder-1.1\server\apps\YourApp#here\configs_ebasemapGallery\config_EnhancedBasemapGallery.json file. When locating the icon URL thru the browser it would be something like:

http://you:3344/webappbuilder/apps/widgets/eBasemapGallery/$followedbyRandomCharacters#$^$%&%$%&!/co....

Change this link to what it should be:

http://you:3344/webappbuilder/apps/8/configs/eBasemapGallery/thumbnailUrl.jpeg.

I don't know what sets the variable in the json file but once the changes were made they have persisted. Before looking thru code trying to figure out why this didn't work clear the browser cache and the change should appear.

TomSellsted · ‎06-18-2015

Robert,

Very nice! It works very well. I am seeing broken images on 3 of the thumbnails though. I tried it on on Chrome, IE and Firefox all with the same result.

It didn't affect the behavior of the widget though. Thanks very much for all of your work!

Best Regards,

Tom

BarnabyRockwell · ‎11-03-2015

Hi Robert,

A method to Drag-n-Drop basemaps to reorder them in the editing GUI would be great.

Cheers,

Barnaby

ChristopherOlsen · ‎11-09-2015

Robert Scheitlin, GISP I am also seeing broken thumbnails. I have tried moving them into the widget's images folder as well, but no luck. The broken urls are the same as Tim reported in June. How do users get them to work?

RobertScheitlin__GISP · ‎11-10-2015

Christopher,

Look in your apps configs folder and find the eBasemapGallery/config_Enhanced Basemap Gallery.json

look for the thumbnailUrl of the basemaps that are failing and see if those url are valid.

Anonymous User · ‎12-03-2015

Quick side question: the basemap widget (this or regular one) can't use Image Services, can it? I tried adding one, no go. Google GeoNet a bit, didn't see this question. Just want to confirm. It definitely looks this way, it just turns red for an invalid basemap REST link.

RobertScheitlin__GISP · ‎12-03-2015

Kevin,

Image services are not supported that I am aware of.

Anonymous User · ‎12-03-2015

Thanks Robert, this is what I thought. That'd be awesome for ESRI to add. Kelly Hutchins & other ESRI crew, what do you think?

Therefore we wouldn't have to tile down to so many small zoom levels on our aerials. (I ran in to this just now while adding our aerial service to basemap and noticing we don't go all the way to 1:71) Plus, it will unlock the awesomeness of ESRI image services i.e. DEMs with various GP ops i.e. viewshed stored, accessible in Basemap, etc.

I just like the basemap widget vs. the layerlist for layers like current aerials, because I think casual users will and do like the Basemap interface. It's clean and simple. And Robert's version is nice with the slick fader which I might look at using on a viewer.

MichaelPaniccia · ‎12-04-2015

All the basemaps appear to be projected in web-Mercator. Any plans to offer projections that are WGS 84 compliant (most notably Mercator)?

RobertScheitlin__GISP · ‎12-04-2015

Michael,

If you have basemaps in your AGOL that are in other projects the widget will handle those fine. But all basemaps used must be in the same projection.

AmitKokje2 · ‎01-13-2016

Hi Robert,

The eBasemap widget is very useful and easy to configure. Especially the hybrid base map control with a slider is a great enhancement.

A quick question about the hybrid basemap though.

At the moment the hybrid basemap clears off and return to single default basemap when the application is refreshed or restarted. It it possible to load 2 basemaps by default when the widget is used?

For example in my case there are 2 frequently used base maps : default basemap and aerials imagery. And I want application to load the a hybrid of these two base maps by default. or the eBasemap widget to start with hybrid base map by default (with slider setting at either of two maps instead of 50/50).

So that user may not have to add 2nd map every time after refreshing or starting the application.

Is it possible at configuration level?

Amit

RobertScheitlin__GISP · ‎01-13-2016

Amit,

This is not something currently configurable. You are not the first to ask about this though so I will consider adding it to the enhancement list.

AmitKokje2 · ‎01-13-2016

Thanks Robert,

Perhaps this added functionality will be the possible solution of for my another query Toggle layer/s visibility

Existing ability of eBasemap widget to add map-services as a basemap plus hybrid base map capabilities (multiple basemaps instead of just two), I guess user will have better interactive control on toggling between the layers. Instead of turning on and off layers.

Amit

ChristopherOlsen · ‎01-13-2016

In looking at Amit's question, I would agree that having multiple basemaps load or be available would be great. Bringing the slider back from the Flex world would be amazing, but I understand it's a different beast.

LindseyStone · ‎01-25-2016

Robert,

I am trying to implement your Enhanced Basemap widget v1.3 onto my map (using WAB 1.2) and I'm running into two issues. Issue number 1 the Thumbnail pictures are not displaying. They display in the development window of WAB but not when I launch the site to test it or when I download it to my server. The default Basemap Gallery does display it without issue and the location URLs for the images in the config files look exactly the same to me between the default basemap gallery and your enhanced basemap gallery.

Issue 2 is: is when I first open my map and open the widget it shows the selected map as a blank map with no label. Then under available maps it shows two basemaps. When it fact one of these two basemaps is my selected map. So it appears that there is 3 basemaps in all, when I only have two. When I select any of the two available basemaps then that 3rd option disappears. Now I am only showing two basemaps. Is this how the widget was programmed or do I have some kind of issue?

Here is a link to the map ArcGIS Web Application so you can see what I am talking about regarding the thumbnails and how the widget is displaying my maps. The default basemap set up in my web map using portal is the Street Basemap.

RobertScheitlin__GISP · ‎01-25-2016

Lindsey,

1. The thumbnail url was suppose to automatically replace when you exported the app.

From: "thumbnailUrl": "${appPath}/configs/eBasemapGallery/thumbnailUrl_11.jpeg",

To: "thumbnailUrl": "https://gis.adamscounty.org/city/test/platbook/configs/eBasemapGallery/thumbnailUrl_11.jpeg",

So you need to make these changes manually for some reason.

2. See this thread for the answer: Re: eBasemap Widget v1.2 - Create Widget Error

Shauna-RaeBrown · ‎01-26-2016

Robert,

Great work on the eBasemap Widget! I'm having an issue with any version of IE. When you select a basemap it turns on the basemap layer OK, but when I go back into the widget to turn the previous layer back on, it's missing/removed from the basemap choices. I can select each basemap one at a time and the list eventually removes all but the last basemap from the widget's list. Have you come across this bug? Thank you for your help, and all of your hard work on developing your custom widgets.

RobertScheitlin__GISP · ‎01-26-2016

Shauna-Rae,

I have seen this before and thought I had it fixed... Well back to the drawing board. I will get this fixed for the next release.

BarnabyRockwell · ‎01-28-2016

Note that, in IE11, although the icons will vanish as you click them, they will all return if you add one to the mashup. True for 1.2 and 1.3 versions of the widget.

RobertScheitlin__GISP · ‎01-28-2016

Ya. they are there but they are hidden and the way I am un-hiding them is not working in IE (go figure IE is the problem again).

BarnabyRockwell · ‎01-28-2016

I wonder how the widget will perform in Edge?

RobertScheitlin__GISP · ‎01-28-2016

Shauna-Rae Brown and Barnaby Rockwell

The fix for IE is pretty simple:

In the widget.js file find these lines (@ line 552):

if(this.selectedBMNode){

html.setStyle(this.selectedBMNode, 'display', '');

}

if(this.selectedBMNode2){

html.setStyle(this.selectedBMNode2, 'display', '');

}

And change then to:

if(this.selectedBMNode){

html.setStyle(this.selectedBMNode, 'display', 'inline-block');

}

if(this.selectedBMNode2){

html.setStyle(this.selectedBMNode2, 'display', 'inline-block');

}

I will add this fix to the next release.

DanielChantlos1 · ‎03-23-2016

Robert,

Thanks for all the help with these widgets. The Enhanced Basemap Widget works great, however we have noticed one minor glitch. In IE, when you select a new basemap, the previous basemap will disappear until you refresh the WebApp.

I usually use Chrome for everything, so this doesn't affect me very much. I just wanted to let you know, since some people on the outside still use IE for viewing WebApps.

RobertScheitlin__GISP · ‎03-23-2016

Danel,

The fix is the post right above yours.

DanielChantlos1 · ‎03-30-2016

Robert,

Thanks for the IE fix, I didn't see it posted previously (sorry about that). One more question, I have a WMS I would like to add to the Enhanced Basemap Gallery. I've noticed that this widget doesn't allow WMS-as-a-basemap support. Do you have any suggestions/future plans to allow me to do this with your widget?

NatashaManzuiga · ‎04-19-2016

Robert, how can I remove the Topographic Basemap (default basemap) from the basemaps list?

Thanks,

Naty

RobertScheitlin__GISP · ‎04-19-2016

Daniel,

I have no plans for WMS support currently.

RobertScheitlin__GISP · ‎04-19-2016

Naty,

You should see a "x" button in the upper right hand corner of the thumbnail when you hover over it in the widgets setting UI. This allows you to remove that basemap.

NatashaManzuiga · ‎04-19-2016

I don't see the thumbnails...maybe because I'm using LocalLayer widget?

If so...how can I remove the Topographic Basemap from the list?

Thanks,

Naty

RobertScheitlin__GISP · ‎04-19-2016

Naty,

When you bring up the Enhanced Basemap Gallery Widget settings in WAB you are presented with a thumbnail of all the available basemaps.

TimHayes1 · ‎04-19-2016

Robert,

I tried this widget with Web Appbuilder DE 2.0, of course I was using my tablet per our earlier discussion. Some issues:

1) The basemaps disappear when they are switched. Still happens on my desktop pc even after the fix listed in these comments.

2) The thumbnail not linking is another issue, which we have also discussed.

Looking forward to the update for this widget. Great stuff! Thanks!

NatashaManzuiga · ‎04-20-2016

Robert, I removed all the basemaps as you told me.

In my json config, there is only the basemaps list (LocalLayer not from AGOL) I want to show.

I suppose that your widget load the Basemap you have to set in Web AppBuilder Map Tab and you cant remove it..

I investigated and I found the code of this setting.

Map configuration—Web AppBuilder for ArcGIS (Developer Edition) | ArcGIS for Developers

How can I remove it?

Thanks,

Naty

RobertScheitlin__GISP · ‎04-20-2016

Naty,

I am very confused. What is your goal? Why are you using the enhanced basemap gallery widget if you don't want any basemaps?..

NatashaManzuiga · ‎04-20-2016

Robert, as you can see below I have correctly configured my basemaps in "config_Enhanced Basemap Gallery.json" without Topographic Basemap.

My problem is that in my eBasemapGallery widget...I have the thumbnails of all these basemaps and Topographic, too...

I just don't want to see Topographic basemap in my widget...

Thanks,

Naty

{

"basemapGallery": {

"basemaps": [{

"title": "trwgw001",

"thumbnailUrl": "../../images/basemap2001.jpg",

"layers": [{

"url": "http://localhost:6080/arcgis/rest/services/mgfdgd/MapServer",

"id": "defaultBasemap"

}],

"spatialReference": {

"wkid": 102100

}

}, {

"title": "0646",

"thumbnailUrl": "../../images/basemaps/fdsfds_2004.jpg",

"layers": [{

"url": "http://localhost:6080/arcgis/rest/services/fdsfds_2004_tiled/MapServer"

}],

"spatialReference": {

"wkid": 102100

}

},

{

"title": "464014",

"thumbnailUrl": "../../images/basemaps/165316_2014.jpg",

"layers": [{

"url": "http://localhost:6080/arcgis/rest/services/r43543s/MapServer"

}],

"spatialReference": {

"wkid": 102100

}

}]

}

RobertScheitlin__GISP · ‎04-20-2016

Naty,

The eBasemap Gallery will always add the Web Maps basemap because of these lines in the Widget.js

// if basemap of current webmap is not include, so add it.

for(i = 0; i < basemaps.length; i++) {

if (utils.compareSameBasemapByOrder(basemaps, webmapBasemap)) {

break;

}

if(i === basemaps.length) {

basemaps.push(webmapBasemap);

}

So I guess you could comment them out (I have not tested this).

NatashaManzuiga · ‎04-20-2016

Hi Robert, that's fixed my problem...

I set a Basemap in LocalLayer Widget....
can I open the eBasemapGallery selecting as active the thumbnails that corresponds to the Basemap of the LocalLayer widget?

Thanks,

Naty

TimHayes1 · ‎04-20-2016

Robert,

I made an mp4 movie showing the disappearing basemaps which was happening in the previous version of your widget when I was using desktop. It is 11mb, I can send it to you if you like. Just need to know the recommended method since it is an 11mb file.

Otherwise, is this issue fixed with 2.01widget version?)

RobertScheitlin__GISP · ‎04-20-2016

Tim,

If you look above in the latest enhancements and changes you will see that it has been fixed for 2.0.1.

TimHayes1 · ‎04-21-2016

It works! perfect. Thanks, Robert.

Enhanced Basemap Gallery Widget 2.8 - 05/1/2018

Enhanced Basemap Gallery Widget 2.8 - 05/1/2018

Widget Downloads