cesium 自定义百度底图

最新推荐文章于 2024-05-14 10:49:40 发布
最新推荐文章于 2024-05-14 10:49:40 发布
阅读量642 收藏
点赞数 1
分类专栏： 百度 文章标签： 百度
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/henghahouhei/article/details/119909300
版权 
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>自定义地图</title>
    <link href="../Build/Cesium/Widgets/widgets.css" rel="stylesheet" />
    <script src="../Build/Cesium/Cesium.js"></script>
    <script src="../js/jquery.min.js"></script>
    <script src="../js/baidu.js"></script>
    <style>
        html, body, #cesiumContainer {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
            overflow: hidden;
        }
        .cesium-viewer-fullscreenContainer{
            display: none !important;
        }
    </style>
    <!--leaflet风格气泡窗口样式模板-->
    <style>
        .trackPopUp {
            display: none;
            color: #ffffff;
            position: absolute;
            top:5px;
            width: 330px;
            height: 250px;
            background-image: url(../img/infoBg.png) !important;
            background-size: 100% 100%;
            background-repeat: no-repeat;
        }
        .trackPopUp .popup-top{
            width: 100%;
            height: 35px;
            /*background: linear-gradient(to right bottom,#0e89d0,#3fbbe8);*/
            border-top-right-radius: 5px;
            border-top-left-radius: 5px;
        }
        .popup-top .top-title{
            line-height: 35px;
            margin-left: 5px;
            color: #333333;
            font-weight: bolder;
        }

        .popup-top .leaflet-popup-close-button {
            position: absolute;
            top: 0;
            right: 0;
            padding: 4px 4px 0 0;
            text-align: center;
            font: 25px/25px Tahoma, Verdana, sans-serif;
            color: #333333;
            text-decoration: none;
            font-weight: bolder;
            background: transparent;
        }

        .trackPopUp .popup-content{
            overflow-y: auto;
            height: auto;
            width: auto;
            min-width: 220px;
            border-bottom-left-radius: 5px;
            border-bottom-right-radius: 5px;
        }
        .popup-content .video-content {
            width: 100%;
            height: auto;

        }
        .videoBox{
            position: relative;
            top: 0;
            display: flex;
            justify-content: center;
            align-items: center;
        }
    </style>
