6 图扑软件

尚未进行身份认证

HT for Web 3D.HT for modern web and mobile app development.

等级
TA的排名 9k+

基于 HTML5 Canvas 的可交互旋钮组件

前言此次的Demo效果如下:Demo链接:https://hightopo.com/demo/comp-knob/整体思路组件参数 绘制旋钮 绘制刻度 绘制指针 绘制标尺 绘制文本 交互效果1.组件参数以下是下文会使用到的部分变量,在此先贴出来varorigin,//原点percent,//显示刻度占总刻度的百分比...

2019-08-19 08:09:02

基于 HTML5 Canvas 的元素周期表展示

前言之前在网上看到别人写的有关元素周期表的文章,深深的勾起了一波回忆,记忆里初中时期背的“氢氦锂铍硼,碳氮氧氟氖,钠镁铝硅磷,硫氯氩钾钙”、“养(氧)龟(硅)铝铁盖(钙),哪(钠)家(钾)没(镁)青(氢)菜(钛)”,高中时期记的质量守恒、元素守恒、原子守恒、电子守恒,时间过的飞快,转眼我们都已经这么大了。现在我用HT来实现它,HT有2D拓扑和3D模型场景,两种形式我都实现了,...

2019-08-14 08:05:11

基于 HTML5 WebGL 的加油站 3D 可视化监控

前言随着数字化,工业互联网,物联网的发展,我国加油站正向有人值守,无人操作,远程控制的方向发展,传统的人工巡查方式逐渐转变为以自动化控制为主的在线监控方式,即采用数据采集与监控系统SCADA。SCADA系统的推广使用,大大提高了我国加油站的监控效率,本文所讲的则是通过对加油站的可视化建模,结合HT的3D可视化以及2D监控面板来实现对加油站的可视化监控。三维可视化监控系统是将三维...

2019-08-12 08:44:09

基于 HTML5 Canvas 2D 拓扑图和 3D 机柜模型的增删操作

今天好好地消化了一下我们的数据容器DataModel,这里给初学者做一个典型的数据模型事件处理的例子作为参考。这个例子看起来很简单,实际上结合了数据模型中非常重要的三个事件处理的部分:属性变化事件监听、选中变化事件监听以及数据模型变化事件监听。为了让这个例子具现化,我将这个简单的例子做了一点改动,下面我会一一解释。例子地址:http://hightopo.com/guide/guide/co...

2019-06-05 08:02:29

基于 WebGL 实现的 HTML5 3D “弹力”布局

分子力(molecularforce),又称分子间作用力、范得瓦耳斯力,是指分子间的相互作用。当二分子相距较远时,主要表现为吸引力,这种力主要来源于一个分子被另一个分子随时间迅速变化的电偶极矩所极化而引起的相互作用;当二分子非常接近时,则排斥力成为主要的,这是由于各分子的外层电子云开始重叠而产生的排斥作用。HTforWeb提供了弹力布局(也称为力导向布局)的功能,即根据节点之间存在互斥力...

2019-06-04 07:37:10

基于 HTML5 WebGL 的挖掘机 3D 可视化应用

