zoukankan      html  css  js  c++  java
  • arcgis api for javascript 最基本的地图加载

    为大家贴贴最基本的地图加载:

    一. API 根据Dom树上节点的 ID 确定 Map 的显示位置;

    二. setBasemap 方法可得到一些ArcGIS制作好的底图,例如: "streets" , "satellite" , "hybrid", "topo", "gray", "oceans", "national-geographic", "osm";

    三. setEXtent 方法可设置地图的显示区域;

    <!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="utf-8">
            <title> Demo </title>
            <link rel="stylesheet" href="http://js.arcgis.com/3.10/js/esri/css/esri.css">
            <script type="text/javascript" src="http://js.arcgis.com/3.9/"></script>
            <style>
                html,body,#mapDiv
                {
                    width: 100%;
                    height: 100%;
                }
            </style>
            <script>
          require([
            "esri/map", 
            "esri/geometry/Extent"
          ], function(){
                  var map = new esri.Map("mapDiv");
                  map.setBasemap("osm");
                  var bounds = new esri.geometry.Extent({
                    "xmin":118.363523,"ymin":29.219302,"xmax":119.508848,"ymax":30.073848,
                    "spatialReference":{"wkid":4326}});
                  map.setExtent(bounds);
                  });
            </script>
        </head>
    <body>
            <div id="mapDiv"></div>
    </body>
    </html>

    补充:
      1.地图初始化时即可完成各种属性的设置,new Map(divId, options?);

         例如:var map = new Map(“mapDiv”,{ basemap: "osm" , extent: bounds});

      2.欲加载已发布的服务,只需新建图层并加入map 即可;

         例如: var layer = new esri.layers.ArcGISDynamicMapServiceLayer( url ); map.addLayer(layer);

    效果:

            

  • 相关阅读:
    Jeecg代码搬砖圣地第五篇(页面布局)
    Jeecg代码搬砖圣地第四篇(页面标签规则)
    Jeecg代码搬砖圣地第三篇(Excel导入导出)
    小程序前端
    javascript 新版本的语法(ECS6)
    nginx下用getallheaders
    wampser 配置debug需要的参数
    Suhosin(php的保护工具)
    php中empty使用的情况
    写出健壮的代码
  • 原文地址:https://www.cnblogs.com/qdhotel/p/3873417.html
Copyright © 2011-2022 走看看