基于 H5 和 webGL 的挖掘机 3D 交互式可视化应用

2020-02-24
阅读 8 分钟
2.5k
在工业互联网以及物联网的影响下,人们对于机械的管理,机械的可视化,机械的操作可视化提出了更高的要求。如何在一个系统中完整的显示机械的运行情况,机械的运行轨迹,或者机械的机械动作显得尤为的重要,因为这会帮助一个不了解这个机械的小白可以直观的了解机械的运行情况,以及机械的所有可能发生的动作,对于三一...

使用 H5 与 webGL 技术的电子围栏 3D 展示

2020-02-21
阅读 7 分钟
1.9k
现代工业化的推进在极大加速现代化进程的同时也带来的相应的安全隐患,在传统的可视化监控领域,一般都是基于 Web SCADA 的前端技术来实现 2D 可视化监控,本系统采用 Hightopo 的 HT for Web 产品来构造轻量化的 3D 可视化场景,该 3D 场景从正面展示了一个现代化工厂的现实场景,包括工厂工人的实时位置、电子围栏的范...

2019 篇 - 分享数百个 HT的工业互联网 2D 3D 可视化应用案例

2020-02-17
阅读 10 分钟
2.8k
继《分享数百个 HT 工业互联网 2D 3D 可视化应用案例》2018 篇,图扑软件定义 2018 为国内工业互联网可视化的元年后,2019 年里我们与各行业客户进行了更深度合作,拓展了 HT for  Web 在更多新领域的应用,图扑软件作为在工业可视化领域的一线重度参与者,我们觉得有必要将该话题作为系列文章,在此对 2019 年做个总结...

基于 H5与WebGL 的低碳工业园区 3D 监控系统

