dojo.require 语句未按预期加载 Esri 地图模块



我正在开发一个php应用程序,其中我使用"arcgis"API来加载地图。 请在下面找到网址:

http://js.arcgis.com/3.11/

为了在我的应用程序中加载 ArcGIS 地图,我必须使用

dojo.require("esri.map");

所以在我的单页PHP应用程序中,我添加了这个require语句,如下所示:

<script type="text/javascript">
   dojo.require("esri.map");
</script>

在我给出的js文件中,地图加载如下:

var myOptions = {
                        maxZoom: 20,
                        minZoom: 3,
                        zoom:5,
                        isZoomSlider: false,
                        sliderStyle: "large",
                        sliderPosition: "top-right"             
                    };
        this.map = new esri.Map("mapDiv", myOptions);

但是当我运行此应用程序时,在"this.map = new esri"行中出现一个错误,指出"未捕获的类型错误:未定义不是一个函数"。Map("mapDiv", myOptions);"

如果我打开开发人员工具,则通过在require和esri保留断点来运行相同的代码。地图语句,我可以看到地图正在加载。但是如果我在没有打开开发人员工具的情况下运行它,那么我就会面临这个问题。

为什么 dojo.require 语句没有按预期工作?我做错了什么??请回复

您正在尝试加载具有旧模块要求的映射模块。尝试使用 AMD 语法要求映射,如文档中所示: require(["esri/map"], function(Map) { /* code goes here */ });

你需要将你的

JavaScript 代码包装在对 dojo.ready 的调用中。

文件:

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>JavaScript in Separate File</title>
    <link rel="stylesheet" href="http://js.arcgis.com/3.11/dijit/themes/claro/claro.css">
    <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css">
    <style>
      html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
      #mapDiv{padding:0;}
    </style>
    <script>var dojoConfig = {parseOnLoad: true};</script>
    <script src="//js.arcgis.com/3.11/"></script>
    <script src="code.js"></script>
    <script>
      dojo.require("esri.map");
      dojo.require("esri.layers.agstiled");
    </script>
  </head>
  <body class="claro" >
    <div id="mapDiv"></div>
  </body>
</html>

代码.js文件:

dojo.ready(function() { 
  var myOptions = {
                  maxZoom: 20,
                  minZoom: 3,
                  zoom:5,
                  isZoomSlider: false,
                  sliderStyle: "large",
                  sliderPosition: "top-right"             
              };
  this.map = new esri.Map("mapDiv", myOptions);
  var layer = new esri.layers.ArcGISTiledMapServiceLayer(
    "http://services.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer");
  this.map.addLayer(layer);
});

最新更新