• 我的第一个arcgis地图应用


    步骤:

    1、设置一个基本的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></title>
      </head>
    </html>
    

    2、引入arcgis相关的script和css样式,在<head></head>标签中引入以下脚本

    <link rel="stylesheet" href="https://js.arcgis.com/3.27/esri/css/esri.css">
    <script src="https://js.arcgis.com/3.27/"></script>
    

    3、arcgis API的模块引用,使用<script>从API加载特定的模块。不需要让这个脚本标记引用URL,而是直接在其中添加JavaScript代码。

    <script>
      require(["esri/map"], function(Map) { ... });
    </script>

    4、确保DOM代码可用,使用dojo / domReady! 在执行任何代码之前确保DOM可用。 一旦DOM可用,传递给require()的函数就会运行。 该函数中的代码将创建地图并添加底图。 底图图层是ArcGIS.com提供的服务 

    <script>
      require(["esri/map", "dojo/domReady!"], function(Map) {
        // code to create the map and add a basemap will go here
      });
    </script>

    5、创建地图,使用Map创建新地图,Map是对从esri / map模块加载的Map类的引用。

    var map;
    require(["esri/map", "dojo/domReady!"], function(Map) {
      map = new Map("map", {
        basemap: "topo",
        center: [-122.45, 37.75],
        zoom: 13
      });
    });

    6、页面内容定义,现在创建映射的JavaScript已经就绪,下一步是添加相关的HTML

    <body class="claro">
      <div id="map"></div>
    </body>

    7、css控制

    <style>
      html, body, #map {
        height: 100%;
        padding: 0;
        margin: 0;
      }
    </style>

    8、完整代码实例:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>创建第一个地图服务</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <link rel="stylesheet" type="text/css" href="https://js.arcgis.com/3.27/esri/css/esri.css">
        <style>
            html,body,#mapId{padding:0;margin:0;height:100%;}
        </style>
    </head>
    <body  class="claro">
    <div id="mapId"></div>
    <script src="https://js.arcgis.com/3.27/"></script>
    <script>
         require(["esri/map", "dojo/domReady!"], function (Map) {
             var map = Map("mapId",{
                 basemap: "topo",
                 center: [-122.45, 37.75],
                 zoom: 13
             })
         })
    </script>
    </body>
    </html>

      

  • 相关阅读:
    Linux 文件系统
    Hadoop、HBase、Hive、Spark
    Linux 虚拟内存机制和内存映射(mmap)
    geotools:GTRenderer to draw maps
    An Open Source Software Suite for MultiDimensional Meteorological Data Computation and Visualisation用于多维气象数据计算和可视化的开源软件套件
    idea:no artifacts marked for deployment
    jts教程:Geometry包
    Geotools之StreamingRenderer&ReferencedEnvelope
    GeoServer之tiger roads数据集
    idea:no main class specified
  • 原文地址:https://www.cnblogs.com/luoxuemei/p/10269408.html
Copyright © 2020-2023  润新知