xAxis

определяет поле данных, значение из которого будет отображено на горизонтальной оси

object xAxis;

Example

webix.ui({
    view:"chart",
    ...
    xAxis:{
        title: "Years",
        template: "#year#",
        lines: true
    }
});

Related samples

Details

Это свойство применимо только к диаграммам типа bar, line, area, scatter, radar.
Только атрибут 'template' является обязательным.


Атрибуты свойства xAxis различаются для разных типов диаграмм:

Если атрибуты end, start и step не заданы, они будут рассчитаны автоматически.
Однако вы можете контролировать минимальное значение шкалы, используя свойство origin. Например, если вы установите origin:0, шкала начнется с '0', даже если минимальное значение в наборе данных больше.

Атрибут 'template', заданный как функция

Функция в 'template' вызывается для каждого элемента диаграммы и принимает в качестве параметра объект элемента.

template: function(obj){
    return webix.i18n.dateFormatStr("%F")(obj.date);
    //возвращает название месяца
}

Атрибут 'lineColor', заданный как функция

Вы можете задать линиям разные цвета, если зададите lineColor как функцию.

Функция будет вызываться для каждого элемента диаграммы. Функция принимает в качестве параметра объект элемента и должна возвращать строку с кодом цвета.

lineColor:function(obj){
    return (obj.year%2 ? "#e9eef9" : "#f3f7ff"); //разные цвета линий для нечетных и четных лет
}

Атрибут 'lines', заданный как функция

Вы можете решить, какие линии показывать, если зададите lines как функцию. Мы рекомендуем так делать, если у вас много элементов и вы не хотите, чтобы диаграмма выглядела перегруженной.

Функция 'lines' будет вызываться для каждого элемента диаграммы. Функция принимает в качестве параметра объект элемента и должна возвращать true (показать линию) или false (скрыть линию).

lines:function(obj){
    return (obj.year%2 ? true : false); //скрывает линии для нечетных лет
}
See also
Наверх
If you have not checked yet, be sure to visit site of our main product Webix ui widget library and page of javascript graph library product.