Error {src: "dojoLoader", info: Array[2]}
GET http://serverapi.arcgisonline.com/jsapi/arcgis/3.3/js/dojo/jquery.js 404 (Not Found)
var dojoConfig = { // ... your stuff packages: [ {'jquery': 'path/to/your/jquery.js'} ] }
require(['jquery', 'esri/map'], function($, map) { // code... });
dojo.require("esri.map"); dojo.require("esri.toolbars.navigation"); dojo.require("esri.virtualearth.VETiledLayer"); dojo.require("dijit.form.Button"); dojo.require("dijit.Toolbar"); dojo.require("esri.layers.WebTiledLayer");
new esri.layers.WebTiledLayer("http://${subDomain}.tile2.opencyclemap.org/transport/${level}/${col}/${row}.png", { id: "ocmTransport", subDomains: ["a", "b", "c"], copyright: '© OpenStreetMap contributors' });
Error {src: "dojoLoader", info: Object}
url: "http://serverapi.arcgisonline.com/jsapi/arcgis/3.3/js/esri/nls/jsapi_en-us.js"
I got the same error and map was not loaded.
For me switching to dojo debug mode make my app working.
<script>
var dojoConfig = { isDebug: true };
</script>
<link rel="stylesheet" href="https://community.esri.com//js.arcgis.com/3.13/esri/css/esri.css">
<script src="http://js.arcgis.com/3.13/"></script>
dojoLoader error still exists but my map is loaded.
Maby this heps somebody.
Good loock!
Kuba
For esri folks: sample on esri website causes the same multipleDefine problem:
http://developers.arcgis.com/javascript/samples/framework_jquery/
I give up! Tell me what's wrong with this code:
<!DOCTYPE html>
<html>
<head>
<title>Create a Map</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="http://js.arcgis.com/3.13/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="http://js.arcgis.com/3.13/esri/css/esri.css">
<style>
html, body, #mapDiv { padding: 0; margin: 0; height: 100%; }
</style>
<script src="http://js.arcgis.com/3.13/"></script>
<script>
var map;
//require(["esri/map", "dojo/domReady!"], function(Map) {
// map = new Map("mapDiv", {
// center: [-56.049, 38.485],
// zoom: 3,
// basemap: "streets"
// });
//});
</script>
<script>
define([ "require", "exports",
"dojo/ready", "dojo/on", "dojo/dom-construct",
"esri/config", "esri/map", "esri/graphic", "esri/symbols/PictureMarkerSymbol",
"esri/layers/WMSLayer", "esri/geometry/Extent", "esri/geometry/Point",
"esri/geometry/webMercatorUtils", "esri/InfoTemplate", "esri/dijit/InfoWindowLite"],
function () {
console.log("dojo initialized.");
});
</script>
</head>
<body class="claro">
<div id="mapDiv"></div>
</body>
</html>
There is nothing but loading scripts and this code produces such output:
#$%&^
Kuba Szostak in your example if you switch to require instead of define it works. Define is for defining a new module. In the example you provided require, which loads existing modules, will work.
If you want to define a new module take a look at the Write a class help topic which shows how to create the module and load it into your app.
Revised version of your code:
<!DOCTYPE html> <html> <head> <title>Create a Map</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <link rel="stylesheet" href="http://js.arcgis.com/3.13/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="http://js.arcgis.com/3.13/esri/css/esri.css"> <style> html, body, #mapDiv { padding: 0; margin: 0; height: 100%; } </style> <script src="http://js.arcgis.com/3.13/"></script> <script> var map; //require(["esri/map", "dojo/domReady!"], function(Map) { // map = new Map("mapDiv", { // center: [-56.049, 38.485], // zoom: 3, // basemap: "streets" // }); //}); </script> <script> require([ "dojo/ready", "dojo/on", "dojo/dom-construct", "esri/config", "esri/map", "esri/graphic", "esri/symbols/PictureMarkerSymbol", "esri/layers/WMSLayer", "esri/geometry/Extent", "esri/geometry/Point", "esri/geometry/webMercatorUtils", "esri/InfoTemplate", "esri/dijit/InfoWindowLite"], function () { console.log("dojo initialized."); }); </script> </head> <body class="claro"> <div id="mapDiv"></div> </body> </html>
Kelly you are my personal hero!
AMD style programming is new for me so I missed difference between define() and require(). They describing both as quite the same with one difference that define() should return value. But thanks to you Kelly now I know that define() is 'lazy' declaration and when you execute define() function nothing will happen. In order to load/run code require() is needed.
I'm writing my code in TypeScript using ArcGIS JavaScript API, jQuery and jQueryMobile (because of their Sidebar Panel). When I switched to AMD style coding and move my JS script to require() method all of console errors are gone! There is my code:
<!--jQuery Mobile CDN--> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" /> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
<!-- Non AMD/dojo MapViewer scripts-->
<script src="js-mapviewer/mapviewer-init.js"></script>
<!--ArcGIS CDN--> <link rel="stylesheet" href="https://community.esri.com//js.arcgis.com/3.13/esri/css/esri.css"> <script src="http://js.arcgis.com/3.13/"></script>
<!-- MapViewer script (depend on ArcGIS/dojo/AMD) --> <script> require(["js-mapviewer/mapviewer-app.js"], function (mapViewer) {
console.log("MapViewer application loaded."); }); </script> <!--This is error prone: <script src="js-mapviewer/mapviewer-app.js"></script> -->
Thank you Kelly!
Kuba