topic Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded" in ArcGIS JavaScript Maps SDK Questions

Print task error "Uncaught RangeError: Maximum call stack size exceeded"

SharathNarasimhan — Mon, 23 Jul 2012 22:11:34 GMT

I am trying to use the Print task for printing out map with highlighted feature layers which is basically the results of a Find task. The Print task works fine before performing the Find task but just return an error on the browser console as "Uncaught RangeError: Maximum call stack size exceeded - esri._sanitize" when some of the features in the map are highlighted. I am currently using ArcGIS server 10.1 edition along with ArcGIS javascript 3.0 APIs.

Any suggestions on this. ?

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

JianHuang — Fri, 27 Jul 2012 22:39:47 GMT

Do you have very complex or large number of graphics on the map?

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

SharathNarasimhan — Mon, 30 Jul 2012 20:08:00 GMT

Well, The number of graphics on the map is quite large, But the print works fine as long as I haven't added any new graphics on the map using the statement map.graphics.add(). I even tested out by adding print functionality on this example - http://help.arcgis.com/en/webapi/javascript/arcgis/help/jssamples_start.htm and I have used the example from - http://help.arcgis.com/en/webapi/javascript/arcgis/help/jssamples_start.htm#jssamples/widget_print.html to create an print widget.

By using the statement map.graphics.add() am I adding a new dynamic graphics layer on to the map which is causing the Print function to fail ? Please provide your thoughts on the same.

Do you have very complex or large number of graphics on the map?

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Anonymous User — Fri, 24 Aug 2012 00:17:46 GMT

We're experiencing a similar issue. Whilst we can draw polygons, lines on a map and still print, when we plot search results as points on the map we essentially run out of stack space unless we issue a map.graphics.clear(). The number of points is irrelevant one or many experiences the same "out of stack space" issue. Simplifying the geometry of the point does not solve this issue.

We believe we've tracked it down to the datagrid, on searches that only yield one result (that is there can only be a max of one result) we don't use a datagrid and plot the result straight away. This map will print fine.

When searches that yield multiple results (which uses a datagrid to list) are run and plotted, soon as you click the print button we run out of stack space whether it be one result or many.

Incidentally, if we remove the structure property of the datagrid, the datagrid won't display any results, but still gets added to the DOM. Printing still works.

It appears that we can either plot the results as points on a map OR display them in the datagrid, but not both.

Finally, any text added to polygons, such as area and length will not be included in any print out.

Looking forward to some form of solution to this issue. We don't want to use the browser print option.

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

derekswingley1 — Fri, 24 Aug 2012 01:18:00 GMT

It sounds like you've done quite a bit of research/testing but the easiest way to get help is to post code that reproduces the issue. Can you post a simple test page that shows the problem?

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Anonymous User — Sat, 11 Dec 2021 18:02:56 GMT