</head>
<body>
<div id="cesiumContainer"></div>
<script>
    var viewer, scene;
    let params = {
        tx: 117.4525, //模型中心X轴坐标（经度，单位：十进制度）
        ty: 36.5253, //模型中心Y轴坐标（纬度，单位：十进制度）
        tz: 0, //模型中心Z轴坐标（高程，单位：米）
        rx: 0, //X轴（经度）方向旋转角度（单位：度）
        ry: 0, //Y轴（纬度）方向旋转角度（单位：度）
        rz: -1 //Z轴（高程）方向旋转角度（单位：度）
    };
    let gltfArr = [
        {   id : '001',
            name : '灯杆001',
            position:[117.4590, 36.5283],
            heading:-90,
            color:Cesium.Color.ROYALBLUE
        },{
            id : '002',
            name : '灯杆002',
            position:[117.4540, 36.5285],
            heading:160,
            color:Cesium.Color.ROYALBLUE
        },{
            id : '003',
            name : '灯杆003',
            position:[117.4490, 36.5226],
            heading:0,
            color:Cesium.Color.ROYALBLUE
        },{
            id : '004',
            name : '灯杆004',
            position:[117.4540, 36.5226],
            heading:-30,
            color:Cesium.Color.ROYALBLUE
        },{
            id : '005',
            name : '灯杆005',
            position:[117.4460, 36.5283],
            heading:90,
            color:Cesium.Color.ROYALBLUE
        },{
            id : '006',
            name : '灯杆006',
            position:[117.4580, 36.5230],
            heading:-30,
            color:Cesium.Color.ROYALBLUE
        }
    ];
    let popupArr = [
        {
            text:'博学楼',
            position:[117.452, 36.5245],
            height:85
        },
        {
            text:'实验楼',
            position:[117.452, 36.5270],
            height:85
        },
        {
            text:'声乐楼',
            position:[117.456, 36.5275],
            height:80
        },
        {
            text:'体育楼',
            position:[117.456, 36.5242],
            height:105
        }
    ];
    //设置初始范围
    var cartographic1 = [117.4500, 36.5080];//西南
    var cartographic2 = [117.4600, 36.5120];//东北
    //创建地图初始范围对象
    var initExtent = new Cesium.Rectangle(cartographic1[0], cartographic1[1], cartographic2[0], cartographic2[1]);
    var defaultResetView = Cesium.Rectangle.fromDegrees(initExtent.west, initExtent.south, initExtent.east,initExtent.north);
    /* 设置地图 */
    initMap();
    function initMap() {
        viewer = new Cesium.Viewer('cesiumContainer', {
            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",
                //自定义底图
                //可选值：dark,midnight,grayscale,hardedge,light,redalert,googlelite,grassgreen,pink,darkgreen,bluish
                url: "http://api{s}.map.bdimg.com/customimage/tile?&x={x}&y={y}&z={z}&scale=1&customid=darkgreen" ,
                //地形图
                //url: "http://shangetu{s}.map.bdimg.com/it/u=x={x};y={y};z={z};v=009;type=sate&fm=46" ,
                //实时路况
                //url:'http://its.map.baidu.com:8002/traffic/TrafficTileService?x={x}&y={y}&level={z}&time=20210825&label=web2D&v=017'
            }),
            homeButton: false, // 是否显示home控件
            vrButton: false,
            fullscreenButton: true,
            animation: true, // 是否显示动画控件
            geocoder: false, // 是否显示地名查找控件
            timeline: true, // 是否显示时间线控件
            sceneModePicker: false, // 是否显示投影方式控件
            navigationHelpButton: false, // 是否显示帮助信息控件
            infoBox: false, // 是否显示点击要素之后显示的信息
            baseLayerPicker: false, // 是否显示图层选择控件
            selectionIndicator: true, // Disable selection indicator
            shouldAnimate: true
            // requestRenderMode: true
        });
        // 不显示三维信息
        viewer._cesiumWidget._creditContainer.style.display = 'none'
        viewer.animation.container.style.visibility = 'hidden'; // 不显示动画控件
        viewer.timeline.container.style.visibility = 'hidden'; // 不显示时间控件
        scene = viewer.scene;

        //viewer.scene.screenSpaceCameraController.maximumZoomDistance = 1400;

        scene.screenSpaceCameraController.enableRotate = true;
        scene.screenSpaceCameraController.enableTranslate = true;
        scene.screenSpaceCameraController.enableZoom = true;
        scene.screenSpaceCameraController.enableTilt = true;
        initWork();
    }
    /*添加模型*/
    function initWork() {
        var palaceTileset = new Cesium.Cesium3DTileset({
            url: '../modelData/guangda/tileset.json',
            maximumScreenSpaceError: 16,//默认16,最大屏幕空间错误
            maximumNumberOfLoadedTiles: 1000,
            maximumMemoryUsage: 4096//默认512,内存MB的最大数量
        });
        palaceTileset.readyPromise.then(function (palaceTileset) {
            //添加到场景
            viewer.scene.primitives.add(palaceTileset);
            palaceTileset._root.transform = update3dtilesMaxtrix(params);
            //viewer.zoomTo(palaceTileset);
            viewer.camera.flyTo({
                destination:Cesium.Rectangle.fromDegrees(initExtent.west, initExtent.south, initExtent.east,initExtent.north),
                duration:0.1,
                orientation: {
                    heading: Cesium.Math.toRadians(0),//东西朝向
                    pitch: Cesium.Math.toRadians(-25.5),//角度
                    roll:0.0//左右朝向
                },
                easingFunction: Cesium.EasingFunction.LINEAR_NONE

            });
            dengGan();
            popup();
        });
    }
    /*放置灯杆*/
    function dengGan() {
        var gltfUrl = "../gltf/dengGan/scene.gltf";
        for(var dg=0;dg<gltfArr.length;dg++){
            var position = Cesium.Cartesian3.fromDegrees(gltfArr[dg].position[0], gltfArr[dg].position[1]);
            var heading = Cesium.Math.toRadians(gltfArr[dg].heading);
            var hpr = new Cesium.HeadingPitchRoll(heading, 0, 0);
            var orientation = Cesium.Transforms.headingPitchRollQuaternion(position, hpr);
            var entity = viewer.entities.add({
                id : gltfArr[dg].id,
                name : gltfArr[dg].name,
                position : position,
                orientation:orientation,
                model : {
                    uri : gltfUrl,
                    scale: 0.02,
                    minimumPixelSize : 120, //最小可视化比例
                    maximumScale : 500,    //最大可视化比例
                    color:gltfArr[dg].color,
                    heightReference: Cesium.HeightReference.RELATIVE_TO_GROUND
                },
            });
        }
        creatHandler()
    }
    /*显示气泡*/
    function popup() {
        var pinBuilder = new Cesium.PinBuilder();
        for(var i=0;i<popupArr.length; i++){
            viewer.entities.add({
                name: "popup",
                position: Cesium.Cartesian3.fromDegrees(popupArr[i].position[0],popupArr[i].position[1],popupArr[i].height),
                billboard: {
                    image:pinBuilder.fromText(popupArr[i].text,Cesium.Color.ROYALBLUE, 100).toDataURL(),
                    verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
                },
            });
        }
    }
    //点击事件
    function creatHandler() {
        var handler3D = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas)
        var scene = viewer.scene;
        var infoDiv = '<div id="trackPopUp" class="trackPopUp">' +
            '<div class="popup-top"><div class="top-title">灯杆视频</div><a class="leaflet-popup-close-button" href="#">×</a></div>' +
            '<div class="popup-content">' +
            '<div id="trackPopUpLink" class="video-content"></div>' +
            '</div>' +
            '</div>';
        $("#cesiumContainer").append(infoDiv);
        //绑定鼠标点击
        handler3D.setInputAction(function (movement) {
            var pick = scene.pick(movement.position); //判断是否拾取到模型
            if (scene.pickPositionSupported && Cesium.defined(pick)) {
                var cartesian = viewer.scene.pickPosition(movement.position);
                var cartographic = Cesium.Cartographic.fromCartesian(cartesian); //根据笛卡尔坐标获取到弧度
                var lng = Cesium.Math.toDegrees(cartographic.longitude).toFixed(3); //根据弧度获取到经度
                var lat = Cesium.Math.toDegrees(cartographic.latitude).toFixed(4); //根据弧度获取到纬度
                console.log(lng,lat)
                var height = cartographic.height;//模型高度
                for(var dg=0;dg<gltfArr.length;dg++){
                    console.log(gltfArr[dg].position[0],gltfArr[dg].position[1])
                    if(lng == gltfArr[dg].position[0] && lat == gltfArr[dg].position[1] || lng+0.001 == gltfArr[dg].position[0] && lat+0.0001 == gltfArr[dg].position[1] || lng-0.001 == gltfArr[dg].position[0] && lat-0.0001 == gltfArr[dg].position[1]){
                        //$('#trackPopUp').show();
                        var content = ' <div class="videoBox"><video src="../img/fullView.mp4" width="320" height="200"  controls autoplay>\n' +
                            '</video></div></div>';
                        var obj = { position: movement.position, content: content };
                        //videoWindow(obj);
                    }
                }

            }
            else {
                $('#trackPopUp').hide();
            }

        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);

    }
    //视频弹窗
    function videoWindow(obj) {
        var picked = scene.pick(obj.position);
        if (Cesium.defined(picked)) {
            $(".cesium-selection-wrapper").show();
            $('#trackPopUpLink').empty();
            $('#trackPopUpLink').append(obj.content);
            var c = new Cesium.Cartesian2(obj.position.x, obj.position.y);
            $('#trackPopUp').show();
            positionPopUp(c); // Initial position
            $('.leaflet-popup-close-button').click(function () {
                $('#trackPopUp').hide();
                $('#trackPopUpLink').empty();
                $(".cesium-selection-wrapper").hide();
                return false;
            });

        }
    }
    //弹窗定位
    function positionPopUp(c) {
        var x = c.x - ($('#trackPopUp').width()) / 2;
        var y = c.y - 100;
        $('#trackPopUp').css('transform', 'translate3d(' + x + 'px, ' + y + 'px, 0)');
    }
    //模型缩放
    function update3dtilesMaxtrix(params) {
        //旋转
        let mx = Cesium.Matrix3.fromRotationX(Cesium.Math.toRadians(params.rx));
        let my = Cesium.Matrix3.fromRotationY(Cesium.Math.toRadians(params.ry));
        let mz = Cesium.Matrix3.fromRotationZ(Cesium.Math.toRadians(params.rz));
        let rotationX = Cesium.Matrix4.fromRotationTranslation(mx);
        let rotationY = Cesium.Matrix4.fromRotationTranslation(my);
        let rotationZ = Cesium.Matrix4.fromRotationTranslation(mz);
        //平移
        let position = Cesium.Cartesian3.fromDegrees(params.tx, params.ty, params.tz);
        let m = Cesium.Transforms.eastNorthUpToFixedFrame(position);

        let scale = Cesium.Matrix4.fromUniformScale(4.0);
        // //缩放
        Cesium.Matrix4.multiply(m, scale, m);
        //旋转、平移矩阵相乘
        Cesium.Matrix4.multiply(m, rotationX, m);
        Cesium.Matrix4.multiply(m, rotationY, m);
        Cesium.Matrix4.multiply(m, rotationZ, m);
        //赋值给tileset
        return m;
    }
