Пользовательские шаблоны диаграмм

Прикладным разработчикам доступно использование пользовательских шаблонов диаграмм в веб-приложении. Пользовательский шаблон меняет форму всех рядов данных диаграммы, используя шаблон, написанный в формате *.svg. Файл шаблона должен соответствовать определенной структуре, состоящей из стандартной SVG-разметки и дополнительных атрибутов «Форсайт. Аналитическая платформа».

Примечание. Использование пользовательских шаблонов доступно для следующих типов диаграмм: гистограмма, круговая диаграмма.

Для подключения пользовательских шаблонов:

  1. Создайте папку, в которой будут храниться файлы шаблонов, в папке веб-приложения, например, C:\Program Files (x86)\Foresight\Foresight Analytics Platform 9 Web Application\plugins\templates\.

  2. Переместите файлы шаблонов в формате *.svg в созданную папку.

  3. Создайте плагин ChartTemplates.js с параметрами используемых шаблонов в папке C:\Program Files (x86)\Foresight\Foresight Analytics Platform 9 Web Application\plugins\:

PP.ChartTemplates = function (settings) {
    PP.ChartTemplates.base.constructor.apply(this, arguments);
    this._Interfaces = [];
};
PP.initClass(PP.ChartTemplates, PP.Object, 'PP.ChartTemplates', [PP.IPlugin]);
PP.Object.defineProps(PP.ChartTemplates, ['Interfaces', 'ImagePath'], false);
PP.ChartTemplates.prototype._ImagePath = PP.ImagePath;
PP.ChartTemplates.prototype.getInstance = function () {
    return null;
};
PP.ChartTemplates.init = function (settings) {
    var t = new PP.ChartTemplates(settings);
    var templates = PP.Ui.getConfig().getChart().getTemplates();
    var newTemplates = {
        '<наименование шаблона>': {
            'Id': '<уникальный идентификатор шаблона>',
            'PPType': '<тип диаграммы>',
            // Метод getImagePath возвращает относительный путь до файлов шаблонов,
            // заданный в атрибуте value раздела <param> в шаге 4. Если файл шаблона 
            // содержится в отдельной вложенной папке, то укажите её перед 
            // подстановкой <наименование файла шаблона>
            'Source': t.getImagePath() + '<наименование файла шаблона>.svg'
        },
        // Добавьте несколько шаблонов
        ...
    };
    for (var i = 0, nt; i < templates.length; i++) {
        if (nt = newTemplates[PP.getProperty(templates[i], 'Id')]) {
            templates[i] = nt;
            delete newTemplates[nt.Id];
        }
    }
    for (var c in newTemplates)
        templates.push(newTemplates[c]);
    PP.Ui.getConfig().getChart().setTemplates(templates);
    return t;
};

Примечание. Значения, заданные в подстановках <наименование шаблона> и <уникальный идентификатор шаблона>, могут совпадать и соответствовать наименованию файла шаблона.

В подстановке <тип диаграммы> задайте одно из значений:

  1. Добавьте описание плагина в файле PP.xml в разделе <plugins>:

<plugins>
    // Задайте относительный путь до плагина ChartTemplates.js в атрибуте path
    <plugin name="ChartTemplates" path="../plugins/ChartTemplates.js" loaded="true">
        <params>
            // Задайте относительный путь до файлов шаблонов в атрибуте value
            <param name="ImagePath" value="../plugins/templates/"/>
        </params>
    </plugin>
</plugins>

После выполнения действий пользовательские шаблоны будут подключены в веб-приложение в раскрывающемся меню кнопки «Стили» на вкладке «Диаграмма» ленты инструментов.

Пример подключения пользовательских шаблонов

Для выполнения примера скачайте архив plugins.zip с набором готовых шаблонов и разархивируйте его в корневой папке веб-приложения C:\Program Files (x86)\Foresight\Foresight Analytics Platform 9 Web Application\.

Добавьте описание плагина в файле PP.xml в разделе <plugins>:

<plugins>
    <plugin name="ChartTemplates" path="../plugins/ChartTemplates.js" loaded="true">
        <params>
            <param name="ImagePath" value="../plugins/templates/"/>
        </params>
    </plugin>
</plugins>

После выполнения действий пользовательские шаблоны из архива будут подключены в веб-приложение в раскрывающемся меню кнопки «Стили» на вкладке «Диаграмма» ленты инструментов:

При выборе пользовательского шаблона отображение рядов диаграммы будет изменено, например:

См. также:

Настройка компонентов диаграммы