Thanks Derek. I have cut the code back to a bare minimum for posting, search and printing only. All other non essential toolbar buttons and functionality removed. Still does the out of stack space (locks up if Firebug or Web Dev tools are open).

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=7, IE=9" />
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=yes"/>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dijit/themes/soria/soria.css" />
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dojox/grid/resources/Grid.css" />
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dojox/grid/resources/soriaGrid.css" />
 <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/esri/dijit/css/Popup.css" />
 <link rel="stylesheet" type="text/css" href="https://community.esri.com/css/beacon.css" />
 <link rel="stylesheet" type="text/css" href="https://community.esri.com/css/tabs.css" />
              <script type="text/javascript">dojoConfig = { parseOnLoad:true, locale:"en-gb" }</script>
              <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.1"></script>
 <script type="text/javascript">
   dojo.require("esri.map");
   dojo.require("dijit.form.Button");
   dojo.require("dijit.layout.BorderContainer");
   dojo.require("dijit.layout.ContentPane");
   dojo.require("dijit.layout.TabContainer");
   dojo.require("dijit.Toolbar");
   dojo.require("dojox.grid.DataGrid");
     dojo.require("dojo.data.ItemFileReadStore");
   dojo.require("dojo.data.ItemFileWriteStore");
   dojo.require("esri.dijit.Print");
                dojo.require("esri.tasks.find");

      var app = {};
   app.printUrl = "http://esweb1/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export Web Map Task";
   
      function init() {
     esri.config.defaults.io.proxyUrl = "/arcgisserver/proxy/proxy.ashx";
  
        app.map = new esri.Map("map", { 
    extent: new esri.geometry.Extent({ "xmin": 1073230, "ymin": 4793770, "xmax": 1514290, "ymax": 4960990, "spatialReference": { "wkid": 2193} }), 
    logo: false, 
    wraparound180: true 
  });
   
  var baseMapLayer = new esri.layers.ArcGISTiledMapServiceLayer ("http://services.arcgisonline.co.nz/ArcGIS/rest/services/Generic/newzealand/MapServer");
        app.map.addLayer(baseMapLayer) 
  
  var service = new esri.layers.ArcGISDynamicMapServiceLayer("http://esweb1/arcgis/rest/services/Public/Groundwater/MapServer", {opacity: this.opacity, id: "emap"});
        app.map.addLayer(service);
  
        dojo.connect(app.map, 'onLoad', function() {
          dojo.connect(dijit.byId('map'), 'resize', app.map, app.map.resize);     
          var printMap = esri.request({ "url": "http://esweb1/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export Web Map Task", "content": { "f": "json" } });
          printMap.then(print, error);  
        });
      } 
   
   function print(p) {
        var template = new esri.tasks.PrintTemplate();
        template.layout = "A4 Landscape";
        template.format = "pdf";

        template.layoutOptions = { "authorText": "", "copyrightText": "Copyright " + new Date().getFullYear(), "titleText": "Groundwater", "scalebarUnit": "Kilometers" };
  
        printer = new esri.dijit.Print({
          "map": app.map,
          "templates": [template],
          url: app.printUrl
        }, dojo.byId("print"));
        printer.startup();
      }
   
      function doFind() {
     var s = dojo.byId("query").value
       var findParams = new esri.tasks.FindParameters();
     var findTask = new esri.tasks.FindTask("http://esweb1/ArcGIS/rest/services/Public/Groundwater/MapServer");
     findParams.layerIds = [0];
     findParams.searchFields = ["Well_No"];
        findParams.returnGeometry = true;
        findParams.outSpatialReference = app.map.spatialReference;
     findParams.searchText = s;
     findTask.execute(findParams, showResults);
      }   
   
   function error(err) {
        alert("Error: " + err);
      }
   
      function showResults(results) {
        app.map.graphics.clear();

        if (results.length > 0) {
          var items = dojo.map(results, function(result) {
       var graphic = result.feature;
    graphic.setSymbol(new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, 14, 
         new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, 
         new dojo.Color([6, 105, 140]), 1), new dojo.Color([6, 105, 140, 0.5])
       ));
       app.map.graphics.add(graphic);
       return graphic.attributes;
         });
         var data = { 'identifier': 'OBJECTID', 'items': items }
         var store = new dojo.data.ItemFileReadStore({ data: data });
      //destroy("grid");  //remove the grid so that the new results are bound fresh
         var grid = new dojox.grid.DataGrid({ 'id': 'grid', 'store': store, 'structure': [{'name': 'Well Number', 'field': 'WELL_NO', 'width': '200px'}], 'rowSelector': '0px' });
         grid.placeAt("records");
         grid.startup();
        } else {
          alert("No results found matching your criteria.");
        }
   }
   dojo.ready(init);
 </script>
  </head>
  <body class="soria">
    <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="design:'headline'" style="width:100%; height:100%; margin:0;" id="workspace">
      <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'" id="header">
  <div id="toolbar" data-dojo-type="dijit.Toolbar">
     <div id="print"></div>
        </div>
      </div>
      <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'left'" style="width: 240px;" id="side">
  <div dojoType="dijit.layout.TabContainer" id="tabContainer" style="width: 100%; height: 100%;" tabPosition="top">
    <div dojoType="dijit.layout.ContentPane" title="Main" id="main">
         <h2>Search For...</h2>
   <div id="search">
           <p>
                Look For:</span><br/> <input type="text" id="query" style="width: 222px" />
        </p>
   </div>
      <p>
        Look In: <br/>
           <select id="lookIn" style="width: 228px">
                <option value="WN">Well Number</option>
              </select>
      </p>
      <p>
              <button data-dojo-type="dijit.form.Button" data-dojo-props='onClick:function(){ doFind();}, value:"Search"'>Search</button>
      </p>
    </div>
    <div dojoType="dijit.layout.ContentPane" title="Results" id="results">
      <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'left'" style="width: 240px;" id="records"></div>
    </div>
  </div>
      </div>
   <div id="map" data-dojo-props="region:'center'" data-dojo-type="dijit.layout.ContentPane"></div>
    </div>  
  </body>
</html>

Good luck. There is a destroyGrid method in the code above which is commented out in this code. We create the grid on the fly. Result is the same with a static grid.

Thanks for any assistance you can offer.

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

derekswingley1 — Sat, 11 Dec 2021 18:02:59 GMT