</script>
</body>
</html>

baudu.js

BaiduImageryProvider = function(options) {
    this._errorEvent = new Cesium.Event();
    this._tileWidth = 256;
    this._tileHeight = 256;
    this._maximumLevel = 18;
    this._minimumLevel = 1;
    let southwestInMeters = new Cesium.Cartesian2(-33554054, -33746824);
    let northeastInMeters = new Cesium.Cartesian2(33554054, 33746824);
    this._tilingScheme = new Cesium.WebMercatorTilingScheme({
        rectangleSouthwestInMeters: southwestInMeters,
        rectangleNortheastInMeters: northeastInMeters
    });
    this._rectangle = this._tilingScheme.rectangle;
    this._resource = Cesium.Resource.createIfNeeded(options.url);
    this._tileDiscardPolicy = undefined;
    this._credit = undefined;
    this._readyPromise = undefined;
};

Object.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) {
    let xTileCount = this._tilingScheme.getNumberOfXTilesAtLevel(level);
    let yTileCount = this._tilingScheme.getNumberOfYTilesAtLevel(level);
    let url = this.url
        .replace("{x}", x - xTileCount / 2)
        .replace("{y}", yTileCount / 2 - y - 1)
        .replace("{z}", level)
        .replace("{s}", Math.floor(10 * Math.random()));
    //console.log("zxy:" + level + ", " + x + ", " + y + "; " + url);
    return Cesium.ImageryProvider.loadImage(this, url);
};

