一个前端的三维可视化开发心路历程

前言：我公司是做资讯平台的，每天用户不少，作为一个只有一年工作经验的前端开发工作者，临危受命要做可视化大屏，就是那种放在显眼区域实时能看到动态数据的大屏，要酷炫要抗造耐用。怎么办？网上各种找渠道啊，各种问啊，幸好本人没少混前端技术交流群。经打听，我了解到了ThingJS。可谓是救我于水火之中呀~

这是一个神奇的平台，此处使用官方介绍：

ThingJS 是物联网可视化PaaS开发平台，帮助物联网开发商轻松集成 3D 可视化界面。ThingJS 名称源于

物联网Internetof Things(IoT)中的 Thing (物)，ThingJS 使用当今最热门的 Javascript语言进行开发。不仅可以针对单栋或多栋建筑组成的园区场景进行可视化开发，搭载丰富插件后，也可以针对地图级别场景进行开发。广泛应用于数据中心、仓储、学校、医院、安防、预案等多种领域。

物联网分为感知层、网络层、应用层。应用层涉及到 3D 界面的开发，对大部分企业来说都有一定挑战。ThingJS 可以极大降低 3D 界面开发的成本。下图清晰的反映了ThingJS 在物联网领域中的定位：

ThingJS 基于 HTML5 和 WebGL 技术，可方便地在主流浏览器上进行浏览和调试，支持 PC 和移动设备。ThingJS 为可视化应用提供了简单、丰富的功能，只需要具有基本的Javascript 开发经验即可上手。

ThingJS 提供了场景加载、分层级浏览，对象访问、搜索、以及对象的多种控制方式和丰富的效果展示，可以通过绑定事件进行各种交互操作，还提供了摄像机视角控制、点线面效果、温湿度云图、界面数据展示、粒子效果等各种可视化功能。

ThingJS提供如下相关组件和工具供用户使用：

CityBuilder：聚焦城市的 3D 地图搭建工具，打造你的 3D 城市地图。

CamBuilder：简单、好用、免费的 3D 场景搭建工具。

ThingPano：全景图制作工具，轻松制作并开发全景图应用，实现 3D 宏观场景和全景微观场景的无缝融合。

ThingDepot：上万种模型，数十个行业，自主挑选，一次制作多次复用。

作品展示：

过程很爽，就像过关斩将一般。幸好有ThingJS开发文档护体，使用之前在开始使用 ThingJS 之前，需要先了解JavaScript，我们假设您已经掌握JS。

创建项目

创建项目之前需登录ThingJS账号，如果您尚未登录账号或页面出现“登录已过期，请重新登录！”的提示，为保证项目的正确保存及运行，请您在账号登录之后再创建项目。您可通过以下三种方式创建项目：

选择菜单区域的“文件 - 新建项目”选项

点击工具栏“新建”图标，图标如右图所示：

使用快捷键“Ctrl+P”

编辑项目

在线开发为用户提供了相应的快捷代码和官方示例，如果你正在用ThingJS在线开发页面，可以通过以下两种方式来编辑项目:

点击在线开发页面菜单区域的快捷代码选项中的子项，编辑区将自动插入相应代码

选择在线开发官方示例中的其中任意一个示例，点击相应示例，编辑区将显示相应代码

后续操作详见在线开发 - 应用开发 - 在线开发

保存项目

可通过以下四种方式保存项目：

选择菜单区域的“文件 - 保存”选项

点击工具栏“保存”图标，图标如右图所示：

使用快捷键“Ctrl+S”

运行项目

在线开发环境提供了以下几种方式运行项目：

使用快捷方式“Ctrl+R/Enter”或点击工具栏中的“运行”图标，3d容器区域将运行编辑器相应的代码。图标如右图所示：

选择菜单区域的“工具 - 设置”选型，出现的设置面板，点击开启“自动保存执行”

一个前端的三维可视化开发心路历程相关推荐

转自goosman的编程开发心路历程
我现在是一名大二的学生,无意间看到这篇文章,心里受到很大的触动,特意研究了一怎么转载博客,打算纪念一下这个可能改变我生命轨迹的日子.我想,几年以后我也会写下一篇类似的文章,记录自己的程序猿心路历程.文 ...
我的游戏开发心路历程
原文发表在[博毅创为游戏圈]公众号首先,感谢博毅创为游戏圈举办的征文活动. 一直想聊一聊我学游戏开发的心路历程,只是苦于没有合适的倾诉对象. 有道是: 对了知音谈几句,不对知音枉费舌尖. 闲话少叙, ...
python安卓开发-一个Android开发者自学Python的心路历程
前言本人主要从事Android开发,也做过微信小程序,有时还会在Java那边客串一把(谁让Android是用的Java呢@~@),最近在自学Python,已有半月有余.因近年来,技术迭代快速,前端更 ...
基于VTK的PACS系统的开发心路历程2
中文操作手册-简介部分翻译不易,且看且珍惜! 前言: 欢迎使用可视化工具包(VTK)的用户指南,VTK是一个开源的.面向对象的软件系统,用于计算机图形学.可视化. 和图像处理.虽然它大而复杂,一旦你 ...
一个Android开发者自学Python的心路历程
前言本人主要从事Android开发,也做过微信小程序,有时还会在Java那边客串一把(谁让Android是用的Java呢@~@),最近在自学Python,已有半月有余.因近年来,技术迭代快速,前端更 ...
wms地图绘制工具_三维离线地图-三维地图开发，三维地球，三维可视化开发
一.软件介绍 BIGEMAP离线地图服务器,提供一站式搭建离线/在线地图数据服务器,支持40多种地图离线发布:提供快速WEB应用.WMTS.TMS.WMS等地图服务:支持二次开发调用:支持数据集管理. ...
汽车销量查询小助手（小程序）开发心路历程
偶然的机会,在旁边公园带孩子的时候,结识了邻居家孩子的爸爸.他是做汽车维修的,聊天的时候,得知我是做软件开发的. 他告诉我,他每个月都会对上个月的汽车销量进行手动的汇总, copy 到 excel 中 ...
【春招实习秋招】前端学习の优质资料整理心路历程（已上岸）
引言写这篇博客原因我就简单谈谈我为什么要整理这份学习资料吧,首先,春招遗憾没有上岸,可以说没抓住机遇,准备也不够好,但我努力的轨迹还在,运气或许没到,但我坚持下来的勇气一直都在!每一份坚持都是成功 ...
【linux(1)，八年Java开发心路历程
2.检查java是否安装成功使用java -version查看java是否安装成功 java -version 有版本的显示就是安装成功了 3.更换java版本在学习过程中我们经常会学习不同版本的 ...

一个前端的三维可视化开发心路历程

一个前端的三维可视化开发心路历程相关推荐

最新文章

热门文章