Question

我正在开发一个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.Map语句中保留断点来运行相同的代码，我可以看到地图正在加载。但如果我在没有打开开发人员工具的情况下运行它，那么我就面临着这个问题。

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

Answer 1

您正在尝试使用旧版模块加载地图模块。尝试使用AMD语法映射，如docs所示： require(["esri/map"], function(Map) { /* code goes here */ });

Answer 2

您需要将JavaScript代码打包到dojo.ready。

HTML文件：

<!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>

code.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);
});

dojo.require语句未按预期加载esri Map模块

2 个答案: