views

модуль для работы с компонентами поверх ячеек

Example

ssheet.views.add(750,50,"chart","B2:E7",
    {type:"line", legend:1, xAxis:1, width:550, height:400}
);

Related samples

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

У модуля views есть несколько методов для работы с компонентами поверх ячеек:

register()

Используется для регистрации пользовательского типа компонента. Метод принимает следующие параметры:

• type (string) - тип компонента
• render (function) - функция, которая вызывается при отрисовке компонента. Принимает следующие параметры:
  • node (object) - Webix window, в котором будет отрисован компонент
  • config (object) - объект с конфигурационными параметрами компонента
  • data (array) - JSON данные для парсинга.
• track (function) - функция срабатывает при любом изменении в Spreadsheet. Принимает следующие параметры:
  • view (object) - экземпляр компонента
  • data (array) - JSON данные для парсинга.

add()

Добавляет доступный компонент (встроенный или пользовательский) в Spreadsheet. Метод принимает следующие параметры:

• x (number) - горизонтальная позиция
• y (number) - вертикальная позиция
• type (string) - тип компонента ("chart" или "image')
• data (string) - данные для компонента, а именно:
  • диапазон ячеек вида "B3:C7" или именованный диапазон
  • (для изображений) ссылка на изображение или base64-строка для этого.

• config (object) - объект со следующими свойствами:

  Общие свойства:

  • width (number) - ширина компонента
  • height (height) - высота компонента.

  Специфичные для чарта свойства:

  • type (string) - тип чарта
  • dataSeries (string) - получает данные из столбцов/рядов (по умолчанию'columns')
  • series (array) - an array of series objects. Each object represents a series and contains the following fields:
    • tooltip (number, boolean) - defines whether to show a tooltip when a series marker is hovered over.
    • label (number, boolean) - defines whether to show labels above the markers. The parameter does not work for the Spline Area and Area types. Use this property instead of pieInnerText for Pie charts.
    • marker (string) - defines markers type (shape). "triangle", "square", "diamond"; "round" by default. The parameter does not work for the Spline Area, Area, and Bar types.
    • range (string) - defines a data source for the series. For example, "C2:C7"
    • color (string) - defines a color for the series. For example, "#03a1fc".
  • xAxis (boolean|object):
    • boolean - в случае true, использует данные левого столбца в качестве оси X.
    • object - объект со следующими свойствами:
      • fromData (boolean) - в случае true, использует данные левого столбца / верхнего ряда (зависит от dataFrom) в качестве оси X
      • title (string) - заголовок оси X
      • range (string) - диапазон ячеек (например, "C3:C7") для оси Х.
  • yAxis (object) - объект со следующими свойствами:
    • title (string) - заголовок оси Y
      • origin (number) - начальное значение шкалы по оси Y
    • start (number) - минимальное значение шкалы по оси Y
    • end (number) - максимальное значение шкалы по оси Y
    • step (number) - шаг значений шкалы по оси Y.
  • legend (boolean|object):
    • boolean - в случае true, использует данные верхнего ряда в качестве легенды.
    • object - объект со следующими свойствами:
      • fromData (boolean) - в случае true, использует данные левого столбца / верхнего ряда (зависит от dataFrom) в качестве легенды
      • align (string) - горизонтальное выравнивание блока ("right", "left", "center" по умолчанию)
      • valign (string) - вертикальное выравнивание блока ("top", "middle", "bottom" по умолчанию)
      • range (string) - использует диапазон ячеек (например, "C3:C7") в качестве легенды.
  • scale (object) - объект со следующими свойствами:
    • lines (boolean) - в случае false, линии масштаба скрыты
    • circle (boolean) - форма внешней рамки у области (для типа "radar").
    • color (string) - цвет линий.
  • 3D (boolean) - включает 3D чарт (для типа pie)
  • stacked (boolean) - задаёт "stacked" чарту (для чартов bar и area).

Метод возвращает ID созданного компонента.

remove()

Удаляет компонент из Spreadsheet. Принимает следующий параметр:

• id (string) - ID компонента.

get()

Возвращает компонент. Принимает следующий параметр:

• id (string) - ID компонента.

Метод возвращает экземпляр компонента.

getConfig()

Метод возвращает объект с настроками компонента.

• id (string) - ID компонента.

update()

Обновляет компонент. Принимает следующие параметры:

• id (number) - id компонента
• data (string, array) - данные для компонента, диапазон ячеек или JSarray
• config (object) - объект со свойствами, описанными в методе add().

highlight(id)

Метод перемещает фокус на указанный компонент.

• id (string) - ID компонента.

Наверх