arcgis api for js初学

鹰眼怎么加；点怎么加；控件怎么调用？

找了两天找到了不能显示地图的地方，初学就是难，就是怕坚持找，还是让我找到了！

<!DOCTYPE html>
<html>
  <head>
  
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>Overview Map</title>
    <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 { height: 100%; width: 100%; margin: 0; padding: 0; }
      
    </style>
    <script src="http://js.arcgis.com/3.13/"></script>
    <script>
        var map;
        require
    ([
    "esri/map", "esri/dijit/OverviewMap",
    "dojo/parser",

    "dojo/layout/BorderContainer",
     "dijit/layout/ContentPane",          //
     "dojo/domReady!"
            ],

            function (
            Map, OverviewMap,
            parser
            ) {
                parser.parse();
                map = new Map("map", {
                    basemap: "osm",
                    center: [-122.445, 37.752],
                    zoom: 14
                });
                var overviewMapDijit = new OverviewMap
({
    map: map,
    visible: true
});
                overviewMapDijit.startup();

            });
    </script>
  </head>
  
  <body class="claro">
    <div data-dojo-type="dijit/layout/BorderContainer" 
         data-dojo-props="design:'headline', gutters:false" 
         style="width: 100%; height: 100%; margin:0;">

      <div id="map" 
           data-dojo-type="dijit/layout/ContentPane" 
           data-dojo-props="region:'center'" 
           style="padding:0">
      </div>
    </div>
  </body>
</html>

出错的地方就是dojo/layout/BorderContainer改成dijit/..，我始终不理解dojo/layout是干嘛使的，但是坚持再学学，我又下定了去黑马学习net的决心。。。

至于其余小控件也叫widget如比例尺等在此网址上都有https://developers.arcgis.com/javascript/jssamples/graphics_create_circles.html，能加速学习。

有一个search的功能我觉得很好，所以单独copy下面：

<!DOCTYPE html>
<html dir="ltr">

<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>ArcGIS API for JavaScript | Basic Search</title>
   <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,
      #map {
         height: 100%;
         width: 100%;
         margin: 0;
         padding: 0;
      }
      #search {
         display: block;
         position: absolute;
         z-index: 2;
         top: 20px;
         left: 74px;
      }
   </style>
   <script src="http://js.arcgis.com/3.13/"></script>
   <script>
       require([

        "esri/map",
        "esri/dijit/Search",
        "dojo/domReady!"

      ], function (Map, Search) {
          var map = new Map("map", {
              basemap: "gray",
              center: [-120.435, 46.159], // lon, lat
              zoom: 7
          });

          var s = new Search({
              map: map
          }, "search");
          s.startup();

      });
   </script>
</head>

<body>
   <div id="search"></div>
   <div id="map"></div>
</body>

</html>

虽然形式千篇一律，但是对于初学者都是财富。

posted on 2015-03-16 16:42  教练！我想编程  阅读(447)  评论(0)  编辑  收藏  举报

导航