cesium加载OSM在线地图

文章目录

1.实现效果
2.实现方法
- 2.1官方文档
- 2.2代码调用
- 2.3OSM在线地图风格

Cesium实战系列文章总目录：传送门

1.实现效果

2.实现方法

2.1官方文档

Cesium官方虽然没有提供直接加载OSM在线地图的方式，但是可以通过UrlTemplateImageryProvider接口加载。

官方API地址：传送门

2.2代码调用

Cesium调用OSM标准风格在线地图的代码如下：

// 加载OSM在线地图（标准风格）
this.viewer.imageryLayers.addImageryProvider(new Cesium.UrlTemplateImageryProvider({url: 'https://tile-{s}.openstreetmap.fr/hot/{z}/{x}/{y}.png',subdomains: ["a", "b", "c", "d"],})
);

2.3OSM在线地图风格

其他OSM在线地图的风格大家可以在OSM官网上自行探索。
OSM官网：传送门

这里以加载黑色风格为例。

 // 加载OSM在线地图（黑色风格）this.viewer.imageryLayers.addImageryProvider(new Cesium.UrlTemplateImageryProvider({url: "https://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png",subdomains: ["a", "b", "c", "d"],}));

效果截图：

cesium加载OSM在线地图相关推荐

Vue+OpenLayers入门（加载高德在线地图）
开发环境的搭建在上一篇教程中已有描述,如果不知道怎么搭建,请移步Vue+OpenLayers入门(加载OSM在线地图) 此代码为加载高德在线地图以及清除地图上的默认控件: <template&g ...
leaflet-webpack 入门开发系列二加载不同在线地图切换显示（附源码下载）
前言 leaflet-webpack 入门开发系列环境知识点了解: node 安装包下载 webpack 打包管理工具需要依赖 node 环境,所以 node 安装包必须安装,上面链接是官网下载地址 ...
星图地球数据云，便捷加载各类在线地图服务的又一神器
星图地球目前发布了一系列的产品,对我来说比较感兴趣的是星图地球数据云(GEOVIS Earth Datacloud)这款地球大数据产品.今天,我就带大家以来深入在线体验一下这款产品. 01 在线体验 ...
Vue+Leaflet实现加载OSM显示地图
场景 Leaflet快速入门与加载OSM显示地图: Leaflet快速入门与加载OSM显示地图_BADAO_LIUMANG_QIZHI的博客-CSDN博客如果是在Vue中怎样实现. 注: 博客: B ...
ArcGIS Javascript API 加载高德在线地图扩展
利用ArcGIS JavaScript API加载高德在线地图的扩展 /*** Created by WanderGIS on 2015/7/15.*/ define(["dojo/_bas ...
Dazdata BI加载百度在线地图并标注
Dazdata BI除了内置了全国瓦片地图,支持自定义园区瓦片地图等功能外,还支持加载百度在线地图,并方便的进行标注. 下面以全国空气污染前十城市标注为例,看如何实现: 首先要去百度地图开放平台,注册 ...
cesium加载自定义mapbox地图
cesium加载自定义mapbox地图自定义mapbox地图可以使用mapbox studio来自定义地图样式 mapbox-studio官网首页使用模版创建地图自定义地图,然后发布使用自 ...
Leaflet快速入门与加载OSM显示地图
场景 Leaflet Leaflet 是一个为建设交互性好适用于移动设备地图,而开发的现代的.开源的 JavaScript 库. 代码仅有几十KB,但它具有开发在线地图的大部分功能.Leaflet设计 ...
cesium加载arcgis server地图服务
1.制作arcgis server服务从bigmap中下载了全球1-8级 arcgis 瓦片,配置arcgis地图服务,并发布服务 http://www.bigemap.com/helps/doc2 ...
qml加载高德在线地图
Qml加载在线高德地图 1:上高德地图开发平台注册开发者账号,并申请key: https://lbs.amap.com/api/javascript-api/guide/abc/prepare 2:准 ...

cesium加载OSM在线地图

文章目录

1.实现效果

2.实现方法

2.1官方文档

2.2代码调用

2.3OSM在线地图风格

cesium加载OSM在线地图相关推荐

最新文章

热门文章