TWaver家族新成员 — Legolas工业自动化设计平台

最新推荐文章于 2024-11-06 11:14:05 发布

TWaver数字孪生

最新推荐文章于 2024-11-06 11:14:05 发布

阅读量2.2k

点赞数

文章标签：工业自动化 web前端 javascript

本文链接：https://blog.csdn.net/twaver/article/details/50038707

版权

对于TWaver可视化家族的成员，大家比较熟悉的是我们的网络拓扑图组件和MONO Design三维建模工具。作为开发工具，这两款产品面向广大的程序猿同志，在界面可视化上为大家省时省力。但是，当项目交付以后，我们经常会遇到这种情况：

在已经交付的某客户现场，甲方又提出了界面改动需求。

通常情况下，需求都不难，但是会超出了当初需求调研以及验收标准中的要求了。而且按照传统的开发流程，撇开时间和费用等问题，界面改动通常需要让后方的美工大人重新调整界面，开发人员进行代码修改，一来一回，耗时耗力。我们近期也遇到了这样的情况，不过得益于项目所使用的Legolas™工业自动化平台，这个改动只花了几分钟就搞定了。

是的，今天我们就来大张旗鼓地给大家介绍一下这位TWaver可视化家族的新成员 ———— Legolas。

还是从项目说起吧。最近我们做了一个油田钻井用工程车辆工况管理的项目。项目早已完成验收，系统运行也没有问题，但是甲方提出，希望能有个表示钻井钻头作业方向的功能，用来方便指导作业工人的工作。下面是我们已经开发完成的界面：

钻井工程车工况管理

大家看到的这个界面，是用Legolas™平台开发的。如何实现在这个界面上添加一个表示钻井钻头作业方向的功能呢？

第一步：现场工人打开系统中的图纸编辑工具，打开需要修改的页面图纸。

（是的，你没有看错，只要让现场工人来操作就可以了）

第二步：从左边工具栏中，拖拽一个新的组件到图纸中，设置一下它的ID。

这个组件是用来显示图片的，我们可以通过逻辑判断例如井深数据的变化，来动态计算出钻头的走向趋势，然后用表示上、下的箭头来指明方向。

第三步：点击动态逻辑管理界面，进行符合甲方需求的逻辑代码。

由于编辑平台是使用JavaScript开发的，追加一些基本逻辑就是如此简单：

function (r){
var v = r.value;
vardd =this.depth;
if(dd){
if(v>=dd){
this.setValue("image","./images/vi/2d/arrow2.png");
}else{
this.setValue("image","./images/vi/2d/arrow1.png");
        }
    }
this.depth = v;
}