topic import legend/layerlist widget into custom widget in Web AppBuilder Custom Widgets Questions

import legend/layerlist widget into custom widget

scottmiller10 — Thu, 31 May 2018 16:08:36 GMT

My goal is to import the legend and layerlist widgets into my custom widget so I can use them all in one panel. Is this something I can do?

Re: import legend/layerlist widget into custom widget

RobertScheitlin__GISP — Thu, 31 May 2018 22:43:55 GMT

Scott,

Absolutely. Just add a few dives to your panel and set the styling for height and width and when you use the constructor method on the Legend and LayerList just place them in those divs.

Re: import legend/layerlist widget into custom widget

scottmiller10 — Fri, 01 Jun 2018 15:51:27 GMT

Thanks for your help! The legend works, but it only shows up in my custom widget when I open up the legend widget. Is there a way to do this, maybe put the constructor in the legend.startup()? I think it happens because it only constructs the legend in legend.onOpen().

Re: import legend/layerlist widget into custom widget

RobertScheitlin__GISP — Fri, 01 Jun 2018 17:02:37 GMT

Scott,

The legend works, but it only shows up in my custom widget when I open up the legend widget

???

I thought you where placing the Legend widget inside your custom widget panel? So what do you mean when you open the Legend widget?

Re: import legend/layerlist widget into custom widget

scottmiller10 — Fri, 01 Jun 2018 20:58:25 GMT

Robert,

I went into the Legend widget and pointed the constructors html parameter to a div in my custom widget. I wasn't aware that I could import the entire Legend into my custom widget. How do I go about doing that?

Re: import legend/layerlist widget into custom widget

RobertScheitlin__GISP — Fri, 01 Jun 2018 21:12:34 GMT

Scott,

Maybe you should show some code as it seems like we are not understanding each other.

Re: import legend/layerlist widget into custom widget

scottmiller10 — Fri, 01 Jun 2018 21:21:37 GMT

In the Legend widget's function onOpen(), I changed the Legend constructor to

this.legend = new Legend(legendParams, document.getElementById('legend'));

the 'legend' element is the name of the <div> in my custom widget, where I want the legend to appear.

This makes it so that when I open the Legend widget from the panel, the Legend items appear in my custom widget in the 'legend' div.

It works great, but I would like it to work without having to open the Legend widget from the panel.

Re: import legend/layerlist widget into custom widget

RobertScheitlin__GISP — Fri, 01 Jun 2018 21:30:03 GMT

Scott,

So are you talking about a WAB Widget? If so that is why I am confused since you are posting in the JS API space and not the WAB space.

Re: import legend/layerlist widget into custom widget

scottmiller10 — Fri, 01 Jun 2018 21:34:35 GMT

Yes, sorry I wasn't aware they were different. Is there a way I can redirect my post?

Re: import legend/layerlist widget into custom widget

RobertScheitlin__GISP — Fri, 01 Jun 2018 22:33:16 GMT

Scott,

I will move it to the WAB space. So now that I understand you are using WAB this changes things. On is that in your custom widget you do not want to add the WAB otb Legend widget but just add the JS API Legend dijit.