cesium 使用supercluster.js插件实现聚合功能

本文介绍了如何在Cesium地图中集成supercluster.js脚本,实现POI数据的智能聚合和根据不同类型展示不同的图标,展示了地图可视化和地理信息系统在实际项目中的应用。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

引入supercluster.js脚本

 <script id="cesium_sandcastle_script">

    function startup(Cesium) {

      'use strict';

      //Sandcastle_Begin

      //设置主视角,默认进入时视角范围

      SetHoumeViewerjd(118.25669445145353, 21.58050898317632, 123.91666536429605, 25.77861604625837);

 //创建cesium地球

      var viewer = new Cesium.Viewer("cesiumContainer", {

        selectionIndicator: true,

        infoBox: true,

        //需要进行可视化的数据源的集合

        animation: true, //是否显示动画控件

        shouldAnimate: true,

        homeButton: true, //是否显示Home按钮

        fullscreenButton: true, //是否显示全屏按钮

        baseLayerPicker: true, //是否显示图层选择控件

        geocoder: false, //是否显示地名查找控件

        timeline: true, //是否显示时间线控件

        sceneModePicker: true, //是否显示投影方式控件

        navigationHelpButton: true, //是否显示帮助信息控件

        requestRenderMode: true, //启用请求渲染模式

        scene3DOnly: false, //每个几何实例将只能以3D渲染以节省GPU内存

        sceneMode: 3, //初始场景模式 1 2D模式 2 2D循环模式 3 3D模式  Cesium.SceneMode

        //加载天地图影像地图,WebMapTileServiceImageryProvider该接口是加载WMTS服务的接口

        //tileset添加地形,本地地址

        imageryProvider: new Cesium.TileMapServiceImageryProvider({

          url: 'http://192.168.2.27:8080' + '/TMS/',

          fileExtension: 'jpg',

          layer: 'img',

          style: 'default',

          tileMatrixSetID: 'w',

          format: 'tiles',

          maximumLevel: 20,

          name: "main"

        }),

      });

      //去掉版权信息

      viewer._cesiumWidget._creditContainer.style.display = "none";

      //光照

      viewer.scene.globe.enableLighting = false;

      //地形深度

      viewer.scene.globe.depthTestAgainstTerrain = false;


      var level;//当前地图级别


      //设置相机主视角

      function SetHoumeViewerjd(west, south, east, north) {

        //参数为经纬度

        Cesium.Camera.DEFAULT_VIEW_RECTANGLE = new Cesium.Rectangle.fromDegrees(west, south, east, north);

        if (Cesium.defined(viewer)) {

          var hw1 = viewer.camera.computeViewRectangle();

          console.log("设置后相机视角", hw1);

        }

      }



      //加载poi数据

      function LoadJsonData() {

        getJSON('../Apps/SampleData/geojson/cadshp/上海市-矢量地图_百度POI (V1.0)1.json', (geojson) => {

          console.log
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值