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.
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); });
<!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 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); 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>
dojo.forEach(response,function(result){ var feature = result.feature; feature.setSymbol(markerSymbol); map.graphics.add(feature); return dojo.clone(feature.attributes);
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; });
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 "
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); }
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)
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.
<!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 Web Map Task"; 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>
<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>
<!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 Web Map Task"; 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>
<!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>
Do you have very complex or large number of graphics on the map?
Angemeldete Mitglieder können Beiträge verfassen, Updates folgen und mehr. Neu hier? Registriere ein kostenloses Konto.
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.