I tweaked your code to test, obviously I can't acces your Groundwater service:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=7, IE=9" />
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=yes"/>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dijit/themes/soria/soria.css"/>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dojox/grid/resources/Grid.css"/>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dojox/grid/resources/soriaGrid.css"/>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/esri/dijit/css/Popup.css"/>
    <link rel="stylesheet" type="text/css" href="https://community.esri.com/css/beacon.css" />
    <link rel="stylesheet" type="text/css" href="https://community.esri.com/css/tabs.css" />
    <style>
      html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
      #map { padding:0; }
    </style>
    <script type="text/javascript">
      dojoConfig = {
        parseOnLoad: true,
        locale: "en-gb"
      }
    </script>
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.1"></script>
    <script type="text/javascript">
      dojo.require("esri.map");
      dojo.require("dijit.form.Button");
      dojo.require("dijit.layout.BorderContainer");
      dojo.require("dijit.layout.ContentPane");
      dojo.require("dijit.layout.TabContainer");
      dojo.require("dijit.Toolbar");
      dojo.require("dojox.grid.DataGrid");
      dojo.require("dojo.data.ItemFileReadStore");
      dojo.require("dojo.data.ItemFileWriteStore");
      dojo.require("esri.dijit.Print");
      dojo.require("esri.tasks.find");

      var app = {};
      // app.printUrl = "http://esweb1/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export Web Map Task";
      app.printUrl = "http://sampleserver6.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task";

      function init() {
        // esri.config.defaults.io.proxyUrl = "/arcgisserver/proxy/proxy.ashx";
        esri.config.defaults.io.proxyUrl = "/~dswingley/esri_js/proxy/proxy.php";

        app.map = new esri.Map("map", {
          extent: new esri.geometry.Extent({
            "xmin": 1073230,
            "ymin": 4793770,
            "xmax": 1514290,
            "ymax": 4960990,
            "spatialReference": {
              "wkid": 2193
            }
          }),
          logo: false,
          wraparound180: true
        });

        var baseMapLayer = new esri.layers.ArcGISTiledMapServiceLayer("http://services.arcgisonline.co.nz/ArcGIS/rest/services/Generic/newzealand/MapServer");
        app.map.addLayer(baseMapLayer);

        console.log("this.opacity: ", this.opactiy);

        // var service = new esri.layers.ArcGISDynamicMapServiceLayer("http://esweb1/arcgis/rest/services/Public/Groundwater/MapServer", {
        //   opacity: this.opacity,
        //   id: "emap"
        // });
        // app.map.addLayer(service);
        
        var dynamicMapServiceLayer = new esri.layers.ArcGISDynamicMapServiceLayer("http://services.arcgisonline.co.nz/arcgis/rest/services/LINZ/geotiffs/MapServer", { "opacity": this.opacity });
        app.map.addLayer(dynamicMapServiceLayer);

        dojo.connect(app.map, 'onLoad', function () {
          dojo.connect(dijit.byId('map'), 'resize', app.map, app.map.resize);
          var printMap = esri.request({
            // "url": "http://esweb1/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export Web Map Task",
            "url": app.printUrl,
            "content": {
              "f": "json"
            }
          });
          printMap.then(print, error);
        });
      }

      function print(p) {
        var template = new esri.tasks.PrintTemplate();
        template.layout = "A4 Landscape";
        template.format = "pdf";

        template.layoutOptions = {
          "authorText": "",
          "copyrightText": "Copyright " + new Date().getFullYear(),
          "titleText": "Groundwater",
          "scalebarUnit": "Kilometers"
        };

        printer = new esri.dijit.Print({
          "map": app.map,
          "templates": [template],
          url: app.printUrl
        }, dojo.byId("print"));
        printer.startup();
        }

      function doFind() {
        var s = dojo.byId("query").value
        var findParams = new esri.tasks.FindParameters();
        var findTask = new esri.tasks.FindTask("http://esweb1/ArcGIS/rest/services/Public/Groundwater/MapServer");
        findParams.layerIds = [0];
        findParams.searchFields = ["Well_No"];
        findParams.returnGeometry = true;
        findParams.outSpatialReference = app.map.spatialReference;
        findParams.searchText = s;
        findTask.execute(findParams, showResults);
      }

      function error(err) {
        alert("Error: " + err);
      }

      function showResults(results) {
        app.map.graphics.clear();

        if (results.length > 0) {
          var items = dojo.map(results, function (result) {
            var graphic = result.feature;
            graphic.setSymbol(new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, 14,
            new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID,
            new dojo.Color([6, 105, 140]), 1), new dojo.Color([6, 105, 140, 0.5])));
            app.map.graphics.add(graphic);
            return graphic.attributes;
          });
          var data = {
            'identifier': 'OBJECTID',
            'items': items
          }
          var store = new dojo.data.ItemFileReadStore({
            data: data
          });
          //destroy("grid");  //remove the grid so that the new results are bound fresh
          var grid = new dojox.grid.DataGrid({
            'id': 'grid',
            'store': store,
            'structure': [{
              'name': 'Well Number',
              'field': 'WELL_NO',
              'width': '200px'
            }],
            'rowSelector': '0px'
          });
          grid.placeAt("records");
          grid.startup();
        } else {
          alert("No results found matching your criteria.");
        }
      }
      dojo.ready(init);
    </script>
  </head>
  
  <body class="soria">
    <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="design:'headline'"
    style="width:100%; height:100%; margin:0;" id="workspace">
      <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'"
      id="header">
        <div id="toolbar" data-dojo-type="dijit.Toolbar">
          <div id="print"></div>
        </div>
      </div>
      <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'left'"
      style="width: 240px;" id="side">
        <div dojoType="dijit.layout.TabContainer" id="tabContainer" style="width: 100%; height: 100%;"
        tabPosition="top">
          <div dojoType="dijit.layout.ContentPane" title="Main" id="main">
            <h2>Search For...</h2>
            <div id="search">
              <p>Look For:</span>
                <br/>
                <input type="text" id="query" style="width: 222px" />
              </p>
            </div>
            <p>Look In:
              <br/>
              <select id="lookIn" style="width: 228px">
                <option value="WN">Well Number</option>
              </select>
            </p>
            <p>
              <button data-dojo-type="dijit.form.Button" data-dojo-props='onClick:function(){ doFind();}, value:"Search"'>Search</button>
            </p>
          </div>
          <div dojoType="dijit.layout.ContentPane" title="Results" id="results">
            <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'left'"
            style="width: 240px;" id="records"></div>
          </div>
        </div>
      </div>
      <div id="map" data-dojo-props="region:'center'" data-dojo-type="dijit.layout.ContentPane"></div>
    </div>
  </body>

