Перейти к содержанию

Chart#

Элемент управления, предназначенный для вывода данных в виде графиков. Настройка осуществляется с помощью специальных тэгов SeriesGroup и Series

Свойства#

denyRoles#

Список ролей без прав на данный элемент.

Отнаследовано от Control.

id#

Идентификатор контрола.

Отнаследовано от Control.

hint#

Всплывающая подсказка, которая появляется при наведении на контрол.

Отнаследовано от Control.

tags#

Позволяет объединять контролы в группы, возвращает массив имен.

Отнаследовано от Control.

captionWidth#

Ширина заголовка в колонках (для Bootstrap-верстки).

Отнаследовано от Control.

editorWidth#

Ширина контрола в колонках (для Bootstrap-верстки).

Отнаследовано от Control.

visible#

Видимость контрола.

Отнаследовано от Control.

width#

Ширина контрола.

Отнаследовано от Control.

height#

Высота контрола.

Отнаследовано от Control.

По умолчанию 600px

enabled#

Доступность контрола для редактирования.

Отнаследовано от Control.

title#

тип знач. по умолч. допустимые значения
string Title

Заглавие графиков.

description#

тип знач. по умолч. допустимые значения
string Description

Описание графиков.

colorScheme#

тип знач. по умолч. допустимые значения
string scheme01 scheme01 - scheme27

Цветовая схема. набор цветов для отображения графиков.

bind#

тип знач. по умолч. допустимые значения
string -

Свойство, к которому биндится контрол.

События#

clicked#

Событие клика мышки.

Пример#

Настройка контрола в шаблоне:

1
2
3
4
5
6
7
    <Chart editorWidth="12" title="column" id="chartBasic" bind="chartSource" height="300px" colorScheme="scheme01">
            <SeriesGroup displayValueAxis="true" unitInterval="30" type="column">
                <Series dataField="Erica" displayText="Erica"/>
                <Series dataField="Keith" displayText="Keith"/>
                <Series dataField="George" displayText="George"/>
            </SeriesGroup>
    </Chart>

Пример структуры данных для указанных выше настроек:

    static get binding () {
            return class extends DataAdapter {
                load () {
                    return $.Deferred(result => {
                        result.resolve({
                                chartSource: [
                                    { Keith: 30, Erica: 15, George: 25 },
                                    { Keith: 25, Erica: 20, George: 30 },
                                    { Keith: 12, Erica: 22, George: 20 }
                                ]
                        })
                    })
                }
        }
    }

Полезные ссылки#