HT
是基于HTML5标准的企业应用图形界面一站式解决方案, 其包含通用组件、拓扑组件和3D渲染引擎等丰富的图形界面开发类库,提供了完全基于HTML5
的矢量编辑器、拓扑编辑器及 3D场景编辑器等多套可视化设计工具,和完善的类库开发手册、工具使用手册、及针对HTML5
技术如何进行大规模团队开发的客户深度培训手册。
官网:http://www.hightopo.com/cn-index.html
运行环境:
1.现在基本的主流浏览器都已经支持HTML5,但是如果采用HT for Web 3D需要IE11以上版本。如果无法升级到IE11
,则可以考虑安装Google Chrome Frame插件, 在页面嵌入以下Tag
代码片段,该页面就会采用Chrome
来渲染。
<meta http-equiv="X-UA-Compatible" content="chrome=1">
2.部分老版本的Android
终端系统,对canvas
的支持存在bug
会出现没擦除干净有残影,以下是段workaround
代码。
ht.Default.viewListener = function(view, kind){
var canvas = view._canvas;
if(canvas && kind === 'beginValidate'){
canvas.width = 0;
canvas.height = 0;
canvas.style.width = 0;
canvas.style.height = 0;
}
};
数据模型:
1、数据类型:Data类型贯穿整个HT框架,是最基础的数据类型,在该类型下又很多方法(网址:http://www.hightopo.com/guide/guide/core/datamodel/ht-datamodel-guide.html#ref_designpattern),可以用来操作数据。
Data是ht的一个对象类,使用方法可以如下所示:
var data = new ht.Data();
data.setName(name);
data.setIcon(icon);
data.setParent(parent); // or parent.addChild(data);
dataModel.add(data); //dataModel是数据容器,数据需要添加到容器内才能承载。
return data;
2、数据容器:数据容器ht.DataModel
(以下简称DataModel
)作为承载Data
数据的模型,管理着Data
数据的增删以及变化事件派发, HT
框架所有组件都是通过绑定DataModel
,以不同的形式呈现到用户界面;同时组件也会监听DataModel
模型的变化事件, 实时同步更新界面数据信息,掌握了DataModel
的操作就掌握了所有组件的模型驱动方式。
3、选择模型:ht.SelectionModel
管理DataModel
模型中Data
对象的选择状态, 每个DataModel
对象都内置一个SelectionModel
选择模型,控制这个SelectionModel
即可控制所有绑定该DataModel
的组件的对象选择状态, 这意味着共享同一DataModel
的组件默认就具有选中联动功能。
综上所述有两种途径可得到SelectionModel
:
dataModel.getSelectionModel()
获取数据容器中组件共享的选中模型。view.getSelectionModel()
获取当前组件使用的选中模型,selectionModelShared
为false
时,返回view
专用的选择模型。