</html>

Printing works with that code so I'm guessing there's something specific to features in your Groundwater service. Two things we can look at:
�??post the JSON (either as a code sample or an attached file) returned from your Groundwater service? That way I can create some graphics from that and see if it breaks printing. You can get to the JSON via firebug's Net section
�??post the JSON that's being sent to the print service, also available from firebug's Net section

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Anonymous User — Sat, 11 Dec 2021 18:03:02 GMT

Hi Derek,

Thanks for your reply once again.

I can go one step better than json, here's a link to the external rest service:

http://gis.es.govt.nz/ArcGIS/rest/services/Groundwater/MapServer

This server is running 10.0 but it happens on both 10.0 and 10.1 using api versions 2.8, 3.0 and 3.1.

Unfortunately you probably won't be able to get any JSON from the printing process as soon as you click the button, it'll lock the browser up with an "unresponsive script" response. I.E will report stack issues. With firebug closed (not recording) the button will change to "printing" but nothing will print and the button stays like that until you refresh the page again.

Incidentally using your dynamic layer with our Groundwater layer in the Find Task allows us to print but using any of our map services doesn't

We've also tried with no success:

1. Upping the allowable server instances to see if that was causing it.
2. Using two servers with the same rest service, one used for the Dynamic Layer and the other the Find Task.
3. Mixing and matching services.
4. Hard coding the grid instead of creating on the fly (thus structure is set in stone rather than dynamically changing based upon search type), i.e

<table data-dojo-type="dojox.grid.DataGrid" data-dojo-id="grid"  id="tgrid" data-dojo-props="rowSelector:'20px'">
  <thead>
    <tr>
      <th field="Well_No">Well No</th>
    </tr>
  </thead>
</table>

Web Server setup:

We have one webserver (with a second ready to go) feeding off two GIS servers running 10.1 on Windows 2008 using IIS and GIS Authentication. .NET 4.0 has been installed on the web server for some of the web applications that require it.

Thanks for any light you can shed on this issue.

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

derekswingley1 — Mon, 27 Aug 2012 01:54:07 GMT

Unfortunately you probably won't be able to get any JSON from the printing process as soon as you click the button, it'll lock the browser up with an "unresponsive script" response. I.E will report stack issues. With firebug closed (not recording) the button will change to "printing" but nothing will print and the button stays like that until you refresh the page again.

When your app locks up the browser, or you see errors like you've described, the problem is almost certainly something to do with some JS you're running. In this particular case, since you're using references to each graphic's attributes object to create your store, Dojo then modifies the attributes object when you use them to create an ItemFileReadStore. This leads to the issue you're seeing when you try to print the map (there would also probably be some weirdness in your app if you tried to do something like display map graphic attributes when they're clicked).

The underlying print code in the JS API processes all map layers (including graphics) to remove object properties that are undefined or null (two reasons for this: it's a waste to send properties that are undefined or null and the print service doesn't handle those types of values elegantly). When the JS API print code tries to process the graphic's attributes after they've been put through Dojo's store creation process it gets into an infinite loop somewhere. I haven't completely figured out the details on this, but it's definitely the source of your error.

A simple fix would be to clone graphic.attributes instead of referencing it directly in your array of objects used to create your store:

