ArcGIS学习一 Create a map

最新推荐文章于 2022-05-20 17:09:21 发布

YYlxid

最新推荐文章于 2022-05-20 17:09:21 发布

阅读量970

点赞数

分类专栏： coding way ArcGIS学习文章标签： ArcGIS JS

本文链接：https://blog.csdn.net/YYlxid/article/details/48790403

版权

coding way 同时被 2 个专栏收录

167 篇文章 0 订阅

订阅专栏

ArcGIS学习

2 篇文章 0 订阅

订阅专栏

Description

创建一个Map对象，将其添加到对应的div上即可显示。

Code

创建地图对象

Center是页面显示的地图视野中心经纬度

Zoom 地图放大级别

Basemap是底图（可以使用arcgis的底图图库，也可以自定义）

<!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>Simple Map</title>
    <link rel="stylesheet" href="http://js.arcgis.com/3.14/esri/css/esri.css">
    <style>
      html, body, #map {
        height: 100%;
        width: 100%;
        margin: 0;
        padding: 0;
      }
      body {
        background-color: #FFF;
        overflow: hidden;
        font-family: "Trebuchet MS";
      }
    </style>
    <script src="http://js.arcgis.com/3.14/"></script>
<!--<script type="text/javascript" src="arcgis_js_v37_api/arcgis_js_api/library/3.7/jsapi/init.js"></script>-->
    <script>
      var map;

      require(["esri/map", "dojo/domReady!"], function(Map) {
        map = new Map("map", {
          basemap: "topo",  //For full list of pre-defined basemaps, navigate to http://arcg.is/1JVo6Wd
          center: [-122.45, 37.75], // longitude, latitude
          zoom: 13
        });
      });
    </script>
  </head>

  <body>
    <div id="map"></div>
  </body>
</html><strong>

</strong>

A basemap provides abackground of geographical context for the content you want to display in amap. When you create a new map, you can choose which basemap you want to use.You can change the basemap of the current map at any time by using the basemap galleryor using your own layer as the basemap.

basemap（底图）提供为地图中你想显示的内容提供一个地理环境的背景。

Streets街道地图

Satellite卫星地图

Hybrid混合地图

Topo拓扑地图

Gray灰色地图

Dark-gray深灰色地图

Oceans海洋地图

National-geographic国家地理地图

Terrain地形地图

OsmOpenStreetMap可供自由编辑的世界地图

导入自定义basemap

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<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>Simple Map</title>
    <link rel="stylesheet" href="arcgis_js_v37_api/arcgis_js_api/library/3.7/jsapi/js/esri/css/esri.css">
<!--     <style>
      html, body, #map {
        height: 100%;
        width: 100%;
        margin: 0;
        padding: 0;
      }
      body {
        background-color: #FFF;
        overflow: hidden;
        font-family: "Trebuchet MS";
      }
    </style> -->
    <!-- <script src="http://js.arcgis.com/3.14/"></script> -->
    <script type="text/javascript" src="arcgis_js_v37_api/arcgis_js_api/library/3.7/jsapi/init.js"></script>
    <script>
    dojo.require("esri.map");
    dojo.require("dojo.domReady!");
    dojo.require("esri.dijit.BasemapLayer");
    dojo.require("esri.dijit.Basemap"); 
   function init(){
    	var basemapChina=new esri.dijit.Basemap({
    		layers:[new esri.dijit.BasemapLayer({
    			url:"https://map.geoq.cn/ArcGIS/rest/services/ChinaOnlineCommunity/MapServer"
    		})],
    		title:"china map"
    	});
    	var map=new esri.Map("map",{
    	    center: [116.41667, 39.91667],
    	    zoom: 9,
    	    basemap: basemapChina
    	});
    }
    /*   require(["esri/map", "dojo/domReady!"], function(Map) { 
    	  var map = new Map("map", {
    	    center: [116.41667, 39.91667],
    	    zoom: 8,
    	    basemap: "oceans"
    	  });
    	});*/
    	dojo.ready(init);
    </script>
  </head>

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

YYlxid

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ArcGIS学习一 Create a map

Description创建一个Map对象，将其添加到对应的div上即可显示。Code创建地图对象Center是页面显示的地图视野中心经纬度Zoom 地图放大级别Basemap是底图（可以使用arcgis的底图图库，也可以自定义） Simple Map html, body, #map {
复制链接

扫一扫