是可爱的大福呀~
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
2.（cesium篇）cesium接入百度地图
地图之家
05-20 8965
2.（cesium篇）cesium接入百度地图
cesium加载百度地图
05-20
cesium加载百度地图方法
Cesium中高德、百度地图的偏移矫正
最新发布
qq_52114674的博客
05-14 743
实现Cesium中高德、百度地图坐标的转换
leaflet、cesium加载百度地图，加载自定义样式百度地图
qq_27816785的博客
12-09 3384
1 leaflet加载百度预设地图 2 leaflet加载百度自定义样式地图 旧版地址：https://developer.baidu.com/map/custom/ 旧版的样式编辑器，使用起来没有新版方便。但是我们可以在leaflet中使用，还要啥自行车！使用方式如下： 1. 页面下方，是图层样式编辑区。可以对各种图层进行样式的重新调整； 2. 样式调整完毕后，F12打开浏览器开发者工具（如图），查看当前请求的瓦片链接； 3. 复制瓦片请求连接中的styles对应的参数..
Cesium+百度街景浏览
Tonque的博客
01-27 2842
1.首先是逻辑思路 2.百度街景API 注册申请成为百度开放平台开发者：开发者网址 申请秘钥 进入示例中心，选择需要的demo：选择需要的Demo 最后需要的代码块： 引用的js脚本文件 <script type="text/javascript" src="//api.map.baidu.com/api?v=3.0&ak=你的秘钥"></script> 需要加入的元素 <div id="panorama"></div> 需要些的脚本
Cesium添加百度地图
zy332719794的专栏
04-08 6585
百度地图的瓦块切片与大多数地图不同，其中心点位于地理坐标的0,0点，多数地图的切片是以地图左上角为瓦块切片的起点。Cesium中默认的切片地图（UrlTemplateImageryProvider）包括经纬度模式和投影（墨卡托）模式都是以左上角切片为基准。所以当我们加载百度地图瓦块地图时，需要自定义地图影像地图类。 BaiduImageryProvider = function(options) { this._errorEvent = new Cesium.Event(); this.
cesium使用环境搭建--vue中安装并引用百度地图
weixin_43989837的博客
02-22 760
1，安装，安装1.60版本最好，1.40版本兼容百度地图有问题 npm install cesium@1.60 --save 2.配置文件，在config.vue.js中配置 -----plugins const path = require('path');//引入path模块 const CopyWebpackPlugin = require('copy-webpack-plugin');//引入path模块 const webpack = require("webpack"); functio
百度、高德、腾讯、天地图、谷歌、必应等地图切图工具 MapCutter 3.8.0
12-21
百度、高德、腾讯、天地图、谷歌、必应等自定义地图/图片叠加层/瓦片图/金字塔图地图切图高清切片生成工具 MapCutter（旧名MapTiler） ，定位便捷，支持超大地图，支持leaflet、maptalks、openlayers、cesium、及...
百度、高德、腾讯、天地图、谷歌、必应、MapBox等地图金字塔切图工具 MapCutter 3.9.8
09-26
百度、高德、腾讯、天地图、谷歌、必应等自定义地图/图片叠加层/瓦片图/金字塔图地图切图高清切片生成工具 MapCutter（旧名MapTiler） ，定位便捷，支持超大地图，支持leaflet、maptalks、openlayers、cesium、及...
百度、高德、腾讯、天地图、谷歌、必应、MapBox等地图金字塔切图工具 MapCutter 3.9.1
06-03
百度、高德、腾讯、天地图、谷歌、必应等自定义地图/图片叠加层/瓦片图/金字塔图地图切图高清切片生成工具 MapCutter（旧名MapTiler） ，定位便捷，支持超大地图，支持leaflet、maptalks、openlayers、cesium、及...
BaiduDemo-一个不错的例子，用于展示自定义气泡view自动调增大小
02-27
BaiduDemo-一个不错的例子，用于展示自定义气泡view自动调增大小
Cesium支持加载百度地图源码可直接使用
04-13
很多小伙伴想要在Cesium里增加百度地图，现在源代码整理好了，需要的可以下载了，具体有什么问题可以私信我
【Cesium】加载互联网地图服务——天地图
心生的小鱼专栏
11-30 1196
1，地图瓦片获取地址 http://t0.tianditu.gov.cn/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={x}&TILECOL={y}&tk=%E6%82%A8%E7%9A%84%E5%AF%86%E
Cesium 与百度全景API联动
qq_40288344的博客
11-13 1792
不介绍百度API了，自行百度 创建全景图对象panorama 获取全景图的视角和位置，调整Cesium相机视角 let m = bdto84([panorama.getPosition().lng, panorama.getPosition().lat]); viewer.camera.setView({ destination: new Cesium.Cartesian3....
Cesium加载各种互联网地图（一）
热门推荐
u011365716的博客
12-03 3万+
1、ArcGIS在线影像底图（因为ArcGIS在线影像底图没有注记，所以用web墨卡托的天地图注记图层作为它的注记图层） viewer = new Cesium.Viewer("cesiumContainer", { animation: false, //是否显示动画控件 baseLayerPicker: false, //是否显示图层选择控件...
cesium功能封装之街景图
shenwuyuexy的博客
08-24 1304
街景图 项目里需要实现一个功能，点击entity弹出对应街景图。整个实现思路见本系列cesium气泡。只是把表格信息换成了街景图。 使用的标签： <iframe style="width:400px;height:300px;border:1px solid #1b1919;border-radius:5px;" v-show="streetViewShow" id="streetViewFrame"
3.（cesium篇）cesium接入高德、osm、谷歌、arcgis、mapbox地图
地图之家
05-21 7772
3.（cesium篇）cesium接入高德、osm、谷歌、arcgis、mapbox地图
如何利用Cesium制作互联网地图？
gis_witch的博客
01-28 1408
本文主要展示在cesium中如何利用百度地图制作互联网地图，并实现不同模式的切换，如矢量地图和影像地图等。
Cesium加载各种互联网地图
一碗老面的博客
08-11 1474
//初始化 varimageryLayers=viewer.imageryLayers; 1.UrlTemplateImageryProvider 支持加载天地图，google，高德地图等 var_TileLayer=newCesium.UrlTemplateImageryProvider({ url:option.url }); imageryLayers.addImageryProvider(_TileLayer...
cesium自定义材质
05-23
Cesium是一个很强大的地球可视化引擎，支持自定义材质。下面是一个简单的例子，展示如何创建一个自定义的材质： ```javascript //创建一个新材质 var customMaterial = new Cesium.Material({ fabric : { type : 'Color', uniforms : { color : new Cesium.Color(1.0, 1.0, 0.0, 1.0) } } }); //将自定义材质应用到实体上 var entity = viewer.entities.add({ position : Cesium.Cartesian3.fromDegrees(-75.59777, 40.03883), ellipsoid : { radii : new Cesium.Cartesian3(500000.0, 500000.0, 1000000.0), material : customMaterial } }); ``` 在这个例子中，我们首先创建了一个名为`customMaterial`的自定义材质。然后，我们将这个材质应用到一个实体上，该实体位于经度为-75.59777度，纬度为40.03883度的位置，具有椭球体形状，并且半径分别为500000米、500000米和1000000米。最后，我们将自定义材质设置为实体的材质。 您可以根据自己的需求更改自定义材质的属性，例如颜色、透明度、纹理等。更多关于Cesium自定义材质的信息可以在[Cesium官方文档](https://cesium.com/docs/tutorials/materials/)中找到。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值