var items = dojo.map(results, function (result) {   var graphic = result.feature;   var sms = esri.symbol.SimpleMarkerSymbol;   var sls = esri.symbol.SimpleLineSymbol;   graphic.setSymbol(     new sms(       "circle",        14,       new sls("solid", new dojo.Color([6, 105, 140]), 1),        new dojo.Color([6, 105, 140, 0.5])     )   );   app.map.graphics.add(graphic);   return dojo.clone(graphic.attributes); });

Here's a full working example that prints when you have graphics (I was testing with graphics that come back when searching for 1):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html>      <head>     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />     <meta http-equiv="X-UA-Compatible" content="IE=7, IE=9" />     <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=yes"/>     <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dijit/themes/soria/soria.css"/>     <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dojox/grid/resources/Grid.css"/>     <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dojox/grid/resources/soriaGrid.css"/>     <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/esri/dijit/css/Popup.css"/>     <link rel="stylesheet" type="text/css" href="https://community.esri.com/css/beacon.css" />     <link rel="stylesheet" type="text/css" href="https://community.esri.com/css/tabs.css" />     <style>       html, body { height: 100%; width: 100%; margin: 0; padding: 0; }       #map { padding:0; }     </style>     <script type="text/javascript">       dojoConfig = {         parseOnLoad: true,         locale: "en-gb"       }     </script>     <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.1"></script>     <script type="text/javascript">       dojo.require("esri.map");       dojo.require("dijit.form.Button");       dojo.require("dijit.layout.BorderContainer");       dojo.require("dijit.layout.ContentPane");       dojo.require("dijit.layout.TabContainer");       dojo.require("dijit.Toolbar");       dojo.require("dojox.grid.DataGrid");       dojo.require("dojo.data.ItemFileReadStore");       dojo.require("dojo.data.ItemFileWriteStore");       dojo.require("esri.dijit.Print");       dojo.require("esri.tasks.find");        var app = {};       app.printUrl = "http://sampleserver6.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task";        function init() {         esri.config.defaults.io.proxyUrl = "/arcgisserver/proxy/proxy.ashx";          app.map = new esri.Map("map", {           extent: new esri.geometry.Extent({             "xmin": 1073230,             "ymin": 4793770,             "xmax": 1514290,             "ymax": 4960990,             "spatialReference": {               "wkid": 2193             }           }),           logo: false,           wraparound180: true         });          var baseMapLayer = new esri.layers.ArcGISTiledMapServiceLayer("http://services.arcgisonline.co.nz/ArcGIS/rest/services/Generic/newzealand/MapServer");         app.map.addLayer(baseMapLayer);          dojo.connect(app.map, 'onLoad', function () {           dojo.connect(dijit.byId('map'), 'resize', app.map, app.map.resize);           var printMap = esri.request({             "url": app.printUrl,             "content": {               "f": "json"             }           });           printMap.then(print, error);         });       }        function print(p) {         var template = new esri.tasks.PrintTemplate();         template.layout = "A4 Landscape";         template.format = "pdf";          template.layoutOptions = {           "authorText": "",           "copyrightText": "Copyright " + new Date().getFullYear(),           "titleText": "Groundwater",           "scalebarUnit": "Kilometers"         };          printer = new esri.dijit.Print({           "map": app.map,           "templates": [template],           url: app.printUrl         }, dojo.byId("print"));         printer.startup();         }        function doFind() {         var s = dojo.byId("query").value         var findParams = new esri.tasks.FindParameters();         var findTask = new esri.tasks.FindTask("http://gis.es.govt.nz/ArcGIS/rest/services/Groundwater/MapServer");         findParams.layerIds = [0];         findParams.searchFields = ["Well_No"];         findParams.returnGeometry = true;         findParams.outSpatialReference = app.map.spatialReference;         findParams.searchText = s;         findTask.execute(findParams, showResults);       }        function error(err) {         alert("Error: " + err);       }        function showResults(results) {         app.map.graphics.clear();          if (results.length > 0) {           var items = dojo.map(results, function (result) {             var graphic = result.feature;             var sms = esri.symbol.SimpleMarkerSymbol;             var sls = esri.symbol.SimpleLineSymbol;             graphic.setSymbol(               new sms(                 "circle",                  14,                 new sls("solid", new dojo.Color([6, 105, 140]), 1),                  new dojo.Color([6, 105, 140, 0.5])               )             );             app.map.graphics.add(graphic);             return dojo.clone(graphic.attributes);           });           console.log("items: ", items);           var data = {             'identifier': 'OBJECTID',             'items': items           }           var store = new dojo.data.ItemFileReadStore({             data: data           });           var grid = new dojox.grid.DataGrid({             'id': 'grid',             'store': store,             'structure': [{               'name': 'Well Number',               'field': 'WELL_NO',               'width': '200px'             }],             'rowSelector': '0px'           });           grid.placeAt("records");           grid.startup();         } else {           alert("No results found matching your criteria.");         }       }       dojo.ready(init);     </script>   </head>      <body class="soria">     <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="design:'headline'"     style="width:100%; height:100%; margin:0;" id="workspace">       <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'"       id="header">         <div id="toolbar" data-dojo-type="dijit.Toolbar">           <div id="print"></div>         </div>       </div>       <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'left'"       style="width: 240px;" id="side">         <div dojoType="dijit.layout.TabContainer" id="tabContainer" style="width: 100%; height: 100%;"         tabPosition="top">           <div dojoType="dijit.layout.ContentPane" title="Main" id="main">             <h2>Search For...</h2>             <div id="search">               <p>Look For:</span>                 <br/>                 <input type="text" id="query" style="width: 222px" />               </p>             </div>             <p>Look In:               <br/>               <select id="lookIn" style="width: 228px">                 <option value="WN">Well Number</option>               </select>             </p>             <p>               <button data-dojo-type="dijit.form.Button" data-dojo-props='onClick:function(){ doFind();}, value:"Search"'>Search</button>             </p>           </div>           <div dojoType="dijit.layout.ContentPane" title="Results" id="results">             <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'left'"             style="width: 240px;" id="records"></div>           </div>         </div>       </div>       <div id="map" data-dojo-props="region:'center'" data-dojo-type="dijit.layout.ContentPane"></div>     </div>   </body>  </html>

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Anonymous User — Sat, 11 Dec 2021 18:03:05 GMT