前言在工业互联网以及物联网的影响下,人们对于机械的管理,机械的可视化,机械的操作可视化提出了更高的要求。如何在一个系统中完整的显示机械的运行情况,机械的运行轨迹,或者机械的机械动作显得尤为的重要,因为这会帮助一个不了解这个机械的小白可以直观的了解机械的运行情况,以及机械的所有可能发生的动作,对于三一或者其它国内国外重工机械的公司能够有一个更好的展示或者推广。挖掘机,又称挖掘机械(excavat...

2019-05-14 08:26:48

通过矩阵变化实现的 3D 模型自动布局

在数学中,矩阵是以行和列排列的数字,符号或表达式的矩形阵列,任何矩阵都可以通过相关字段的标量乘以元素。矩阵的主要应用是表示线性变换,即f(x)=4x等线性函数的推广。例如,旋转的载体在三维空间是一个线性变换,这可以通过一个表示旋转矩阵:如果v是一个列向量描述(只有一列的矩阵)的位置在空间中的点,该产品器Rv是列矢量描述旋转后该点的位置。两个变换矩阵的乘积是表示两个变换组成的矩阵。矩阵的...

2019-05-09 08:13:38

基于 WebGL 的 CSG 构造实体几何书架

CSG构造实体几何这个概念在工业水利水电施工上、游戏上已经有很多人使用了,最简单的实体表示叫作体元,通常是形状简单的物体,如立方体、圆柱体、棱柱、棱锥、球体、圆锥等。根据每个软件包的不同这些体元也有所不同,在一些软件包中可以使用弯曲的物体进行CSG处理,在另外一些软件包中则不支持这些功能。构造物体就是将体元根据集合论的布尔逻辑组合在一起,这些运算包括:并集、交集以及补集。我们一般可以用CS...

2019-05-06 08:07:24

基于 WebGL HTML5 的 3D 模型分离控制

工业制作图表,制作模型方面运用到3d模型是非常多的,在一个大的环境中,构建无数个相同的或者不同的模型,构建起来对于程序员来说也是一件相当头疼的事情,我们使用[HT](http://www.hightopo.com)帮大家解决了很大的难题,无数个例子可在官网上查找到http://hightopo.com/demos/index.html。

2019-04-30 08:18:43

基于 WebGL 的 3D Chart 图表

现在工业SCADA上或者电信网管方面用图表的特别多,虽然绝大部分人在图表制作方面用的是echarts,他确实好用,但是有些时候我们不能调用别的插件,这个时候就得自己写这些美丽的图表了,然而图表轻易做不成美丽的。看到有一个网站上在卖的图表,感觉挺好看的,就用[HTforWeb](http://www.hightopo.com)3D做了一个小例子,挺简单的,也挺好看的,哈哈~

2019-04-29 08:02:35

将拓扑图和图表绘制在 3D 六面体上

突然有个想法,如果能把一些用到不同的知识点放到同一个界面上,并且放到一个盒子里,这样我如果要看什么东西就可以很直接显示出来,而且这个盒子一定要能打开。我用HT实现了我的想法,代码一百多行,这么少的代码能实现这种效果我觉得还是牛的。先来看看效果图:这个例子最基础的就是最外层的盒子了,所以我们先来看看如何实现它:varbox=newht.CSGBox();dataModel.ad...

2019-04-26 07:37:56

基于WebGL HTML5 的场景小游戏

为了实现一个基于HTML5的场景小游戏,我采用了HTforWeb来实现,短短200行代码,我就能实现用“第一人称”来操作前进后退上下左右,并且实现了碰撞检测。先来看下实现的效果:http://www.hightopo.com/guide/guide/core/3d/examples/example_collision.html或者http://v.youku.com/v_sho...

2019-04-25 07:54:30

基于 HTML5 WebGL 的计量站三维可视化监控系统 Web 组态工控应用

前言得益于HTML5WebGL技术的成熟,从技术上对工控管理的可视化,数据可视化变得简单易行!完成对工控设备的管理效率,资源管理,风险管理等的大幅度提高,同时也对国家工业4.0计划作出有力响应!如本案例所示,是一个基于HTML5WebGL技术实现的计量站三维可视化监控系统,在本案例中,具体宏观的展示一个油田站点的整体场景,然后点击可以进入内景看到油田计量站内景的具体情况,同时可以看...

2019-04-24 07:46:36

基于 HTML5 WebGL 的 3D 渲染引擎构建工厂运作系统

前言今天为大家带来一个很酷的作品,依然运用了强大的HTforWeb的3D图形组件,动作流畅性能好,大家可以先来欣赏一下效果!点我进入!整体风格为科技金属风,制作精良,由于上传gif大小有限制,所以务必打开链接查看细节演示!代码实现做完场景后,首先我们要对它进行一些基本的设置,如://设置camera的位置gv.setEye([457,9047,434])...

2019-04-23 07:30:53

基于 WebGL 的 HTML5 3D 网络拓扑图

在数据量很大的2D场景下,要找到具体的模型比较困难,并且只能显示出模型的的某一部分,显示也不够直观,这种时候能快速搭建出3D场景就有很大需求了。但是搭建3D应用场景又依赖于通过3dsMax或Maya的专业3D设计师来建模,Unity3D引擎做图形渲染等,这对用户来说都是挑战!不过,HT一站式的提供了从建模到渲染,包括和2D组件呈现和数据融合的一站式解决方案。HT...

2019-04-22 08:31:32

基于 HTML5 实现的简单云动画和景物描述

前言用户鼠标移入时,有弹出框出现,这样的需求很常见。这在处理HTML元素实现时简单,但是如果是对HTML5Canvas构成的图形进行处理,这种方法不再适用,因为Canvas使用的是另外一套机制,无论在Canvas上绘制多少图形,Canvas都是一个整体。而图形本身实际都是Canvas的一部分,不可单独获取,所以也就无法直接给某个图形增加JavaScript事件。然而,...

2019-04-19 08:10:14

学习 HT for Web 中的交互事件

交互事件增强了用户体验,使得我们的作品更加生动。今天,使用HTforWeb写了个典型的Demo来了解HT中的交互事件。

2019-04-18 08:21:30

基于 HTML5 Canvas 实现的 TP-LINK 电信拓扑设备面板

今天我们以真实的TP-LINK设备面板为模型,完成设备面板的搭建,和指示灯的闪烁和图元流动。

2019-04-17 08:22:18

基于 HTML5 WebGL 智能城市的模拟运行

前言智能城市是一个系统。也称为网络城市、数字化城市、信息城市。智能城市建设是一个系统工程:首先实现的是城市管理智能化,由智能城市管理系统辅助管理城市,通过管理系统人们可以监视城市的运行,了解城市每天中发生的变化,以及及时的根据这些变化做出相应的管理;其次是包括智能交通、智能电力、智能安全等基础设施的智能化,交通是一个城市的驱动,交通的畅通加速了城市的发展,通过Web可视化的交通管理,可以更...

2019-04-16 08:31:33

基于 HTML5 实现的风电、光伏新能源管理系统

随着新一轮工业革命兴起,应对气候变化日益成为全球共识,能源技术正在成为引领能源产业变革、实现创新驱动发展的源动力。从全球到中国,以风能、光伏发电为代表的新能源产业发展迅速,可再生能源发电与现代电网的融合成为了世界能源可持续转型的核心,发电技术继续沿着大规模、高效率和低成本方向持续进步,中国在风能和光伏发电领域的累计装机量和新增装机量已经跃居世界首位。

2019-04-12 08:30:15

查看更多

勋章 我的勋章
  • 持之以恒
    持之以恒
    授予每个自然月内发布4篇或4篇以上原创或翻译IT博文的用户。不积跬步无以至千里,不积小流无以成江海,程序人生的精彩需要坚持不懈地积累!
  • 勤写标兵Lv1
    勤写标兵Lv1
    授予每个自然周发布1篇到3篇原创IT博文的用户。本勋章将于次周周三上午根据用户上周的博文发布情况由系统自动颁发。