arcgis javascript api4.x加载天地图web墨卡托(wkid:3857)坐标系

2024-01-14 17:36

本文主要是介绍arcgis javascript api4.x加载天地图web墨卡托(wkid:3857)坐标系,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

效果:

示例代码:

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>加载天地图</title><linkrel="stylesheet"href="https://js.arcgis.com/4.27/esri/themes/light/main.css"/><script src="https://js.arcgis.com/4.27/"></script><style>html,body,#viewDiv {padding: 0;margin: 0;height: 100%;width: 100%;}</style><script>require(["esri/Map","esri/views/MapView","esri/layers/WebTileLayer","esri/layers/support/TileInfo","esri/Basemap",], function (Map, MapView, WebTileLayer, TileInfo,Basemap) {let tileInfo = new TileInfo({rows: 256,cols: 256,dpi: 96,origin: {"x": -20037508.342787,"y": 20037508.342787},spatialReference: {"wkid": 102100,"latestWkid": 3857},lods: [{"level": 0,"resolution": 156543.03392800014,"scale": 591657527.591555},{"level": 1,"resolution": 78271.51696399994,"scale": 295828763.795777},{"level": 2,"resolution": 39135.75848200009,"scale": 147914381.897889},{"level": 3,"resolution": 19567.87924099992,"scale": 73957190.948944},{"level": 4,"resolution": 9783.93962049996,"scale": 36978595.474472},{"level": 5,"resolution": 4891.96981024998,"scale": 18489297.737236},{"level": 6,"resolution": 2445.98490512499,"scale": 9244648.868618},{"level": 7,"resolution": 1222.992452562495,"scale": 4622324.434309},{"level": 8,"resolution": 611.4962262813797,"scale": 2311162.217155},{"level": 9,"resolution": 305.74811314055756,"scale": 1155581.108577},{"level": 10,"resolution": 152.87405657041106,"scale": 577790.554289},{"level": 11,"resolution": 76.43702828507324,"scale": 288895.277144},{"level": 12,"resolution": 38.21851414253662,"scale": 144447.638572},{"level": 13,"resolution": 19.10925707126831,"scale": 72223.819286},{"level": 14,"resolution": 9.554628535634155,"scale": 36111.909643},{"level": 15,"resolution": 4.77731426794937,"scale": 18055.954822},{"level": 16,"resolution": 2.388657133974685,"scale": 9027.977411},{"level": 17,"resolution": 1.1943285668550503,"scale": 4513.988705},{"level": 18,"resolution": 0.5971642835598172,"scale": 2256.994353}]});/*天地图-矢量(球面墨卡托)*/var vec_tiandituLayer = new WebTileLayer("http://{subDomain}.tianditu.gov.cn/vec_w/wmts?SERVICE=WMTS&VERSION=1.0.0&REQUEST=GetTile&LAYER=vec&STYLE=default&FORMAT=tiles&TILEMATRIXSET=w&TILEMATRIX={level}&TILEROW={row}&TILECOL={col}&tk=ac0daf56728bbb77d9514ba3df69bcd3", {subDomains: ["t0","t1","t2","t3","t4","t5","t6","t7"],title: "天地图-矢量",tileInfo: tileInfo});var cva_tiandituLayer = new WebTileLayer("http://{subDomain}.tianditu.gov.cn/cva_w/wmts?SERVICE=WMTS&VERSION=1.0.0&REQUEST=GetTile&LAYER=cva&STYLE=default&FORMAT=tiles&TILEMATRIXSET=w&TILEMATRIX={level}&TILEROW={row}&TILECOL={col}&tk=ac0daf56728bbb77d9514ba3df69bcd3", {subDomains: ["t0","t1","t2","t3","t4","t5","t6","t7"],title: "天地图-矢量注记",tileInfo: tileInfo});var vec_basemap = new Basemap({baseLayers: [vec_tiandituLayer],referenceLayers: [cva_tiandituLayer],thumbnailUrl:"https://www.arcgis.com/sharing/rest/content/items/0fa6d020c45342eabd89954344a739ba/info/thumbnail/thumbnail1629181199303.png",title: "天地图-矢量(球面墨卡托)"});var map = new Map({basemap: vec_basemap});var view = new MapView({container: "viewDiv",map: map,});})</script>
</head><body><div id="viewDiv"></div>
</body></html></html>

这篇关于arcgis javascript api4.x加载天地图web墨卡托(wkid:3857)坐标系的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/605966

相关文章

JSON字符串转成java的Map对象详细步骤

《JSON字符串转成java的Map对象详细步骤》:本文主要介绍如何将JSON字符串转换为Java对象的步骤,包括定义Element类、使用Jackson库解析JSON和添加依赖,文中通过代码介绍... 目录步骤 1: 定义 Element 类步骤 2: 使用 Jackson 库解析 jsON步骤 3: 添

Java中注解与元数据示例详解

《Java中注解与元数据示例详解》Java注解和元数据是编程中重要的概念,用于描述程序元素的属性和用途,:本文主要介绍Java中注解与元数据的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参... 目录一、引言二、元数据的概念2.1 定义2.2 作用三、Java 注解的基础3.1 注解的定义3.2 内

Java中使用Java Mail实现邮件服务功能示例

《Java中使用JavaMail实现邮件服务功能示例》:本文主要介绍Java中使用JavaMail实现邮件服务功能的相关资料,文章还提供了一个发送邮件的示例代码,包括创建参数类、邮件类和执行结... 目录前言一、历史背景二编程、pom依赖三、API说明(一)Session (会话)(二)Message编程客

Java中List转Map的几种具体实现方式和特点

《Java中List转Map的几种具体实现方式和特点》:本文主要介绍几种常用的List转Map的方式,包括使用for循环遍历、Java8StreamAPI、ApacheCommonsCollect... 目录前言1、使用for循环遍历:2、Java8 Stream API:3、Apache Commons

JavaScript中的isTrusted属性及其应用场景详解

《JavaScript中的isTrusted属性及其应用场景详解》在现代Web开发中,JavaScript是构建交互式应用的核心语言,随着前端技术的不断发展,开发者需要处理越来越多的复杂场景,例如事件... 目录引言一、问题背景二、isTrusted 属性的来源与作用1. isTrusted 的定义2. 为

Java循环创建对象内存溢出的解决方法

《Java循环创建对象内存溢出的解决方法》在Java中,如果在循环中不当地创建大量对象而不及时释放内存,很容易导致内存溢出(OutOfMemoryError),所以本文给大家介绍了Java循环创建对象... 目录问题1. 解决方案2. 示例代码2.1 原始版本(可能导致内存溢出)2.2 修改后的版本问题在

Java CompletableFuture如何实现超时功能

《JavaCompletableFuture如何实现超时功能》:本文主要介绍实现超时功能的基本思路以及CompletableFuture(之后简称CF)是如何通过代码实现超时功能的,需要的... 目录基本思路CompletableFuture 的实现1. 基本实现流程2. 静态条件分析3. 内存泄露 bug

Java中Object类的常用方法小结

《Java中Object类的常用方法小结》JavaObject类是所有类的父类,位于java.lang包中,本文为大家整理了一些Object类的常用方法,感兴趣的小伙伴可以跟随小编一起学习一下... 目录1. public boolean equals(Object obj)2. public int ha

SpringBoot项目中Maven剔除无用Jar引用的最佳实践

《SpringBoot项目中Maven剔除无用Jar引用的最佳实践》在SpringBoot项目开发中,Maven是最常用的构建工具之一,通过Maven,我们可以轻松地管理项目所需的依赖,而,... 目录1、引言2、Maven 依赖管理的基础概念2.1 什么是 Maven 依赖2.2 Maven 的依赖传递机

SpringBoot实现动态插拔的AOP的完整案例

《SpringBoot实现动态插拔的AOP的完整案例》在现代软件开发中,面向切面编程(AOP)是一种非常重要的技术,能够有效实现日志记录、安全控制、性能监控等横切关注点的分离,在传统的AOP实现中,切... 目录引言一、AOP 概述1.1 什么是 AOP1.2 AOP 的典型应用场景1.3 为什么需要动态插