We just tested using someone else's services and had the same result as we wanted to test our setup.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=7, IE=9" />
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=yes"/>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dijit/themes/soria/soria.css"/>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dojox/grid/resources/Grid.css"/>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dojox/grid/resources/soriaGrid.css"/>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/esri/dijit/css/Popup.css"/>
    <link rel="stylesheet" type="text/css" href="https://community.esri.com/css/beacon.css" />
    <link rel="stylesheet" type="text/css" href="https://community.esri.com/css/tabs.css" />
    <style>
      html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
      #map { padding:0; }
    </style>
    <script type="text/javascript">
      dojoConfig = {
        parseOnLoad: true,
        locale: "en-gb"
      }
    </script>
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.1"></script>
    <script type="text/javascript">
      dojo.require("esri.map");
      dojo.require("dijit.form.Button");
      dojo.require("dijit.layout.BorderContainer");
      dojo.require("dijit.layout.ContentPane");
      dojo.require("dijit.layout.TabContainer");
      dojo.require("dijit.Toolbar");
      dojo.require("dojox.grid.DataGrid");
      dojo.require("dojo.data.ItemFileReadStore");
      dojo.require("dojo.data.ItemFileWriteStore");
      dojo.require("esri.dijit.Print");
      dojo.require("esri.tasks.find");

      var app = {};
      app.printUrl = "http://esweb1/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export Web Map Task";
      //app.printUrl = "http://sampleserver6.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task";

      function init() {
        esri.config.defaults.io.proxyUrl = "/arcgisserver/proxy/proxy.ashx";
        //esri.config.defaults.io.proxyUrl = "/~dswingley/esri_js/proxy/proxy.php";

        app.map = new esri.Map("map", {
          extent: new esri.geometry.Extent({
            "xmin": 19159196.0604085,
            "ymin": -5395900.2294505,
            "xmax": 19253117.1997641,
            "ymax": -5353486.89803372,
            "spatialReference": {
              "wkid": 102100
            }
          }),
          logo: false,
          wraparound180: true
        });

        var baseMapLayer = new esri.layers.ArcGISTiledMapServiceLayer("http://services.arcgisonline.com/ArcGIS/rest/services/Ocean_Basemap/MapServer");
        app.map.addLayer(baseMapLayer);
        
        var dynamicMapServiceLayer = new esri.layers.ArcGISDynamicMapServiceLayer("http://arcgis.ecan.govt.nz/ArcGIS/rest/services/Public/Bus_Routes/MapServer", { "opacity": 0.8 });
        app.map.addLayer(dynamicMapServiceLayer);

        dojo.connect(app.map, 'onLoad', function () {
          dojo.connect(dijit.byId('map'), 'resize', app.map, app.map.resize);
          var printMap = esri.request({
            "url": app.printUrl,
            "content": {
              "f": "json"
            }
          });
          printMap.then(print, error);
        });
      }

      function print(p) {
        var template = new esri.tasks.PrintTemplate();
        template.layout = "A4 Landscape";
        template.format = "pdf";

        template.layoutOptions = {
          "authorText": "",
          "copyrightText": "Copyright " + new Date().getFullYear(),
          "titleText": "Groundwater",
          "scalebarUnit": "Kilometers"
        };

        printer = new esri.dijit.Print({
          "map": app.map,
          "templates": [template],
          url: app.printUrl
        }, dojo.byId("print"));
        printer.startup();
        }

      function doFind() {
        var s = dojo.byId("query").value
        var findParams = new esri.tasks.FindParameters();
        var findTask = new esri.tasks.FindTask("http://arcgis.ecan.govt.nz/ArcGIS/rest/services/Public/Bus_Routes/MapServer");
        findParams.layerIds = [1];
        findParams.searchFields = ["RoadName"];
        findParams.returnGeometry = true;
        findParams.outSpatialReference = app.map.spatialReference;
        findParams.searchText = s;
        findTask.execute(findParams, showResults);
      }

      function error(err) {
        alert("Error: " + err);
      }

      function showResults(results) {
        app.map.graphics.clear();

        if (results.length > 0) {
          var items = dojo.map(results, function (result) {
            var graphic = result.feature;
            graphic.setSymbol(new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, 14,
            new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID,
            new dojo.Color([6, 105, 140]), 1), new dojo.Color([6, 105, 140, 0.5])));
            app.map.graphics.add(graphic);
            return graphic.attributes;
          });
          var data = {
            'identifier': 'OBJECTID',
            'items': items
          }
          var store = new dojo.data.ItemFileReadStore({
            data: data
          });
          //destroy("grid");  //remove the grid so that the new results are bound fresh
          var grid = new dojox.grid.DataGrid({
            'id': 'grid',
            'store': store,
            'structure': [{
              'name': 'RoadName',
              'field': 'RoadName',
              'width': '200px'
            }],
            'rowSelector': '0px'
          });
          grid.placeAt("records");
          grid.startup();
        } else {
          alert("No results found matching your criteria.");
        }
      }
      dojo.ready(init);
    </script>
  </head>
  
  <body class="soria">
    <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="design:'headline'"
    style="width:100%; height:100%; margin:0;" id="workspace">
      <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'"
      id="header">
        <div id="toolbar" data-dojo-type="dijit.Toolbar">
          <div id="print"></div>
        </div>
      </div>
      <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'left'"
      style="width: 240px;" id="side">
        <div dojoType="dijit.layout.TabContainer" id="tabContainer" style="width: 100%; height: 100%;"
        tabPosition="top">
          <div dojoType="dijit.layout.ContentPane" title="Main" id="main">
            <h2>Search For...</h2>
            <div id="search">
              <p>Look For:</span>
                <br/>
                <input type="text" id="query" style="width: 222px" />
              </p>
            </div>
            <p>Look In:
              <br/>
              <select id="lookIn" style="width: 228px">
                <option value="WN">Well Number</option>
              </select>
            </p>
            <p>
              <button data-dojo-type="dijit.form.Button" data-dojo-props='onClick:function(){ doFind();}, value:"Search"'>Search</button>
            </p>
          </div>
          <div dojoType="dijit.layout.ContentPane" title="Results" id="results">
            <div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'left'"
            style="width: 240px;" id="records"></div>
          </div>
        </div>
      </div>
      <div id="map" data-dojo-props="region:'center'" data-dojo-type="dijit.layout.ContentPane"></div>
    </div>
  </body>
