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

对于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;
}

第四步：动态逻辑添加完毕，进行新的数据关联。

由于客户希望是进行井深数据的判断，我们就直接把井深数据关到我们新加的这个可视化组件上。

好了，编辑工作完成，保存一下图纸就可以跳转到实际运行界面上看结果了。

这只是Legolas应用的一个很小的例子，面对现场突发需求，开发人员不用再半夜起来敲代码，只要指导现场的工人拖拽一下新的需求页面，设置一下所需的动态逻辑就可以了。这也是我们创造Legolas的初衷：

通过Legolas工业自动化平台，用可视化拖拽的方式就能实现应用系统界面布局，并通过复杂逻辑动态注入和数据模型的动态映射，设计出可以运行在各类设备上的应用系统，满足各种领域和行业的需求。