Cesium绘制一个正方体

简介: 这篇文章详细说明了如何在Cesium中创建并精确控制一个厘米级精度的立方体模型。

这节讲在cesium中绘制一个正方体,与threejs类似,在一个场景中添加一个正方体就好了,设置正方体的长宽高和位置,不过绘制的方式和threejs有很大的区别,这里还是用的类似百度echarts的绘制方式,通过json格式的配置文件描述正方体的长宽高和位置,以下是相关源码,可以替换掉token后复制到html文件中测试下:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <!-- Include the CesiumJS JavaScript and CSS files -->
  <script src="https://cesium.com/downloads/cesiumjs/releases/1.100/Build/Cesium/Cesium.js"></script>
  <link href="https://cesium.com/downloads/cesiumjs/releases/1.100/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
</head>
<body>
  <div id="cesiumContainer"></div>
  <div id="credit"></div>
  <script>
    // 设置token
    Cesium.Ion.defaultAccessToken = 'token';

    //初始化div容器为cesium
    var viewer = new Cesium.Viewer('cesiumContainer');
    //阿仔容器中添加一个正方体,
    var redBox = viewer.entities.add({
      //正方体的名字
      name : 'Red box with black outline',
      //正方体的经纬度坐标
      position: Cesium.Cartesian3.fromDegrees(-110.0, 39.0, 300000.0),
      //正方体的长宽高和颜色等
      box : {
        dimensions : new Cesium.Cartesian3(300000.0, 300000.0, 300000.0),
        material : Cesium.Color.RED.withAlpha(0.5),
        outline : true,
        outlineColor : Cesium.Color.BLACK
      }
    });

    //将相机视角调整到适合显示场景中的所有实体的范围
    viewer.zoomTo(viewer.entities);
  </script>
 </div>
</body>
</html>

效果图如下 1693791296113.jpg 以上如有问题可以在评论区给我留言

相关文章
Cesium开发:模型实体高亮
Cesium开发:模型实体高亮
1415 0
cesium添加实体不被地形遮挡的参数设置
disableDepthTestDistance:指定从相机到禁用深度测试的距离,关于深度测试我们将在后面的文章中介绍到,由于深度测试的存在,我们的对象很多时候会被地形挡住,如下:
3392 0
cesium添加实体不被地形遮挡的参数设置
cesium中绘制立方体、设置材质、操作相机及获取鼠标经纬度和高度的方法
cesium中绘制立方体、设置材质、操作相机及获取鼠标经纬度和高度的方法
994 0
|
人工智能 关系型数据库 分布式数据库
PolarDB 开源基础教程系列 7.4 应用实践之 AI大模型外脑
PolarDB向量数据库插件通过实现通义大模型AI的外脑,解决了通用大模型无法触达私有知识库和产生幻觉的问题。该插件允许用户将新发现的知识和未训练的私有知识分段并转换为向量,存储在向量数据库中,并创建索引以加速相似搜索。当用户提问时,系统将问题向量化并与数据库中的向量进行匹配,找到最相似的内容发送给大模型,从而提高回答的准确性和相关性。此外,PolarDB支持多种编程语言接口,如Python,使数据库具备内置AI能力,极大提升了数据处理和分析的效率。
902 4
|
架构师 前端开发 Cloud Native
国内首个开源架构治理平台 ArchGuard,专治分布式场景下各种不服
过去的 10 年间,软件的架构发生了巨大的变化,从早先流行的单体 MVC 架构,变成了所谓的 5:5 开,即分布式 vs 单体。只是呢,有大量的软件开发人员,无法看到系统的全貌,又或者是从单体的思维转变过来。于是,哪怕是在使用了微服务的情况下,但是实现的却又是一个一个的单体,只是它们变成了“分布式的单体”。
983 0
国内首个开源架构治理平台 ArchGuard,专治分布式场景下各种不服
|
9月前
|
人工智能 自然语言处理 数据可视化
AI Agent框架
AI Agent框架选型需权衡灵活性与易用性,根据团队能力、项目复杂度及合规需求选择。开发者可选LangGraph、AutoGen等高定制框架,业务侧推荐Dify、Coze等低代码平台,核心是匹配场景,而非追逐热门技术。
|
定位技术 API 网络架构
地图图层接入:从mapbox转向cesium
由于地图坐标系的不统一,地图图商提供的图层服务也各有特色,在图层对接的开发过程中常会遇到许多坑,从二维图层到三维图层,地图引擎mapbox再到cesium,本文将分享笔者在近期地图图层接入过程中总结的一些经验。
5514 10
|
Web App开发 Java
使用java操作浏览器的工具selenium-java和webdriver下载地址
【10月更文挑战第12天】Selenium-java依赖包用于自动化Web测试,版本为3.141.59。ChromeDriver和EdgeDriver分别用于控制Chrome和Edge浏览器,需确保版本与浏览器匹配。示例代码展示了如何使用Selenium-java模拟登录CSDN,包括设置驱动路径、添加Cookies和获取页面源码。
1171 6
HarmonyOS NEXT开发教程:全局悬浮窗
今天跟大家分享一下HarmonyOS开发中的悬浮窗。
|
Kubernetes 安全 异构计算
K8S 部署 Deepseek 要 3 天?别逗了!Ollama+GPU Operator 1 小时搞定
最近一年我都在依赖大模型辅助工作,比如 DeepSeek、豆包、Qwen等等。线上大模型确实方便,敲几个字就能生成文案、写代码、做表格,极大提高了效率。但对于企业来说:公司内部数据敏感、使用外部大模型会有数据泄露的风险。
K8S 部署 Deepseek 要 3 天?别逗了!Ollama+GPU Operator 1 小时搞定

热门文章

最新文章