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; } } }

How to save object globally in a ArcGIS API For JavaScript Application?

SanajyJadhav

Hello,

I have one question regarding creation of objects in a JavaScript Application in a modular development.

If I create any object, for example esri/map object one one AMD module, how to access it on some other module. Let's assume that in a HTML page, when a dom is ready, I call some some method from a module to create a map as below;

define(["esri/map",
        "dojo/on"], function (Map) {


    return {       
        createMap: function (mapDivID) {
            var map = new Map(mapDivID);
        }, //createMap ends
    };
});

Now, I call this function from my HTML page when the DOM is ready. However, I'm not being able to figure out how to access this map variable (map object) on another AMD module. I guess I need to save it globally but How?

Any help is much appreciated.

Cheers,

Najděte více příspěvků označených jako

Accepted answers

All comments

SanajyJadhav

Thanks Owen for the response. Appreciate it.

OwenEarley

If you are going to use global variables it is best practice to create a namespace for them. This can avoid potential name clashes with other JS libraries.

There is a heap of information available online - just Google 'javascript global variables namespace'.

SanajyJadhav

I wanted to mark Steve's and Sarah's answers as correct but could not since only one can be marked as correct.

SanajyJadhav

Hello,

Actually both of you were right. I just declared the map variable as the first line of a module and after that defined the module.And I returned the map object from the function that actually created the map ( return map;) So,I could save the map object on my main.js as global variable. No need to create a class inside a module,because from a normal function in a module,I could return the object.

Thanks to both of you.

Cheers,

SanajyJadhav

Steve and Sarah, Thank you for responses. Appreciate it.

So,it seems I have to create a class inside a module and then return the map object to the calling module (main.js)

There is one thing worth mentioning that after investigating a bit, I found that you can save all of your global variables as window.variableName. So I used window.esriMap as below.

//could not highlight the code as JavaScript.

define(["esri/map",

"dojo/on"], function (Map, on) {

return {

createMap: function (mapDivID) {

window.esriMap = new Map(mapDivID);

}, //createMap ends

};

});

By doing this, esriMap is available in any module of the application.So,would you like to share if anybody has used this approach? I mean I would like to know if there are any issue using window.esriMap

I will put my class approach outcome here.

Cheers,

Anonymous User

I agree with Steve if you simply want to create a global variable.

However, if you have this "extra" module creating a map and you then run that module from a different script (like 'main.js'), then in the createMap() function I would return the 'map'. In my own script when I run createMap() in 'main.js' I save it to a global variable, and I keep track of all my global variables from the main.js script.

I also had included a 'declare' statement based on this esri sample. I'm still unclear on defining classes though so that part might be irrelevant.

define(["esri/map", "dojo/on", "dojo/_base/declare"], function(Map) {
     return declare([], {
          createMap : function (mapDivID) {
               var map = new Map(mapDivID);
               return map;
           }
     });
});

evtguy

Wouldn't you just declare the map variable globally and then assign it within the define section? Something like this:

var map;
define(["esri/map",
"dojo/on"], function (Map) {
return {
createMap: function (mapDivID) {
map = new Map(mapDivID);
}, //createMap ends
};
});

define(["esri/map",         "dojo/on"], function (Map) {       return {                createMap: function (mapDivID) {             var map = new Map(mapDivID);         }, //createMap ends     }; });

Připojte se k diskusi

Přihlášení členové mohou přispívat, sledovat aktualizace a další. Jste tu noví? Zaregistrujte si bezplatný účet.

Rychlé odkazy

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