2020-02-14
阅读 7 分钟
2.1k
低碳工业园区的建设与推广是我国推进工业低碳转型的重要举措,低碳工业园区能源与碳排放管控平台是低碳工业园区建设的关键环节。如何对园区内的企业的能源量进行采集、计量、碳排放核算,如何对能源消耗和碳排放进行实时动态监测等问题,涉及多个技术领域,专业性强。其数据不仅要求准确,更要求真实可靠(即可核查、可...

基于 H5 与 WebGL 的风力发电场 3D 展示

2020-02-12
阅读 8 分钟
1.7k
风能是一种开发中的洁净能源,它取之不尽、用之不竭。当然,建风力发电场首先应考虑气象条件和社会自然条件。近年来,我国海上和陆上风电发展迅猛。海水、陆地为我们的风力发电提供了很好地质保障。正是这些场地为我们的风力提供了用之不竭的能源。现在我们正在努力探索这些领域。

分享数百个 HT 工业互联网 2D 3D 可视化应用案例之 2019 篇

2020-02-11
阅读 10 分钟
3.4k
继《分享数百个 HT 工业互联网 2D 3D 可视化应用案例》2018 篇,图扑软件定义 2018 为国内工业互联网可视化的元年后,2019 年里我们与各行业客户进行了更深度合作,拓展了 HT for  Web 在更多新领域的应用,图扑软件作为在工业可视化领域的一线重度参与者,我们觉得有必要将该话题作为系列文章,在此对 2019 年做个总结...

基于 H5 和 webGL 的 3D 智慧城市

2020-02-11
阅读 4 分钟
2.8k
《纲要》强调,要提升基础设施互联互通水平,打造数字长三角,协同建设新一代信息基础设施,共同推动重点领域智慧应用。大力发展基于物联网、大数据、人工智能的专业化服务,提升各领域融合发展、信息化协同和精细化管理水平。围绕城市公共管理、公共服务、公共安全等领域,支持有条件的城市建设基于人工智能和 5G 物联...

使用Web3D 技术的3D地铁站 可视化展示

2020-02-07
阅读 8 分钟
4.9k
工业互联网,物联网,可视化等名词在我们现在信息化的大背景下已经是耳熟能详,日常生活的交通,出行,吃穿等可能都可以用信息化的方式来为我们表达,在传统的可视化监控领域,一般都是基于 Web SCADA 的前端技术来实现 2D 可视化监控,本系统采用 Hightopo 的 HT for Web 产品来构造轻量化的 3D 可视化场景,该 3D 场景...

基于 H5 与 WebGL 的3D太阳系立体展示

2020-02-05
阅读 5 分钟
2.4k
近年来随着引力波的发现、黑洞照片的拍摄、火星上存在水的证据发现等科学上的突破,以及文学影视作品中诸如《三体》、《流浪地球》、《星际穿越》等的传播普及,宇宙空间中那些原本遥不可及的事物离我们越来越近,人们对未知文明的关注和对宇宙空间的好奇达到了前所未有的高度。站在更高的立足点上,作为人类这个物种中...

基于 HTML5 + WebGL 的 3D 风力发电场

2020-01-15
阅读 8 分钟
1.9k
风能是一种开发中的洁净能源,它取之不尽、用之不竭。当然,建风力发电场首先应考虑气象条件和社会自然条件。近年来,我国海上和陆上风电发展迅猛。海水、陆地为我们的风力发电提供了很好地质保障。正是这些场地为我们的风力提供了用之不竭的能源。现在我们正在努力探索这些领域。

基于 HTML5 WebGL 的低碳工业园区监控系统

2020-01-08
阅读 7 分钟
1.5k
低碳工业园区的建设与推广是我国推进工业低碳转型的重要举措,低碳工业园区能源与碳排放管控平台是低碳工业园区建设的关键环节。如何对园区内的企业的能源量进行采集、计量、碳排放核算,如何对能源消耗和碳排放进行实时动态监测等问题,涉及多个技术领域,专业性强。其数据不仅要求准确,更要求真实可靠(即可核查、可...

基于HTML5和WebGL的碰撞测试

2020-01-06
阅读 5 分钟
1.2k
这是公司大神写的一个放官网上给用户学习的例子,我一开始真的不知道这是在干嘛,就只是将三个形状图元组合在一起,然后可以同时旋转、放大缩小这个三个图形,点击“Animate”就能让中间的那一个图元单独绕着某一个点旋转,表单最上方的“Axis”真的完全不知道拿来干嘛用的,觉得好累赘,而且是官网的demo,也没有解释。。。...

基于 HTML5 WebGL 构建智能数字化城市 3D 全景

2019-12-19
阅读 15 分钟
2.1k
自 2011 年我国城镇化率首次突破 50% 以来,《新型城镇化发展规划》将智慧城市列为我国城市发展的三大目标之一,并提出到 2020 年,建成一批特色鲜明的智慧城市。截至现今,全国 95% 的副省级以上城市、76% 的地级以上城市,总计约 500 多个城市提出或在建智慧城市。

基于 HTML5 + Canvas 的楼宇自控系统

2019-10-30
阅读 4 分钟
2.3k
楼宇自控是指楼宇中电力设备,如电梯、水泵、风机、空调等,其主要工作性质是强电驱动。通常这些设备是开放性的工作状态,也就是说没有形成一个闭环回路。只要接通电源,设备就在工作,至于工作状态、进程、能耗等,无法在线及时得到数据,更谈不上合理使用和节约能源。现在楼宇自控是将上述的电器设备进行在线监控,通...

基于 HTML5 OpenLayers3 实现 GIS 电信资源管理系统

2018-05-23
阅读 15 分钟
6.5k
通过结合 HTML5 和 OpenLayers 可以组合成非常棒的一个电信地图网络拓扑图的应用,形成的效果可以用来作为电信资源管理系统,美食定位分享软件,片区找房,绘制铁轨线路等等,各个领域都能够涉及的一款应用。虽然这个 Demo 是结合 OpenLayers3 的,其实还可推广到与 ArcGIS、百度地图以及 GoogleMap 等众多 GIS 地图引擎...

基于 HTML5 Canvas 的电信机柜 U 位动态管理

2018-05-07
阅读 14 分钟
5.2k
U 是一种表示服务器外部尺寸的单位,是 unit 的缩略语,详细的尺寸由作为业界团体的美国电子工业协会(EIA)所决定。之所以要规定服务器的尺寸,是为了使服务器保持适当的尺寸以便放在铁质或铝质的机架上。机架上有固定服务器的螺孔,以便它能与服务器的螺孔对上号,再用螺丝加以固定好,以方便安装每一部服务器所需要的...

基于 HTML5 Canvas 实现的文字动画特效

2018-04-02
阅读 5 分钟
6.9k
文字是网页中最基本的元素,一般我们在网页上都是展示的静态文字,但是就效果来说,还是比较枯燥的。文字淡入淡出的动画效果在项目中非常实用,如果有某些关键的文字,可以通过这种动态的效果来提醒用户阅读。

快速创建 HTML5 Canvas 电信网络拓扑图

2018-03-21
阅读 11 分钟
4.1k
电信网络拓扑图确实实用性很强,最近有个项目是基于这个的,为了写得丰富一点,还加了自动布局已经属性栏部分,不过这个 Demo 真的写得很用心,稍微改改都能直接运用到项目中去,还可以进行数据交互,总之希望能对大家有所帮助。

快速开发基于 HTML5 网络拓扑图应用之 DataBinding 数据绑定篇

2018-03-19
阅读 5 分钟
4.1k
发现大家对于我从 json 文件中直接操作节点属性来控制界面的动态变化感到比较好奇,所以这篇就针对数据绑定以及如何使用这些绑定的数据做一篇说明,我写了一个简单的例子,基于机房工控的服务器上设备的灯闪烁现象。我们从 2d 和 3d 两个角度来分析数据绑定的问题。

基于 HTML5 Canvas 的交互式地铁线路图

2018-03-05
阅读 10 分钟
4.4k
前两天在 echarts 上寻找灵感的时候,看到了很多有关地图类似的例子,地图定位等等,但是好像就是没有地铁线路图,就自己花了一些时间捣鼓出来了这个交互式地铁线路图的 Demo,地铁线路上的点是在网上随便下载了一个,这篇文章记录自己的一些收获(毕竟我还是个菜鸟)以及代码的实现,希望能够帮到一些朋友。当然,如果...

基于 HTML5 Canvas 绘制的电信网络拓扑图

2018-02-07
阅读 4 分钟
5.6k
电信网结构(telecommunication network structure)是指电信网各种网路单元按技术要求和经济原则进行组合配置的组合逻辑和配置形式。组合逻辑描述网路功能的体系结构,配置形式描述网路单元的邻接关系,即以交换中心(或节点)和传输链路所组成的拓扑结构。常见的网络拓扑结构有星型结构、总线结构、环形结构、树形结构...

基于 HTML5 的电力接线图 SCADA 应用

2018-01-17
阅读 8 分钟
6.6k
在电力、油田燃气、供水管网等工业自动化领域 Web SCADA 的概念已经提出了多年,早些年的 Web SCADA 前端技术大部分还是基于 Flex、Silverlight 甚至 Applet 这样的重客户端方案,在 HTML5 流行前 VML 和 SVG 算是真正纯种 Web 方案也是有不少应用,近些年随着 HTML5 的流行,加上移动终端以及浏览器对 HTML5 支持的普及...

快速开发基于 HTML5 网络拓扑图应用--入门篇(一)

2018-01-09
阅读 4 分钟
3.8k
计算机网络的拓扑结构是引用拓扑学中研究与大小,形状无关的点、线关系的方法。把网络中的计算机和通信设备抽象为一个点,把传输介质抽象为一条线,由点和线组成的几何图形就是计算机网络的拓扑结构。网络的拓扑结构反映出网中各实体的结构关系,是建设计算机网络的第一步,是实现各种网络协议的基础,它对网络的性能,...

快速开发基于 HTML5 网络拓扑图应用1

2018-01-08
阅读 3 分钟
4.3k
今天开始我们就从最基础解析如何构建 HTML5 Canvas 拓扑图应用,HT 内部封装了一个拓扑图形组件 ht.graph.GraphView(以下简称 GraphView)是 HT 框架中 2D 功能最丰富的组件,其相关类库都在 ht.graph 包下。GraphView 具有基本图形的呈现和编辑功能,拓扑节点连线及自动布局功能,电力和电信等行业预定义对象,具有动...

基于 HTML5 WebGL 的 3D 场景中的灯光效果

2018-01-02
阅读 4 分钟
2.3k
构建 3D 的场景除了创建模型,对模型设置颜色和贴图外,还需要有灯光的效果才能更逼真的反映真实世界的场景。这个例子我觉得既美观又代表性很强,所以拿出来给大家分享一下。

基于 HTML5 Canvas 的 3D 机房创建

2017-12-24
阅读 14 分钟
4.9k
对于 3D 机房来说,监控已经不是什么难事,不同的人有不同的做法,今天试着用 HT 写了一个基于 HTML5 的机房,发现果然 HT 简单好用。本例是将灯光、雾化以及 eye 的最大最小距离等等功能在 3D 机房中进行的一个综合性的例子。接下来我将对这个例子的实现进行解析,算是自己对这个例子的一个总结吧。整个例子因为没有设...

基于 HTML5 Canvas 的 3D 压力器反序列化

2017-12-18
阅读 7 分钟
2.1k
在实际应用中,我觉得能够通过操作 JSON 文件来操作 3D 上的场景变化是非常方便的一件事,尤其是在做编辑器进行拖拽图元并且在图元上产生的一系列变化的时候,都能将数据很直观地反应给我们,这边我们简单地做了个基础的例子,给大家参考看看。

基于 HTML5 Canvas 的 3D 碰撞检测

2017-12-10
阅读 5 分钟
1.8k
这是公司大神写的一个放官网上给用户学习的例子,我一开始真的不知道这是在干嘛,就只是将三个形状图元组合在一起,然后可以同时旋转、放大缩小这个三个图形,点击“Animate”就能让中间的那一个图元单独绕着某一个点旋转,表单最上方的“Axis”真的完全不知道拿来干嘛用的,觉得好累赘,而且是官网的 Demo,也没有解释。。...

基于 HTML5 Canvas 的 3D 模型贴图问题

2017-12-06
阅读 8 分钟
2.9k
之前注意到的一个例子,但是一直没有沉下心来看这个例子到底有什么优点,总觉得就是一个 list 列表,也不知道右边的 3d 场景放两个节点是要干嘛,今天突然想起来就仔细地看了一下这个例子的代码,实际操作中应该还是有用处的,就跟大家分享一下。

基于 HTML5 Canvas 的简易 2D 3D 编辑器

2017-12-03
阅读 8 分钟
7.2k
不管在任何领域,只要能让非程序员能通过拖拽来实现 2D 和 3D 的设计图就是很牛的,今天我们不需要 3dMaxs 等设计软件,直接用 HT 就能自己写出一个 2D 3D 编辑器,实现这个功能我觉得成就感还是爆棚的,哈哈!只要你会想,能做,就能根据这个编辑器延展成 big thing!