HT for Web学习笔记（2） 矢量图形

相比较直接用图片，矢量图不会在视角放大时出现失真、模糊、锯齿等问题。可用于GraphView组件上的图元图片，TreeView、TableView上的图标，甚至整个HT框架。

整体属性

矢量用JSON格式描述，通过ht.Default.setImage('name', jsonObject)进行注册,之后通过node.setImage('hightopo')和node.setIcon('hightopo')调用。

矢量JSON描述必须包含width、height和comps参数信息，以及以下这些可选参数（部分）：

• visible是否可见，默认为true
• opacity透明度，默认为1，可取值范围0~1
• color染色颜色，设置上该颜色后矢量内部绘制内容将会融合该染色值
• interactive可交互，是否响应以on开头的交互事件，默认false
• state图标默认状态，默认为空

组件属性

ht.Default.setImage('imgName', { //该括号为一个json,内容为整体属性
    width: 300,
    height: 300,
    color: 'red',                      //整体颜色，会与组件的颜色融合
    comps: [                           //组件数组
        {                              //第一个组件，内容为组件属性
            type: 'shape',             //该组件形状为 自定义形状shape
            points: points,            //点的数组
            segments: segments,        //如何使用点的segments数组
            background: '#d6f0fd',     //背景颜色
            gradientColor: '#A6f0fd',  //渐变颜色
            gradient: 'linear.north',  //渐变方式
            opacity: 0.5               //透明度
        },
        {                              //第二个组件
            type: ...
            ...
        },
        {                              //第三个组件
            type: ...
            ...
        }                              //所有这些组件所构成的内容，即'imgName'的内容                       
    ]
});

type: 常用形状rect、circle、oval、star、arc等

         自定义形状shape，须提供两个数组:

<