topic Re: Undefined Function enableMouseWheel in ArcGIS JavaScript Maps SDK Questions

Undefined Function enableMouseWheel

TimSkinner — Fri, 12 Apr 2013 08:40:36 GMT

My public-facing application is throwing errors in the live environment which I can't reproduce in dev or test. The errors are:

Error in method ShowLoadingImage of common_v1.1.js on line 1: Object [object Object] has no method 'enableMouseWheel'
and
Error in method ShowLoadingImage of common_v1.1.js on line 1: 'undefined' is not a function.

The code for the ShowLoadingImage function is as follows:

function ShowLoadingImage()
{
    try
    {
        // Get the parameters and set up the image.
        var mapWidth = 0;
        var mapHeight = 0;
        var mapIsNull = false;

        if (_map != null && _map != 'undefined')
        {
            mapWidth = _map.width;
            mapHeight = _map.height;
        }
        else
        {
            mapIsNull = true;
        }

        var loadingImage = dojo.byId("uxLoadingImg");
        var uxNavigationDiv = dojo.byId("uxNavigationDiv");

        if (loadingImage != null && loadingImage != 'undefined')
        {
            if (mapWidth != null && mapWidth != 'undefined' && mapHeight != null && mapHeight != 'undefined')
            {
                // Calculate the location of the middle of the map.
                if (mapWidth > 0)
                {
                    loadingImage.style.left = mapWidth / 2 + "px";
                }

                if (mapHeight > 0)
                {
                    loadingImage.style.top = mapHeight / 2 + "px";
                }
            }

            // Show the loading image.
            esri.show(loadingImage);
        }

        if (!mapIsNull)
        {
            // Hide the other tools.
            _map.disableMapNavigation();
            _map.disablePan();
            _map.hideZoomSlider();
        }

        // Hide the navigation tool, if it is present.
        if (uxNavigationDiv != null && uxNavigationDiv != 'undefined')
        {
            esri.hide(uxNavigationDiv);
        }
    }
    catch (ex)
    {
        onerror(ex.message, "method ShowLoadingImage of common_v1.1.js", "1");
    }
}

I don't have a function 'enableMouseWheel in my code, but if I run the application in debug mode I notice that the _map object (an esri map object) has this function, although it isn't mentioned in the documentation for the version of the javascript api that I am using (2.7), so it looks as if, in some circumstances, this function is undefined and so an error is thrown.
Does anyone have any idea why this might be happening, and how I can prevent it ?

Re: Undefined Function enableMouseWheel

JohnGravois — Fri, 12 Apr 2013 22:24:08 GMT

are you seeing the error on pageLoad? do you have any code referencing esri namespaces that fires before the DOM has initialized?

Re: Undefined Function enableMouseWheel

TimSkinner — Mon, 15 Apr 2013 11:56:54 GMT

I think that the error occurs on Page Load, as the ShowLoadingImage function is wired up to the OnUpdateStart event of the map, but I can't reproduce the problem in my dev or test environments.
I'm afraid I don't know how to check whether I am referencing esri namespaces before the DOM has initialized - how can I do this ?

Re: Undefined Function enableMouseWheel

JohnGravois — Mon, 15 Apr 2013 22:56:15 GMT

typically if you wrap up any code which instantiates esri objects in an init function, you're safe. check out this forum thread for more info.

if you're only seeing errors in production i may have been off base...

Re: Undefined Function enableMouseWheel

TimSkinner — Tue, 16 Apr 2013 07:58:55 GMT

In the markup of the .ascx file that contains the map I have the following:

<link href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.7/js/dojo/dijit/themes/soria/soria.css"
    rel="stylesheet" type="text/css" />
<script type="text/javascript">
    var djConfig = {
        parseOnLoad: true
    };
</script>
<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.7"></script>
<script type="text/javascript">
    dojo.require("dijit.dijit"); // optimize: load dijit layer
    dojo.require("dijit.Tooltip");
    dojo.require("dijit.layout.BorderContainer");
    dojo.require("dijit.layout.ContentPane");
</script>
<script type="text/javascript" src="/Files/GISMaps/common_v1.1.js"></script>
<script type="text/javascript" src="/Files/GISMaps/small/main_v4.3.js"></script>
<script type="text/javascript" src="/Files/GISMaps/small/search_v4.2.js"></script>

