nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Using AGSJS TOC with ArcGIS Javascript 3.0

MeleKoneya

I have been using the Table of Contents widget from

https://code.google.com/p/gmaps-utility-gis/ with ArcGIS Javasript API 2.8 but wanted to update my API to 3.0 and have not had luck doing so.

I am not clear on how to migrate to 3.0 even after reading the documention.    I did update my dojoconfig to use the "packages" property.

dojoConfig = {
        parseOnLoad: true,
        packages: [{
          name: "agsjs",
          location: "http://gmaps-utility-gis.googlecode.com/svn/tags/agsjs/1.07/build/agsjs"


          }]

However, when using dojo.require("agsjs.dijit.TOC"); the table of contents does not load and the rest of my page does not load either.

Has anyone been able to use this Table of Contents widget with 3.0?    If so, can you provide instructions on how you got it to work?

Thanks,

Mele

Find more posts tagged with

Accepted answers

NianweiLiu

The key is add

dojo.require("dojo.fx")

which is a module used inside the widget. Since dojo 1.7 many modules have to be explicitly loaded.
Also, you need to download the code to your server since 3.0. There are some issues with xdomain used in junction with dojo.require.

You can get the updated code and sample here:

http://www.arcgis.com/home/item.html?id=9b6280a6bfb0430f8d1ebc969276b109

All comments

JosephDaood

hej
I have the same problem here.

NianweiLiu

The key is add

dojo.require("dojo.fx")

MeleKoneya

Thanks for answering this forum post and providing instructions on how to use your dijit in the 3.0 api. I have downloaded the latest JS from the link you provided and followed your instructions and things are working in 3.0

Mele

AdrianMarsden

Hi

Seeing this thread made me have another go at this TOC - last time I was still learning about the JSAPI

I have a code base that I use for many pages that all share the same main dynamic map service - the main page calls the script and passes an array of default visible layers, this is then test for in my code and actioned -

function defaultvis(layer) {
    visible = [];
    var items = dojo.map(layer.layerInfos, function (info, index) {


        if (contains(defaultlayers, info.name)) {
            visible.push(info.id);
            console.debug(info.name + "ative")
        } else {

            console.debug(info.name)
        }


    });
  
    dynamicMapServiceLayer.setVisibleLayers(visible);
}

This works fine, but of course the TOC code doesn't pick up on the changed visibility and shows all layers unticked (the default state) Any ideas how I should call a refresh or something of the TOC to get the boxes ticked?

Many thanks to the writer for a really nice TOC - it functions just as stated.

Cheers

ACM

AdrianMarsden

In case anyone else ins interested I worked it out - I have an array that contains the names of my default sub-layers, called defaultlayers, it is a global variable I then altered this part of the TOC.js


    _createRootLayerTOC: function () {
        var b = this.rootLayer;
        if (!b._tocInfos) {
            var c = {};
            dojo.forEach(b.layerInfos, function (d) {
                c["" + d.id] = d;
          console.debug(d)
    if (contains(defaultlayers,d.name)) {
      d.visible = true;
     }
    else {
     d.visible = false;
     }

.....

Cheers

ACM

NianweiLiu

Hi

This works fine, but of course the TOC code doesn't pick up on the changed visibility and shows all layers unticked (the default state) Any ideas how I should call a refresh or something of the TOC to get the boxes ticked?

The latest version (2.02) at http://www.arcgis.com/home/item.html?id=9b6280a6bfb0430f8d1ebc969276b109 will use the actual visibility of each layer if they are different than the settings in map service. You can also use the cross domain build without downloading it.

MeleKoneya

I have noticed that I have to reload my page in order to get the TOC to display. I can see that the agsjs.dijit.TOC is created on the initial load of the page, but the results do not show up in my 'tocDiv'. I have also experienced this behavior on the internet example site http://gmaps-utility-gis.googlecode.com/svn/tags/agsjs/2.02/examples/toc.html on the initial load the TOC does not show, but if I refresh in IE8, it does. Just wondering if there is a work around to address this behavior. Thanks, Mele

KhmelevskiyAndrey

I have noticed that I have to reload my page in order to get the TOC to display. I can see that the agsjs.dijit.TOC is created on the initial load of the page, but the results do not show up in my 'tocDiv'. I have also experienced this behavior on the internet example site http://gmaps-utility-gis.googlecode.com/svn/tags/agsjs/2.02/examples/toc.html on the initial load the TOC does not show, but if I refresh in IE8, it does. Just wondering if there is a work around to address this behavior. Thanks, Mele

I have exactly the same problem: when you run my app in IE9 the fist time it works however after it rerun again TOC it is not displayed any more - same happen with http://gmaps-utility-gis.googlecode.com/svn-history/r354/trunk/agsjs/examples/toc.html. I have tried to destroy dom and widjet itself - but it did not help. Is there any solution for it?

JosephDaood

I have exactly the same problem: when you run my app in IE9 the fist time it works however after it rerun again TOC it is not displayed any more - same happen with http://gmaps-utility-gis.googlecode.com/svn-history/r354/trunk/agsjs/examples/toc.html. I have tried to destroy dom and widjet itself - but it did not help. Is there any solution for it?

me too, I posted a new forum about that http://forums.arcgis.com/threads/63619-how-can-I-save-map-and-layers-settings-in-a-cookie?p=220155#post220155

It looks like a bug in toc. Is there any work around to this problem ?

DougCollins

Yes, I am having a similar problem. I have tried to get the agsjs TOC working with the ArcGIS JavaScript 3.2 API, and it does not work. I suspect there are issues with dojo 1.7.x here as well.

Too bad, because this looks like a really nice implementation of a TOC. Something that is missing from the ArcGIS JavaScript API.

Charlie

AdrianMarsden

I'm not sure of the issue - I'm using the TOC code here http://maps2.eastdevon.gov.uk/mapping/assets/ and it works fine in all browsers now (mine is slightly modified to take visible layers rather than default visibility - I did this before the core code was changed to do this)

ACM

SIT_AGSM_VERONA_SPAAGSM_VERONA

I'm not sure of the issue - I'm using the TOC code here http://maps2.eastdevon.gov.uk/mapping/assets/ and it works fine in all browsers now (mine is slightly modified to take visible layers rather than default visibility - I did this before the core code was changed to do this)

ACM

Hi to all!
I'm trying to install and configure dijit TOC locally but unfortunately the TOC doesn't appear. I looked at the source code you wrote (http://maps2.eastdevon.gov.uk/mapping/assets/) and I tryied to replicate the structure on my intranet server with the only result that the map is displayed but not the TOC.
I'm referencing the javascript API 3.2 (<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.2"></script>) and configuring the packages in this way:
    var djConfig = {
    parseOnLoad: true,
    packages: [{
   "name": "agsjs",
   "location": "http://<local server IP>/agsjs/build/agsjs"
    }]
};

I'm also referencing the package explicitly
dojo.require("dojo.fx");
dojo.require("agsjs.dijit.TOC");

without success... what's wrong? Am I missing something?

Thanks a lot!

BarryGuidry

I am also using the Javascript API 3.2, and agsjs 2.03, and cannot get it to work. Does the agsjs files HAVE to be on the web server? I have tried putting them on my Sharepoint site and linking to them in the Javascript of the web application, as well as in a local directory for testing. I don't know, maybe there is an issue with the Javascript API v.3.2 and the agsjs, as well; but, what leads me to believe this is not the issue is that it does work fine when using the public link to agsjs:

'http://gmaps-utility-gis.googlecode.com/svn/tags/agsjs/2.03/xbuild/agsjs'

Is there another option to load a TOC in the Javascript API?

KoryKramer_0-1606744472298.png

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.