tooltip

задает тултип, который появится при наведении курсора на элемент

Example

// задание тултипа строкой
webix.ui({
    view:"list",
    tooltip:"Rating: #rating#<br/> Votes: #votes#",
    // ...
});
 
// задание тултипа функцией
webix.ui({
    view:"dataview",
    template:"#title#",
    tooltip:function(obj){
        return "Rating: " + obj.rating + "<br/> Votes: " + obj.votes;
    },
    data:grid_data
});
 
// включение тултипа по умолчанию для DataTable
webix.ui({
    view:"datatable",
    tooltip:true,
    columns:[
        { id:"name", header:"Name" },
        { id:"age", header:"Age" }
    ],
    data:[
        { id:1, name:"Ann", age:25 },
        { id:2, name:"Tom", age:27 }
    ]
});
 
// тултип, заданный как объект с настройками
webix.ui({
    view:"chart", type:"bar",
    value:"#sales#",
    label:"#sales#",
    tooltip:{
        template:"#sales#", 
        dx:10, dy:20,
        delay: 100
    },
    data: [
        { id:1, sales:20, year:"02" },
        { id:2, sales:55, year:"03" },
        { id:3, sales:40, year:"04" },
        { id:4, sales:78, year:"05" }
    ]
});

Related samples

В первом примере в template тултипа передаются значения из элементов данных (читайте подробности).

Во втором примере тултипы определяются функцией, которая получает в качестве параметра объекты с данными.

В третьем примере для datatable включен тултип по умолчанию (см. подробности по Datatable тултипу).

В четвертом примере тултип задается как объект с настройками. Template тултипа можно задавать строкой или функцией.

В Webix есть также компонент Tooltip.

Наверх