and in the javascript file main_v4.3.js I have the following:

dojo.require("esri.map");
dojo.require("esri.layers.agstiled");
dojo.require("esri.layers.graphics");
dojo.require("esri.dijit.Scalebar");
dojo.require("esri.tasks.query");

// Define common variables used by all javascripts.
var _map = {};
var _osBackgroundLayers = ["osColour"];
var _osColour;
var _initialExtent;
var _resultExtent;
var _zoomLevel;
var _zoomPoint;
var _level;
var _scalebar;
var _postcode;
var _querystring;
var _addressPointGraphic;
var _adddressPointSymbol = new esri.symbol.PictureMarkerSymbol("/core-images/GISMaps/you-are-here.png", 35, 64).setOffset(0,20);
var _xhrCall;
var _backgroundCopyrightText;

// ****************************************************
// Call the initialise method when this function loads.
// ****************************************************
dojo.addOnLoad(Init);

// ***********************************************
// Initialises all the mapping elements on a page.
// ***********************************************
function Init()
{
    try
    {
        // Set the proxy (from the global file).
        esri.config.defaults.io.proxyUrl = g_agsProxy;

        // Parse the current page's querystring.
        _querystring = new Querystring();
        _postcode = _querystring.get("pcd");
        _uprn = _querystring.get("uprn");

        // Try and locate the map container on the current page.
        _mapPaneObject = dojo.byId("uxMapContentPaneDiv");

        // Only get the map if its container is currently displayed (to cater for multiview pages).
        if (_mapPaneObject != null && _mapPaneObject != 'undefined')
        {
            // Retrieve the default map.
            _initialExtent = new esri.geometry.Extent({ "xmin": g_xmin,
                                                        "ymin": g_ymin,
                                                        "xmax": g_xmax,
                                                        "ymax": g_ymax,
                                                        "spatialReference": {"wkid": g_wkid } });

            _map = new esri.Map("uxMapContentPaneDiv", { logo: false , extent: _initialExtent, navigationMode: 'classic' });

            // Add local event handlers etc to the map.
            dojo.connect(_map, "onUpdateStart", ShowLoadingImage);
            dojo.connect(_map, "onUpdateStart", AddCopyright);
            dojo.connect(_map, "onUpdateEnd", HideLoadingImage);
            dojo.connect(_map, "onZoomStart", ShowLoadingImage);
            dojo.connect(dijit.byId("uxMapContentPaneDiv"), 'resize', ResizeMap);
            dojo.connect(window, "onresize", ResizeMap);

            // Zoom slider config. NB: The appearance of the slider is controlled via the local css file, by the
            // #uxMapContentPaneDiv_zoom_slider entries.
            esri.config.defaults.map.slider = { left: "0px", top: "0px"};

            // If a querystring was found, use either the uprn or the postcode in it to perform a search.
            if (_uprn != null && _uprn != 'undefined' && _uprn != "")
            {
                LocationSearchFromUPRN(_uprn);
            }
            else
            {
                if (_postcode != null && _postcode != 'undefined' && _postcode != "")
                {
                    LocationSearchFromPostcode(_postcode);
                }
            }

            // Add colour layer to the map, using the url in the global file.
            _osColour = InitTiledLayer(g_osColourLayer, "osColour", true);
            dojo.connect(_osColour, "onUpdateEnd", HideLoadingImage);

            // Only add the error handling in live, as tiles may be missing in dev/test due
            // to capacity restrictions and we don't want them to fire when testing.
            if (g_environment != null && g_environment != 'undefined' && g_environment != "test" &&
                g_environment != "dev")
            {
                dojo.connect(_osColour, "onError", LayerLoadError);
            }
        }
    }
    catch (ex)
    {
        // Call the standard error handler.
        onerror(ex.message, "method Init of main_v4.3.js", "1");
    }
}

These errors did not appear until I upgraded from api version 2.4 to 2.7. Apart from a change in version, the other main change was the common_v1.1.js file, which now contains many more of the functions that used to be in the main_v4.3.js file, including functions that refer to the esri namespace - could the order in which I load these files be causing the problems ?