</html>

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

derekswingley1 — Mon, 27 Aug 2012 03:00:13 GMT

Were you able to try my suggestion of using dojo.clone inside of your callback to dojo.map?

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Anonymous User — Mon, 27 Aug 2012 21:40:46 GMT

Hi Derek,

Sorry, your post regarding the clone only showed up this morning. Our proxy must've served an older version of it 😞

You're a champion. The one line you provided fixed our issue. Thanks very much. Yes, there are a lot of NULL attributes in the data, which have caused issues in other areas of our apps as well and had no idea that they'd interfere with the printing. Most, if not all our underlying data for our services will have NULLs in some fields of the data (frustrates the bejebus out of me).

Once again, thanks for all your attention and help in this matter. Much appreciated.

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

SharathNarasimhan — Sat, 11 Dec 2021 18:03:08 GMT

Hello Derek and Ingrid,

Sorry about not catching up on this thread. Your discussions have revealed several insights to this problem. Thanks a lot for that.

Derek,

I tried implementing your code fix without any luck !

var items = dojo.map(results, function (result) {
  var graphic = result.feature;
  var sms = esri.symbol.SimpleMarkerSymbol;
  var sls = esri.symbol.SimpleLineSymbol;
  graphic.setSymbol(
    new sms(
      "circle", 
      14,
      new sls("solid", new dojo.Color([6, 105, 140]), 1), 
      new dojo.Color([6, 105, 140, 0.5])
    )
  );
  app.map.graphics.add(graphic);
  return dojo.clone(graphic.attributes);
});

The underlying print code in the JS API processes all map layers (including graphics) to remove object properties that are undefined or null (two reasons for this: it's a waste to send properties that are undefined or null and the print service doesn't handle those types of values elegantly). When the JS API print code tries to process the graphic's attributes after they've been put through Dojo's store creation process it gets into an infinite loop somewhere. I haven't completely figured out the details on this, but it's definitely the source of your error.

