HTML5技术

Legolas工业自动化平台入门(一)搭建应用 - twaver

字号+ 作者:H5之家 来源:博客园 2015-11-24 18:30 我要评论( )

Legolas工业自动化平台入门(一)搭建应用 前两篇给大家介绍了TWaver家族的新面孔——Legolas工业自动化平台,通过两个应用案例钻井平台工程用车和水源地监控系统,相信大家对Legolas已经有了一定程度的了解。这几篇文章,我们会逐步介绍一些使用Legolas开发

Legolas工业自动化平台入门(一)搭建应用

前两篇给大家介绍了TWaver家族的新面孔——Legolas工业自动化平台,通过两个应用案例钻井平台工程用车和水源地监控系统,相信大家对Legolas已经有了一定程度的了解。这几篇文章,我们会逐步介绍一些使用Legolas开发的入门知识,同时给大家看更多的应用案例。大家一定会惊讶于为什么短时间内我们就积累了那多么案例对吧?不要着急,了解了Legolas的工作原理后,一切自然就清楚了。

这次的案例是客户的管汇系统升级改造。原先2D的管汇系统上线差不多有一年了,前段时间回访客户时,我们演示了3D的效果,客户立马就震惊了,当即决定要把现有的二维界面改造成三维界面。下面我们就简单演示一下,如何用Legolas来打造这个三维的管汇系统。

第一步,将模板库中的模板拖入场景中(2D或3D均可,这里以3D为例)

1

拖入场景中的模板,可以是3D模板或div模板(如果是2D场景可以是2D模板或div模板,2D和3D模板不能直接放在同一图纸下,但是可以通过嵌套的方式实现)。拖入场景后,选中对象,在右侧的属性列表中

2

第二步,数据绑定

3

将左侧“系统模型”中需要绑定的属性拖拽到模板对象上,绑定后在右侧“关联绑定”下的“数据绑定”表中能看到这个模板对象的所有绑定属性。当模板接收到后台推送的属性值后,会执行 “数据绑定”表中的“动作”,如果没有值就执行模板的默认动作。

第三步,保存图纸、运行态运行

完成上面的两步后,就能监控属性值的变化了,然后需要保存图纸、进入运行态。

界面上有一排按钮,如下图:

点击第二个按钮,设置图纸名为“main”;点击第三个“导出”按钮,导出图纸后,最后点击第一个按钮,即可进入运行态。

5

文字介绍太干涩,想要直观了解童鞋不妨看视频吧:

posted @

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 构建自动化前端样式回归测试——BackstopJS篇 - laden666666

    构建自动化前端样式回归测试——BackstopJS篇 - laden666666

    2017-02-13 16:03

  • 前端工程自动化构建总结 - bjtqti

    前端工程自动化构建总结 - bjtqti

    2017-01-10 15:00

  • 前端自动化构建工具 - gulp - 雨夜羽翼

    前端自动化构建工具 - gulp - 雨夜羽翼

    2016-10-25 17:00

  • CYQ.Data 从入门到放弃ORM系列:开篇:自动化框架编程思维 - 路过秋天

    CYQ.Data 从入门到放弃ORM系列:开篇:自动化框架编程思维 - 路过秋

    2016-07-03 13:00

网友点评
i