ThingJS: 做一个数据可视化项目的难点在什么地方?3D 可视化 three.js

简介: 项目开发的过程会分成三个部分:数据前置动作、三维建模环节、3D开发环节,数据前置动作,是一大难点。

不说大而全的,就说我们做的数据可视化大屏应用项目,就算是极简化的开发流程,也需要建模师+开发师两两搭配,项目开发的过程会分成三个部分:数据前置动作、三维建模环节、3D开发环节,数据前置动作,是一大难点。因为项目需求需要提前调研分析,并结合3D开发流程进行梳理。
交通可视化.GIF

ThingJS平台提供了3D场景库,可以获取一些模型,避免过高的模型制作成本,而开发可以利用api和3D源码示例,提高开发效率,但是项目需求分析是非标准化的。

以3D建筑可视化为例,模拟的3D场景模型是以场景数据库的方式进行管理和操作的。在建立场景模型之前,项目管理人员要对场内各实体要素的几何空间位置、模型结构关系进行梳理和确认,并以此确定建筑空间环境的层次结构,常见采用分层结构与面向对象相结合的数据结构。

我们将建筑物及其空间环境 (构筑物、环境景观、道路等) 按照功能特点抽象为类,再将大类细分为子类或者实体对象(房间、设备等),搭建合理的三维数据结构,作为场景搭建的前置动作。只要数据切割的逻辑清晰,三维建模和3D开发会顺利进行。

以下为建筑可视化模拟的三维数据结构,供参考。
669549953952458fa0ab1207ef4306f0.png

相关文章
|
3月前
|
数据采集 资源调度 JavaScript
Node.js 适合做什么项目?
【8月更文挑战第4天】Node.js 适合做什么项目?
212 5
|
3天前
|
CDN
如何在项目中使用Moment.js库?
如何在项目中使用Moment.js库?
|
22天前
|
资源调度 前端开发 数据可视化
构建高效的数据可视化仪表板:D3.js与React的融合之道
【10月更文挑战第25天】在数据驱动的时代,将复杂的数据集转换为直观、互动式的可视化表示已成为一项至关重要的技能。本文深入探讨了如何结合D3.js的强大可视化功能和React框架的响应式特性来构建高效、动态的数据可视化仪表板。文章首先介绍了D3.js和React的基础知识,然后通过一个实际的项目案例,详细阐述了如何将两者结合使用,并提供了实用的代码示例。无论你是数据科学家、前端开发者还是可视化爱好者,这篇文章都将为你提供宝贵的洞见和实用技能。
46 5
|
21天前
|
数据可视化 JavaScript 前端开发
数据可视化进阶:D3.js在复杂数据可视化中的应用
【10月更文挑战第26天】数据可视化是将数据以图形、图表等形式呈现的过程,帮助我们理解数据和揭示趋势。D3.js(Data-Driven Documents)是一个基于JavaScript的库,使用HTML、SVG和CSS创建动态、交互式的数据可视化。它通过数据驱动文档的方式,将数据与DOM元素关联,提供高度的灵活性和定制性,适用于复杂数据的可视化任务。 示例代码展示了如何使用D3.js创建一个简单的柱状图,展示了其基本用法。D3.js的链式调用和回调函数机制使代码简洁易懂,支持复杂的布局和交互逻辑。
62 3
|
29天前
|
JavaScript 测试技术 API
跟随通义灵码一步步升级vue2(js)项目到vue3版本
Vue 3 相较于 Vue 2 在性能、特性和开发体验上都有显著提升。本文介绍了如何利用通义灵码逐步将 Vue 2 项目升级到 Vue 3,包括备份项目、了解新特性、选择升级方式、升级依赖、迁移组件和全局 API、调整测试代码等步骤,并提供了注意事项和常见问题的解决方案。
|
2月前
|
算法 JavaScript 前端开发
第一个算法项目 | JS实现并查集迷宫算法Demo学习
本文是关于使用JavaScript实现并查集迷宫算法的中国象棋demo的学习记录,包括项目运行方法、知识点梳理、代码赏析以及相关CSS样式表文件的介绍。
第一个算法项目 | JS实现并查集迷宫算法Demo学习
|
1月前
|
JavaScript 前端开发 测试技术
JavaScript与TypeScript:为何TypeScript成为大型项目的首选
JavaScript与TypeScript:为何TypeScript成为大型项目的首选
28 1
|
1月前
|
人工智能 JavaScript 网络安全
ToB项目身份认证AD集成(三完):利用ldap.js实现与windows AD对接实现用户搜索、认证、密码修改等功能 - 以及针对中文转义问题的补丁方法
本文详细介绍了如何使用 `ldapjs` 库在 Node.js 中实现与 Windows AD 的交互,包括用户搜索、身份验证、密码修改和重置等功能。通过创建 `LdapService` 类,提供了与 AD 服务器通信的完整解决方案,同时解决了中文字段在 LDAP 操作中被转义的问题。
|
2月前
vite.config.js中vite.defineConfig is not defined以及创建最新版本的vite项目
本文讨论了在配置Vite项目时遇到的`vite.defineConfig is not defined`错误,这通常是由于缺少必要的导入语句导致的。文章还涉及了如何创建最新版本的Vite项目以及如何处理`configEnv is not defined`的问题。
112 3
vite.config.js中vite.defineConfig is not defined以及创建最新版本的vite项目
|
1月前
|
存储 JavaScript 前端开发
Vue.js项目中全面解析定义全局变量的常用方法与技巧
Vue.js项目中全面解析定义全局变量的常用方法与技巧
41 0
下一篇
无影云桌面