I think my situation is similar to Ingrid here, wherein there are a lot of NULL attributes in the data. I am completely confused about this right now, please help me out on these queries:
Will these NULL attributes affect the print code of the JS API only when they are present in results ? (I think this might not be the case since I have removed NULL attributes for the retrieved data and still encountered the same error)
Does the print code consider the data attributes of all the layers of the map ? (Although the print code works fine when no graphics are selected)

Your help in this is much appreciated. Thanks in advance.

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

derekswingley1 — Fri, 07 Sep 2012 12:30:05 GMT

I think my situation is similar to Ingrid here, wherein there are a lot of NULL attributes in the data. I am completely confused about this right now, please help me out on these queries:
Will these NULL attributes affect the print code of the JS API only when they are present in results ? (I think this might not be the case since I have removed NULL attributes for the retrieved data and still encountered the same error)
Does the print code consider the data attributes of all the layers of the map ? (Although the print code works fine when no graphics are selected)

Ingrid's situation was complicated by the fact that an ItemFileReadStore was being created using esri.Graphic.attributes objects. The ItemFileReadStore was modifying the structure of esri.Graphic.attributes and that, along with many null values, was causing the problem.

In Ingrid's case, we were able to get to a solution relatively quickly because code to reproduce was posted. Can you post some code to repro your issue?

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

SharathNarasimhan — Fri, 07 Sep 2012 18:50:00 GMT

Sorry about my previous comment. Your solution does work when we clone the graphic objects which are added to the ItemFileReadStore. I had failed to use the cloned objects. 🙂

Thanks a ton Derek !

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

derekswingley1 — Fri, 07 Sep 2012 19:25:30 GMT

Glad to help and glad you got it figured out.

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

AdrianMarsden — Sat, 11 Dec 2021 18:03:10 GMT

Hi Derek

I've got similar issues - I tweak one of my showresults functions like this

        var Findsymbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID,          new dojo.Color([98, 194, 204]), 2), new dojo.Color([98, 194, 204, 0.5]));
        var items = dojo.map(results, function (result) {
            var graphic = result.feature;
            graphic.setSymbol(Findsymbol);
            map.graphics.add(graphic);
            return dojo.clone(graphic.attributes);
            //return result.feature.attributes;
        });

This worked fine with fixing the stack overflow on print, however, as I had an onclick that went to the feature, that then broke.



function onRowClickHandlerLS(evt) {
    var clickedFeature = gridx.getItem(evt.rowIndex).OBJECTID;
    var selectedFeature;
    dojo.forEach(map.graphics.graphics, function (graphic) {
        if ((graphic.attributes) && graphic.attributes.OBJECTID === clickedFeature) {
            selectedFeature = graphic;
            return;
        }
    });
    var FeatureExtent = selectedFeature.geometry.getExtent();
    map.setExtent(FeatureExtent);
}

"Uncaught TypeError: Cannot read property 'geometry' of undefined "

Any ideas? I'm having a good look at the moment but haven't seen anything obvious.

Cheers

ACM

Edit - it looks like either the graphic.attribute.OBJECTID or cthe row OBJECTID was not getting returned in the same type as it used to. I have modified the onclick routine so -

function onRowClickHandlerLS(evt) {
    var clickedFeature = gridx.getItem(evt.rowIndex).OBJECTID;
    var selectedFeature;
    dojo.forEach(map.graphics.graphics, function (graphic) {
        var n1 = graphic.attributes.OBJECTID.toString();
        var n2 = clickedFeature.toString();
       
        if ((graphic.attributes) && n1 === n2) {
            console.debug("..." + n1 + "..." + n2 + "...")
            selectedFeature = graphic;
            return;
        }
    });
    var FeatureExtent = selectedFeature.geometry.getExtent();
    map.setExtent(FeatureExtent);
}

and all is well (on that one, I've another task that puts results into a grid that works different that I'm having issues with - more later, maybe, if I can't sort it)

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

EmilyLaMunyon — Sat, 11 Dec 2021 18:03:13 GMT

Hello,
I am having the same issue, where selected graphics do not show up when the map is printed, however, using dojo.clone works in a situation like this:

 dojo.forEach(response,function(result){
               var feature = result.feature;
               feature.setSymbol(markerSymbol);
               map.graphics.add(feature);
         return dojo.clone(feature.attributes);

However, when I use the dojo.clone, it seems like the ID is not being passed and my datagrid and zoom to functions are broken. Does anyone have ideas on how to fix this?

Thanks for any advice!

topic Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded" in ArcGIS JavaScript Maps SDK Questions

Print task error &quot;Uncaught RangeError: Maximum call stack size exceeded&quot;

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Re: Print task error "Uncaught RangeError: Maximum call stack size exceeded"

Print task error "Uncaught RangeError: Maximum call stack size exceeded"