Cesium：加载百度地图
2024-05-29 04:02:24
效果
代码
<!DOCTYPE html>
<html lang="ch">
<head><meta charset="UTF-8"><title>Title</title><link rel="stylesheet" href="Cesium-1.66/Build/Cesium/Widgets/widgets.css"><style>#map3d {height: 600px;width: 1000px;margin: 0 auto;position: relative;}</style>
</head>
<body>
<div id="map3d">
</div>
</body>
<script src="Cesium-1.66/Build/Cesium/Cesium.js"></script>
<script src="jQuery.js"></script>
<script src="baidu.js"></script>
<script>viewer = new Cesium.Viewer('map3d', {selectionIndicator: false,animation: false,baseLayerPicker: false,timeline: false,sceneModePicker: true,navigationHelpButton: false,useDefaultRenderLoop: true,showRenderLoopErrors: true,fullscreenButton: false,infoBox: false,imageryProvider: new BaiduImageryProvider({url: "http://online{s}.map.bdimg.com/onlinelabel/?qt=tile&x={x}&y={y}&z={z}&styles=pl&scaler=1&p=1"})});viewer.camera.setView({destination: Cesium.Cartesian3.fromDegrees(116.46, 39.92, 10000000.0),}); // 设置初始位置// 分辨率调整函数let adjustmentPixel = function () {// 判断是否支持图像渲染像素化处理var supportsImageRenderingPixelated = viewer.cesiumWidget._supportsImageRenderingPixelated;if (supportsImageRenderingPixelated) {// 直接拿到设备的像素比例因子 - 如我设置的1.25var vtxf_dpr = window.devicePixelRatio;// 这个while我们在后面会做一个说明，但不是解决问题的说明while (vtxf_dpr >= 2.0) {vtxf_dpr /= 2.0;}// 设置渲染分辨率的比例因子viewer.resolutionScale = vtxf_dpr;}};adjustmentPixel();viewer.scene.postProcessStages.fxaa.enabled = false;//viewer.scene.globe.depthTestAgainstTerrain = true;viewer.scene.fxaa = false;let handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas);handler.setInputAction(function (event) {let earthPosition = viewer.camera.pickEllipsoid(event.position,viewer.scene.globe.ellipsoid);if (Cesium.defined(earthPosition)) {let ellipsoid = viewer.scene.globe.ellipsoid;let cartographic = ellipsoid.cartesianToCartographic(earthPosition);let lat = Cesium.Math.toDegrees(cartographic.latitude);let lon = Cesium.Math.toDegrees(cartographic.longitude);}}, Cesium.ScreenSpaceEventType.LEFT_CLICK);</script>
</html>
function BaiduImageryProvider(options) {this._errorEvent = new Cesium.Event();this._tileWidth = 256;this._tileHeight = 256;this._maximumLevel = 18;this._minimumLevel = 1;var southwestInMeters = new Cesium.Cartesian2(-33554054, -33746824);var northeastInMeters = new Cesium.Cartesian2(33554054, 33746824);this._tilingScheme = new Cesium.WebMercatorTilingScheme({rectangleSouthwestInMeters: southwestInMeters,rectangleNortheastInMeters: northeastInMeters});this._rectangle = this._tilingScheme.rectangle;var resource = Cesium.Resource.createIfNeeded(options.url);this._resource = resource;this._tileDiscardPolicy = undefined;this._credit = undefined;this._readyPromise = undefined;
}Cesium.defineProperties(BaiduImageryProvider.prototype, {url: {get: function () {return this._resource.url;}},proxy: {get: function () {return this._resource.proxy;}},tileWidth: {get: function () {if (!this.ready) {throw new Cesium.DeveloperError('tileWidth must not be called before the imagery provider is ready.');}return this._tileWidth;}},tileHeight: {get: function () {if (!this.ready) {throw new Cesium.DeveloperError('tileHeight must not be called before the imagery provider is ready.');}return this._tileHeight;}},maximumLevel: {get: function () {if (!this.ready) {throw new Cesium.DeveloperError('maximumLevel must not be called before the imagery provider is ready.');}return this._maximumLevel;}},minimumLevel: {get: function () {if (!this.ready) {throw new Cesium.DeveloperError('minimumLevel must not be called before the imagery provider is ready.');}return this._minimumLevel;}},tilingScheme: {get: function () {if (!this.ready) {throw new Cesium.DeveloperError('tilingScheme must not be called before the imagery provider is ready.');}return this._tilingScheme;}},tileDiscardPolicy: {get: function () {if (!this.ready) {throw new Cesium.DeveloperError('tileDiscardPolicy must not be called before the imagery provider is ready.');}return this._tileDiscardPolicy;}},rectangle: {get: function () {if (!this.ready) {throw new Cesium.DeveloperError('rectangle must not be called before the imagery provider is ready.');}return this._rectangle;}},errorEvent: {get: function () {return this._errorEvent;}},ready: {get: function () {return this._resource;}},readyPromise: {get: function () {return this._readyPromise;}},credit: {get: function () {if (!this.ready) {throw new Cesium.DeveloperError('credit must not be called before the imagery provider is ready.');}return this._credit;}},
});BaiduImageryProvider.prototype.requestImage = function (x, y, level, request) {var r = this._tilingScheme.getNumberOfXTilesAtLevel(level);var c = this._tilingScheme.getNumberOfYTilesAtLevel(level);var s = this.url.replace("{x}", x - r / 2).replace("{y}", c / 2 - y - 1).replace("{z}", level).replace("{s}", Math.floor(10 * Math.random()));return Cesium.ImageryProvider.loadImage(this, s);
};
Cesium：加载百度地图相关推荐
- leaflet、cesium加载百度地图，加载自定义样式百度地图
1 leaflet.cesium加载百度地图(官方预设样式) 预留,待补充 2 leaflet.cesium加载百度自定义样式地图 样式编辑器新版地址:http://lbsyun.baidu.com/ ...
- cesium加载百度地图_Cesium专栏-百度地图加载（附源码下载）
Cesium 是一款面向三维地球和地图的,世界级的JavaScript开源产品.它提供了基于JavaScript语言的开发包,方便用户快速搭建一款零插件的虚拟地球Web应用,并在性能,精度,渲染质量以 ...
- cesium加载百度地图_四大Webgis地图框架的对比选择
选择的方式主要是根据业务需求,主要分为: 传统GIS业务(Leaflet),三维业务(Cesium),互联网展示型(MapboxGL),老IE浏览器,老业务维护(OpenLayers). 1.Leaf ...
- Cesium加载离线地图和离线地形
文章目录 前言 一.Cesium加载离线地图 1.1 下载数据 2.2 数据处理 2.3 地图发布 2.4下载速度改进 二.Cesium加载离线地形 2.1 下载数据 2.2 数据处理 2.3 地形发 ...
- Cesium 加载离线地图服务
Cesium 可以加载自定义的地图服务,一般在私有云上应用比较广. 原始地图数据有很多地方都可以下载.比如常用的下载工具,付费的有水经注.91助手等,还有国家空间地理服务的官网上也有可用的数据.假设你 ...
- FGMap学习之--加载百度地图
今天我们用FGMap来加载百度地图数据. 从目前国内的地图服务商提供的地图来看,地图瓦片切图规则只少分为三种.其中Google Map.Bing地图.MapABC.QQ地图是一类,而百度地图.搜狗地图 ...
- Openlayers3 加载百度地图，天地图
2019独角兽企业重金招聘Python工程师标准>>> openlayers3 加载百度地图: var projection = ol.proj.get("EPSG:385 ...
- （转） Arcgis for js加载百度地图
http://blog.csdn.net/gisshixisheng/article/details/44853709 概述: 在前面的文章里提到了Arcgis for js加载天地图,在本节,继续讲 ...
- 【百度地图】——利用三级联动加载百度地图
[百度地图]--利用三级联动加载百度地图 HTML+CSS代码如下: <!DOCTYPE html> <html lang="en"><head> ...
- Leaflet加载百度地图
为了验证一下百度地图的影像.矢量.注记等瓦片数据是否是坐标统一的,写了一个简单的leaflet加载百度影像瓦片.矢量瓦片.注记瓦片的页面,叠加在一起,看了一下,果然坐标系是统一的. <!DOCT ...
最新文章
- 网站服务器的ip地址会变吗,网站的服务器变了 IP地址变吗
- find name 模糊匹配_Linux的文件搜索命令（locate ,find,grep，find命令和）
- 日期排序react_react+antd 步骤条改为时间顺序条
- Visual Studio 2017正式版发布全纪录
- 观峰雨个人空间 2010 STOCK ADVICE !
- Linux0.11 创建进程的过程分析--fork函数的使用
- 基于LBS的地理位置附近的搜索以及由近及远的排序
- bigint hive java类型_详解Apache Hudi如何配置各种类型分区
- C# 笔记2 - 数组、集合与与文本文件处理
- 试用期要盯紧你的“四金”
- LINUX SHELL判断文件、目录是否存在
- 数据挖掘概念与技术（原书第三版）范明 孟小峰译-----第二章课后习题答案
- 怎么用Canoe CAPL发送诊断
- 阿里云抢月饼代码实验，自己写着玩的
- 提供一个在Selenium截网页长图的实现
- CNCC技术论坛｜分布式数据库HTAP的探索与实践
- Newt Scamander的恐惧
- MLY -- 6.Your dev and test sets should come from the same distribution
- [R分析] 描述统计：频数和频率分布直方图
- 在 Create-React-App 中使用 TypeScript(汉化)