TWaver - 专注UI技术

http://twaver.servasoft.com/
posts - 171, comments - 191, trackbacks - 0, articles - 2
  BlogJava :: 首页 :: 新随笔 :: 联系 :: 聚合  :: 管理

巧用TWaver 3D 矢量图形功能

Posted on 2014-10-29 10:59 TWaver 阅读(5318) 评论(1)  编辑  收藏

的确,提起TWaver,大家想到的首先是“电信拓扑图组件”。其实,由于其灵活的MVC架构、矢量化设计、方便定制等特点,TWaver可以做的还有很多。例如房地产行业常见到的“户型图”。

户型推荐是销售接待中很重要的阶段,也被称做是为客户造梦的过程,户型也是客户是否选择该楼盘的一大要素。制作漂亮的户型图在房地产行业无疑是非常重要的一项工作。

首先利用TWaver常被忽视的“矢量图形”功能,来定义房间和隔断的形状。这可以通过代码片段完成、json格式定义完成、或编辑器拖拽完成。一小段代码或json足可以定义任何复杂的矢量形状:

1twaver.Util.registerImage('room', {
2    "w": 345,
3    "h": 611,
4    //....
5});
6 
7var node = new twaver.Node();
8node.setImage('room');

户型图中,房间内部的很多元素,例如重复纹理、门窗、桌椅、家具等,均可以单独进行矢量化定义。

对于植物等不规则物体,可以混合使用位图进行补充:

1this.registerImage('plant.png');

当然,如果直接使用TWaver提供的矢量化图形设计工具,这一切就变得更加简单了。

最后,希望每一位程序员都有一套属于自己的大房子。下面这套三居室还行么?


评论

# re: 巧用TWaver 3D 矢量图形功能  回复  更多评论   

2014-11-26 15:53 by 减肥药哪种好
很实用的,设计图里经常可以用

只有注册用户登录后才能发表评论。


网站导航: