Cesium图层控制开关（ZTree）

最新推荐文章于 2024-12-11 12:24:27 发布

原创

最新推荐文章于 2024-12-11 12:24:27 发布 · 1.6k 阅读

5 ·

CC 4.0 BY-SA版权

文章标签：

#Cesium #JavaScript #zTree #前端

本文介绍如何将Ztree树形选择器与Cesium地球可视化库集成，实现图层控制功能。通过示例代码展示了如何加载Ztree并根据树的选择状态动态添加或移除Cesium中的图层。

逻辑：
在这里插入图片描述
Ztree是树形选择器，下载地址
上代码（不会加载Cesium的看这里）：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="Build/zTree_v3/css/zTreeStyle/zTreeStyle.css" type="text/css">

    <style>
      @import url(Build/Cesium/Widgets/widgets.css);
      .cesium-widget-credits {
   
   
        display: none !important; /*去除Cesium默认版权信息*/
      }
      html,
      body,
      #cesiumContainer {
   
   
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        overflow: hidden;
      }
    </style