指标通用属性


指标通用属性是平台提供的一个简易方式来实现设计模式下指标属性编辑的特性支持。

var property = {
        name: 'eBarProperty',
        config: "property",
        option: [].concat([
                {
                    group: '其他',
                    id: 'b757a938-727f-4026-9d96-22c86e4ccb18',
                    name: '背景色',
                    enable: false,
                    type: 'color',
                    value: 'transparent',
                    default: 'transparent',
                    link: 'backgroundColor',
                    tooltip: '背景色,如需透明请填写:transparent'
                },
                {
                    group: '其他',
                    id: 'c879c3a7-c1ad-4058-8745-055aad9d137c',
                    name: 'Y轴分割线',
                    enable: false,
                    type: 'checked',
                    value: true,
                    default: true,
                    tooltip: '是否显示Y轴分割线',
                    link: function (option) {
                        var _this = this;
                        if (_this.enable && $.isArray(option.yAxis)) {
                            _.each(option.yAxis, function (yAxis) {
                                Util.setOption("splitLine.show", _this.value, yAxis);
                            });
                        }
                    }
                },
                {
                    group: '事件',
                    id: '6122971c-a8f3-4a02-a497-e4e3e351bb1c',
                    name: '序列点击事件',
                    enable: true,
                    type: 'pivotEvent',
                    value: {
                        Event:"SeriesClick",
                        Params:[
                            {Value:"SeriesName",Name:"序列名称"},
                            {Value:"Dimension",Name:"序列维度值"},
                            {Value:"Measure",Name:"序列度量值"}
                        ]
                    },
                    tooltip: '序列点击事件,钻取设置'
                })
}

为了支持此特性,需要满足如下要求:

  • 指标核心定义AMD导出对象需包含property属性。
  • Property属性需包含 config: "property",且option为属性描述 数组
  • option属性描述数组中描述规则需遵循如下格式:
group: 属性分组,
id: 属性ID,要求唯一,且不得随意修改,
name: 属性名称,
enable: 是否启用,
type: 属性类型,
value: 属性值,
default: 属性默认值,
link: 链接字符串/函数,
tooltip: 提示信息
  • 属性描述目前支持的类型有 text、textarea、script、style、checked、select、list、color、colors、number、date、padding、resource、textbinding、seriesbinding、sortbinding、group、pivotEvent
  • 属性描述 group 类型为分组类型,支持内部嵌套其他类型,目前仅支持一层嵌套。
  • 属性描述下的link属性为链接参数,支持字符串与函数两种方式。当为字符串时,会在指标插件渲染时,将value值自动赋予指标参数的Option下的对应属性,支持"."操作,如:link 为 'title.text' 则赋值到 Option.title.text = 'value'。当为函数时,则可通过复杂的运算进行赋值操作,如上代码的 Y轴分割线 属性描述,传入参数 option 为 指标参数的Option 引用对象。

下面为常用属性的示例代码:

var property = {
    name: '自动属性演示',
    config: "property",
    option: [
        {
            group: '基础',
            id: '01',
            name: '文本标签(type=text)',
            enable: true,
            type: 'text',
            value: 'content',
            default: 'content',
            link: '连接属性,同时支持function函数',
            tooltip: '字段说明:<br/>属性类型:text<br/>赋值类型:字符<br/>赋值名称:value'
        },
        {
            group: '基础',
            id: '013333',
            name: '多行文本标签(type=textarea)',
            enable: true,
            type: 'textarea',
            value: 'content',
            default: 'content',
            link: '连接属性,同时支持function函数',
            tooltip: '字段说明:<br/>属性类型:textarea<br/>赋值类型:字符<br/>赋值名称:value'
        },
        {
            group: '基础',
            id: '02',
            name: '复选框(type=checked)',
            enable: true,
            type: 'checked',
            value: true,
            default: true,
            link: '连接属性,同时支持function函数',
            tooltip: '字段说明:<br/>属性类型:checked<br/>赋值类型:布尔<br/>赋值名称:value'
        },
        {
            group: '基础',
            id: '041',
            name: '多选集合(type=list)',
            enable: true,
            type: 'list',
            value: [],
            default: [],
            data: [{
                value: '0',
                text: '数据A'
            },
                {
                    value: '1',
                    text: '数据B'
                },
                {
                    value: '2',
                    text: '数据C'
                }],
            link: '连接属性,同时支持function函数',
            tooltip: '字段说明:<br/>属性类型:list<br/>赋值类型:字符集合<br/>赋值名称:value'
        },
        {
            group: '基础',
            id: '03',
            name: '下拉框(type=select)',
            enable: true,
            type: 'select',
            value: '0',
            default: '0',
            data: [
                {
                    value: '0',
                    text: '数据A'
                },
                {
                    value: '1',
                    text: '数据B'
                },
                {
                    value: '2',
                    text: '数据C'
                }
            ],
            link: '连接属性,同时支持function函数',
            tooltip: '字段说明:<br/>属性类型:select<br/>赋值类型:字符(对象value值)<br/>赋值名称:value<br/>元数据:data(对象数组)'
        },
        {
            group: '基础',
            id: '04',
            name: '颜色选择(type=color)',
            enable: true,
            type: 'color',
            value: '#FFFFFF',
            default: '#FFFFFF',
            link: '连接属性,同时支持function函数',
            tooltip: '字段说明:<br/>属性类型:color<br/>赋值类型:字符(HTML颜色值)<br/>赋值名称:value'
        },
        {
            group: '基础',
            id: '05',
            name: '颜色序列(type=colors)',
            enable: true,
            type: 'colors',
            value: [],
            default: [],
            data: [
                '#FE8463', '#9BCA63', '#FAD860', '#60C0DD', '#0084C6',
                '#D7504B', '#C6E579', '#26C0C0', '#F0805A', '#F4E001',
                '#B5C334'
            ],
            link: '连接属性,同时支持function函数',
            tooltip: '字段说明:<br/>属性类型:colors<br/>赋值类型:数组(HTML颜色值数组)<br/>赋值名称:value<br/>默认数据:data(HTML颜色值数组)'
        },
        {
            group: '基础',
            id: '06',
            name: '日期选择(type=date)',
            enable: true,
            type: 'date',
            value: new Date(),
            default: new Date(),
            link: '连接属性,同时支持function函数',
            tooltip: '字段说明:<br/>属性类型:date<br/>赋值类型:时间对象<br/>赋值名称:value'
        },
        {
            group: '基础',
            id: '0011',
            name: '资源选择(type=resource)',
            enable: true,
            type: 'resource',
            value: '',
            default: '',
            link: '连接属性,同时支持function函数',
            tooltip: '字段说明:<br/>属性类型:resource<br/>赋值类型:字符<br/>赋值名称:value'
        },
        {
            group: '基础',
            id: '07',
            name: '数值选择(type=number)',
            enable: true,
            type: 'number',
            value: 10,
            default: 10,
            link: '连接属性,同时支持function函数',
            tooltip: '字段说明:<br/>属性类型:number<br/>赋值类型:数值<br/>赋值名称:value'
        },
        {
            group: '基础',
            id: '0777',
            name: 'Padding/Margin选择(type=padding)',
            enable: true,
            type: 'padding',
            value: [0,0,0,0],
            default: [0,0,0,0],
            link: '连接属性,同时支持function函数',
            tooltip: '字段说明:<br/>属性类型:padding<br/>赋值类型:Padding/Margin 数值数组<br/>赋值名称:value'
        },
        {
            group: '基础',
            id: '08',
            name: '序列绑定(type=seriesBinding)',
            enable: true,
            type: 'seriesBinding',
            dataset: '',
            dimension: {},
            measure: {},
            link: '连接属性,同时支持function函数',
            tooltip: '字段说明:<br/>属性类型:seriesBinding<br/>赋值类型:对象<br/>赋值名称:dataset,dimension,measure(数据集编码,维度绑定对象,度量绑定对象)<br/>绑定对象格式:{ColumnCaption: 字段标题, ColumnCode: 字段编码, ColumnName: 数据列名称}'
        },
        {
            group: '基础',
            id: '081',
            name: '文本绑定(type=textBinding)',
            enable: true,
            type: 'textBinding',
            dataset: '',
            ctype: 'all',//列类型,支持 all,dimension,measure
            column: {},
            link: '连接属性,同时支持function函数',
            tooltip: '字段说明:<br/>属性类型:textBinding<br/>赋值类型:对象<br/>赋值名称:dataset,column(数据集编码,列绑定对象)<br/>绑定对象格式:{ColumnCaption: 字段标题, ColumnCode: 字段编码, ColumnName: 数据列名称}'
        },
        {
            group: '基础',
            id: '09',
            name: '排序绑定(type=sortBinding)',
            enable: true,
            type: 'sortBinding',
            dataset: '',
            columns: [],
            link: '连接属性,同时支持function函数',
            tooltip: '字段说明:<br/>属性类型:sortBinding<br/>赋值类型:对象数组<br/>赋值名称:dataset,columns(数据集编码,列绑定对象数组)<br/>绑定对象格式:{ColumnCaption: 字段标题, ColumnCode: 字段编码, ColumnName: 数据列名称}'
        },
        {
            group: '事件',
            id: '09999',
            name: '绑定时间(type=event)',
            enable: true,
            type: 'pivotEvent',
            value: {
                Event:"SeriesClick",
                Params:[
                    {Value:"SeriesName",Name:"序列名称"},
                    {Value:"Dimension",Name:"序列维度值"},
                    {Value:"Measure",Name:"序列度量值"}
                ]
            },
            tooltip: '字段说明:<br/>属性类型:pivotEvent,用于指标事件逻辑'
        },
        {
            group: '高级',
            id: '10',
            name: '分组控件(type=group)',
            type: 'group',
            items: [],
            option: [
                {
                    id: '0901',
                    name: '文本标签(type=text)',
                    enable: true,
                    type: 'text',
                    value: 'content',
                    default: 'content',
                    link: '连接属性',
                    tooltip: '参见外部描述'
                },
                {
                    id: '0902',
                    name: '序列绑定(type=seriesBinding)',
                    enable: true,
                    type: 'seriesBinding',
                    dataset: '',
                    dimension: {},
                    measure: {},
                    link: '连接属性',
                    tooltip: '参见外部描述'
                }
            ],
            link: '连接属性',
            tooltip: '字段说明:<br/>分组控件,支持动态扩展,内部可增加支持的类型属性'
        },
        {
            group: '高级2',
            id: '20',
            name: '分组控件(type=group)',
            type: 'group',
            items: [],
            option: [
                {
                    id: '1101',
                    name: '文本标签(type=text)',
                    enable: true,
                    type: 'text',
                    value: 'content',
                    default: 'content',
                    link: function (option) {
                        log.debug("Group Inner Link Function");
                        log.debug(option);
                    },
                    tooltip: '参见外部描述'
                },
                {
                    id: '1102',
                    name: '序列绑定(type=seriesBinding)',
                    enable: true,
                    type: 'seriesBinding',
                    dataset: '',
                    dimension: {},
                    measure: {},
                    link: function (option) {
                        log.debug("Group Inner Link Function");
                        log.debug(option);
                    },
                    tooltip: '参见外部描述'
                }
            ],
            link: function (option) {
                log.debug("Group Link Function");
                log.debug(option);
            },
            tooltip: '字段说明:<br/>分组控件,支持动态扩展,内部可增加支持的类型属性'
        }
    ],
    MapOption: function (option) {
        Util.linkOption(this.option, option);
    }
};

results matching ""

    No results matching ""