• 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%;  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=" 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%;
              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>

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

  • 相关阅读:
    podium服务器端的微前端开发框架
    几个java proxy servlet 工具
    Presto Infrastructure at Lyft
    cube.js 通过presto-gateway 进行连接
    presto-gateway nodejs client
    presto-gateway 试用以及docker 镜像制作
    presto-gateway lyft 团队开源的prestodb 的负载均衡、代理、网关工具
    Singer 修改tap-s3-csv 支持minio 连接
    plotly-dash 简单使用(一)
    smashing 三方widgets 使用
  • 原文地址:https://www.cnblogs.com/whyareyousocool/p/4342216.html
Copyright © 2020-2023  润新知