levis/help365
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
koziavin
2025-05-26 16:15:30 +04:00
commit a6b05d6789
6059 changed files with 495628 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

321
platform/chart.html Normal file
View File

@ -0,0 +1,321 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<title>График</title>
<meta name="generator" content="Help+Manual" />
<meta name="keywords" content="«Примеры использования графика»,Прилоежние" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Виджет отображает данные в виде графика. В качестве источника данных можно выбрать:" />
<meta name="picture" content="" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Cправка по Low-code платформе ELMA365" />
<meta property="og:url" content="https://elma365.com/ru/help" />
<meta property="og:image" content="" />
<meta property="og:site_name" content="ELMA365" />
<link rel="icon" href="favicon.png" type="image/png" />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="./jquery-ui.min.css" />
<link rel="stylesheet" href="default.css" />
<link rel="stylesheet" href="./search-yandex.css" />
<link rel="stylesheet" href="./article.css" />
<link rel="stylesheet" href="./glossary.css" />
<link rel="stylesheet" href="./theme.css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="helpman_settings.js"></script>
<script type="text/javascript" src="helpman_topicinit.js"></script>
<script type="text/javascript" src="highlight.js"></script>
<script type="text/javascript">
$(document).ready(function(){highlight();});
</script>
</head>
<body>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-M6ETBEC1R9"></script><script>window.dataLayer=window.dataLayer || []; function gtag(){dataLayer.push(arguments);}gtag('js', new Date()); gtag('config', 'G-M6ETBEC1R9');</script>
<script>!function(e,t,c,n,r,a,m){e.ym=e.ym||function(){(e.ym.a=e.ym.a||[]).push(arguments)},e.ym.l=1*new Date;for(var s=0;s<document.scripts.length;s++)if(document.scripts[s].src===n)return;a=t.createElement(c),m=t.getElementsByTagName(c)[0],a.async=1,a.src=n,m.parentNode.insertBefore(a,m)}(window,document,"script","https://mc.yandex.ru/metrika/tag.js"),ym(83179930,"init",{clickmap:!0,trackLinks:!0,accurateTrackBounce:!0,webvisor:!0})</script><noscript><div><img alt=""src=https://mc.yandex.ru/watch/83179930 style=position:absolute;left:-9999px></div></noscript>
<header class="header elma-365">
<div class="container">
<a class="header__logo" href="https://elma365.com/ru/help">
<img src="./logo.svg" alt="header logo">
</a>
<!-- <div class="hero__search-form" id="search-panel">
<form class="search-form" onsubmit="ym(83179930,'reachGoal','poisk')">
<label class="search-form__label">
<span id="reset-search" class="search__icon"></span>
<input class="search-form__input" type="text">
</label>
<input class="search-form__submit" type="submit" value="Submit">
</form>
</div> -->
<div class="hero__search-form" id="search-panel"> <form class="search-form"> <label class="search-form__label"> <span id="reset-search" class="search__icon"></span> <input class="search-form__input" type="text"> </label> <input class="search-form__submit" type="submit" value="Submit"> </form> </div>
<div class="hero__search">
<a href="#" id="search-icon" class="hero__search-icon">
<img src="search-icon-white.svg" alt="search string">
</a>
<a href="#" id="side-menu-icon" class="hero__side-icon">
<img src="side_menu.svg" alt="side menu">
</a>
</div>
<div class="header__navi">
<ul class="header__list"><li><span class="solution-select"><span class="solution-select__selected"></span><svg width="7" height="4" viewBox="0 0 7 4" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1L3.5 3.5L6 1" stroke="white" stroke-linecap="round" stroke-linejoin="round"/></svg><ul class="solution-select__list"><li><a class="project-link" href="https://elma365.com/ru/help/platform/get-trial.html">Платформа</a></li><li><a class="project-link" href="https://elma365.com/ru/help/ecm/ecm-functions.html">ECM</a></li><li><a class="project-link" href="https://elma365.com/ru/help/crm/crm_overview.html">CRM</a></li><li><a class="project-link" href="https://elma365.com/ru/help/service/service-functions.html">Service</a></li><li><a class="project-link" href="https://elma365.com/ru/help/projects/projects-functions.html">Проекты</a></li><li><a class="project-link" href="https://elma365.com/ru/help/business_solutions/-elma365-store.html">Бизнес-решения</a></li></ul></span></li><li><a href="https://api.elma365.com/ru/"target="_blank">API</a></li><li><a href="https://tssdk.elma365.com/"target="_blank">SDK</a></li><li><a href="https://community.elma365.com/" target="_blank">Community</a></li><li><a href="https://elma-academy.com/ru/" target="_blank">Академия</a></li><li><a href="https://elma365.com/ru/" target="_blank">Сайт ELMA365</a></li></ul>
</div>
</div>
</header>
<main class="main container">
<aside class="sidebar" id="sidebar">
<div class="sidebar__header">
<a class="header__logo" href="https://elma365.com/ru/help">
<img src="./logo-light.svg">
</a>
<span class="sidebar__close elma-365-close" id="close"></span>
</div>
<div class="sidebar__wrapper" id="side-menu">
</div>
</aside>
<article class="article" id="article">
<div class="article-inner">
<div class="content">
<header class="article__header">
<div class="article__bread" style="display:flex; gap:10px;">
<span id="subcategory" class="search-res__item-category search-res__item-category_subcategory subcategory article__badge"></span>
<div class="topic__breadcrumbs">
<p>Low-code дизайнер &gt; <a href="interface_settings.html">Создание интерфейсов</a> &gt; Типы виджетов &gt; Виджеты отчётов / График</p>
</div>
</div>
<div class="topic__title"><h1 class="p_Heading1"><span class="f_Heading1">График</span></h1>
</div>
</header>
<section class="article__content">
<div class="scroll-top-inner">
<a href="#h1-article" class="scroll-top"></a>
</div>
<!-- Placeholder for topic body. -->
<p style="margin: 0 0 11px 0;">Виджет отображает данные в виде графика. В качестве источника данных можно выбрать:</p>
<ul style="list-style-type:disc">
<li style="margin-top: 0; margin-right: 0; margin-bottom: 11px;">приложение из любого раздела;</li><li style="margin-top: 0; margin-right: 0; margin-bottom: 11px;">переменную типа <a href="360010201779.html" class="topiclink">Таблица</a>, созданную в <span style="color: #0000ff;"><a href="context_types.html#widget-context" class="topiclink">контексте страницы</a></span>, на которой размещается график;</li><li style="margin-top: 0; margin-right: 0; margin-bottom: 11px;">компонент системы <a href="report.html" class="topiclink">Отчет</a>, который собирает информацию из нескольких приложений</li><li style="margin-top: 0; margin-right: 0; margin-bottom: 11px;">компонент <a href="business-process-metrics.html" class="topiclink">Показатель</a>, с помощью которого можно выявить эффективность выполнения определённых этапов бизнес-процесса. </li></ul>
<p style="margin: 0 0 11px 0;">Например, с помощью виджета вы можете построить линейную диаграмму годового дохода компании или на круговом графике показать вклад каждого менеджера в общий объём продаж. </p>
<h2 class="p_Heading2"><a id="settings" class="hmanchor"></a><span class="f_Heading2">Создание графика</span></h2>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Чтобы настроить виджет, откройте <a href="360009918011.html" class="topiclink">форму приложения</a> или <a href="360027211631.html" class="topiclink">страницу</a> в <a href="interface_designer.html" class="topiclink">дизайнере интерфейсов</a>. Перетащите виджет <span style="font-weight: bold;">График</span> с правой панели на поле для моделирования или нажмите кнопку <span style="font-weight: bold;">+ Виджет</span>. Откроется окно настроек.</p>
<h3 class="p_Heading3"><span class="f_Heading3">Вкладка «График»</span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Укажите общие настройки графика:</p>
<ol style="list-style-type:upper-roman">
<li value="1" class="p_Normal">В поле <span style="font-weight: bold;">Источник данных</span> выберите, какие данные вы хотите просматривать в виде графика:</li></ol>
<p class="p_Normal" style="margin: 0 0 0 34px;"><img alt="widget-chart-1" width="676" height="410" style="margin:0;width:676px;height:410px;border:none" src="widget-chart-1.png"/></p>
<ul style="list-style-type:disc">
<li style="margin-top: 7px; margin-right: 0; margin-bottom: 7px;"><span style="font-weight: bold;">Приложение</span> — включите опцию, чтобы выбрать любое приложение и построить график по его данным. Ознакомьтесь с примером настройки графика в разделе <a href="chart.html#use-cases" class="topiclink">«Данные из приложения»</a>; </li><li style="margin-top: 7px; margin-right: 0; margin-bottom: 7px;"><span style="font-weight: bold;">Таблица</span> — опция доступна при размещении виджета на отдельной странице. Отметьте её, а затем укажите переменную типа <a href="360010201779.html" class="topiclink">Таблица</a> из <a href="context_types.html#widget-context" class="topiclink">контекста страницы</a>. График строится на основании данных из таблицы. Пример настройки графика приведён в разделе <a href="chart.html#group-by-several-indicators" class="topiclink">«Примеры использования графика»</a>;</li><li style="margin-top: 7px; margin-right: 0; margin-bottom: 7px;"><span style="font-weight: bold;">Отчет</span> — включите опцию, чтобы выбрать созданный отчёт, агрегирующий данные из нескольких приложений. Посмотрите пример настройки графика в разделе <a href="chart.html#use-report" class="topiclink">«Примеры использования графика»</a>;</li><li style="margin-top: 7px; margin-right: 0; margin-bottom: 7px;"><span style="font-weight: bold;">Показатель</span> — включите опцию и выберите опубликованный показатель, который применяется в бизнес-процессе для отслеживания данных. С примером настройки графика можно ознакомиться в разделе <a href="chart.html#use-process-metrics" class="topiclink">«Данные показателя процесса»</a>.</li></ul>
<ol style="list-style-type:upper-roman" start="2">
<li value="2">Укажите настройки графика:</li></ol>
<p style="margin: 0 0 0 34px;"><img alt="widget-chart-2" width="910" height="762" style="margin:0;width:910px;height:762px;border:none" src="widget-chart-2.png"/></p>
<ul style="list-style-type:disc">
<li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Измерение</span> — выберите поле, по которому необходимо построить график. Если указать свойство типа <a href="360009707032.html#category" class="topiclink">Категория</a>, график сформируется по заданным в свойстве вариантам.</li></ul>
<p style="line-height: 1.28; margin: 0 0 11px 34px;">Обратите внимание на особенности использования свойства типа <a href="360009707032.html#app" class="topiclink">Приложение</a> в качестве параметра измерения: </p>
<ul style="list-style-type:disc"><ul style="list-style-type:circle">
<li style="margin-top: 0; margin-right: 0; margin-bottom: 11px;">источник графика <span style="font-weight: bold;">Приложение</span> — если на форме есть поле типа <span style="font-weight: bold;">Приложение</span>, параметром измерения можно указать вложенные свойства этого приложения, но не ссылку на определённый элемент. Например, в сделке присутствует запись связанного с ней контакта. Вы можете выбрать любое поле из контекста приложения <span style="font-weight: bold;">Контакты</span> и построить по нему график;</li><li style="margin-top: 0; margin-right: 0; margin-bottom: 11px;">источник графика <span style="font-weight: bold;">Отчет</span> — в качестве параметра измерения можно использовать колонку отчёта, созданную из поля типа <span style="font-weight: bold;">Приложение</span>. В этом случае в графике будет отображаться название связанного элемента. Например, в отчёте из контекста заказа в виде колонки добавлена компания‑заказчик. Вы можете выбрать эту колонку и отображать в графике название компании;</li></ul></li></ul>
<ul style="list-style-type:disc">
<li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Показатель</span> — <span style="font-size: 13px; font-family: Inter;">выберите показатель,</span> по которому будет строиться график. <span style="font-size: 13px; font-family: Inter;">Укажите значение </span><span style="font-size: 13px; font-family: Inter; font-weight: bold;">Количество</span><span style="font-size: 13px; font-family: Inter;"> или свойство типа</span> <a href="360009707032.html#number" class="topiclink">Число</a>, <a href="360009707032.html#money" class="topiclink">Деньги</a>. <span style="font-size: 13px; font-family: Inter;">В зависимости от источника данных для выбора доступны: для приложения свойства из его контекста, для таблицы — её колонки, для отчёта — колонки таблицы, в которой агрегированы данные.</span></li></ul>
<p style="line-height: 1.28; margin: 0 0 11px 34px;"><span style="font-size: 13px; font-family: Inter;">После выбора свойства напротив его названия укажите</span> параметр для построения графика: значение поля, сумму значений или минимальное, максимальное, среднее значение. Обратите внимание, если в поле <span style="font-weight: bold;">Измерение</span> выбрано свойство типа <span style="font-weight: bold;">Дата</span>, в качестве параметра для показателя нельзя указать опцию <span style="font-weight: bold;">Значение</span>;</p>
<ul style="list-style-type:disc"><ul style="list-style-type:circle">
<li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Дополнительный показатель (Ось Y)</span> — для линейных графиков укажите дополнительный показатель, который будет отображаться на оси Y;</li></ul></li></ul>
<ul style="list-style-type:disc">
<li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><a id="conversion" class="hmanchor"></a><span style="font-size: 15px; font-family: Inter; font-weight: bold;">Тип расчета</span><span style="font-size: 15px; font-family: Inter;"> — настройка появляется, если в качестве измерения выбрано поле </span><span style="font-size: 15px; font-family: Inter; font-weight: bold;">Статус</span><span style="font-size: 15px; font-family: Inter;">, в качестве показателя — </span><span style="font-size: 15px; font-family: Inter; font-weight: bold;">Количество</span><span style="font-size: 15px; font-family: Inter;">:</span><ul style="list-style-type:circle">
<li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-size: 15px; font-family: Inter; font-weight: bold;">Количество элементов </span><span style="font-size: 15px; font-family: Inter;">— показывается количество элементов, находящихся в каждом статусе;</span></li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-size: 15px; font-family: Inter; font-weight: bold;">Конверсия элементов</span><span style="font-size: 15px; font-family: Inter;">, </span><span style="font-size: 15px; font-family: Inter; font-weight: bold;">Конверсия элементов (продажи) </span><span style="font-size: 15px; font-family: Inter;">— отображается соотношение количества элементов, прошедших через каждый статус. Подробнее о настройке графиков по конверсии элементов читайте в статье </span><span style="font-size: 15px; font-family: Inter; color: #0563c1;"><a href="/ru/help/crm/closing_ratio.html" target="_blank" class="weblink">«Конверсия сделок и лидов»</a></span><span style="font-size: 15px; font-family: Inter;">.</span></li></ul>
<li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-size: 15px; font-family: Inter; font-weight: bold;">Представление данных</span><span style="font-size: 15px; font-family: Inter;"> — выберите, как отображать значения по показателю графика:</span><ul style="list-style-type:circle">
<li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-size: 15px; font-family: Inter; font-weight: bold;">Единицы </span><span style="font-size: 15px; font-family: Inter;">— как число, например, как количество элементов или сумму;</span></li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-size: 15px; font-family: Inter; font-weight: bold;">Проценты </span><span style="font-size: 15px; font-family: Inter;">— как процент, например, как долю от общего количества элементов или общей суммы.</span></li></ul>
<li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-size: 15px; font-family: Inter; font-weight: bold;">Сортировка по показателю</span><span style="font-size: 15px; font-family: Inter;"> — по умолчанию в графике используется сортировка по значениям параметра измерения, например, по названию компании или статусу. Вы можете сделать основной сортировку по показателю, выбрав в поле </span><span style="font-size: 15px; font-family: Inter; font-weight: bold;">По возрастанию</span><span style="font-size: 15px; font-family: Inter;"> или </span><span style="font-size: 15px; font-family: Inter; font-weight: bold;">По убыванию</span><span style="font-size: 15px; font-family: Inter;">. Тогда сортировка по измерению будет использоваться как дополнительная. Например, если в качестве измерения выбрано название сделки, в качестве показателя — её бюджет, то значения будут сортироваться по указанной сумме и дополнительно по наименованию;</span></li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-size: 15px; font-family: Inter; font-weight: bold;">Отображать количество</span><span style="font-size: 15px; font-family: Inter;"> — вы можете ограничить объём отображаемых данных. Например, при настроенной сортировке по бюджету с помощью этой опции можно отобразить топ‑5 самых прибыльных сделок. Также это позволяет сделать график более компактным, если он размещён не на отдельной странице.</span></li></ul>
<p style="line-height: 1.28; margin: 0 0 11px 34px;"><span style="font-size: 15px; font-family: Inter;">Для настройки ограничения укажите в поле число, которое определит, сколько в графике будет столбцов, строк и т. п., в зависимости от его типа. Чтобы в график включались данные по всем элементам, оставьте поле пустым;</span></p>
<ul style="list-style-type:disc">
<li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Тип графика </span>— укажите тип графика:<ul style="list-style-type:circle">
<li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Столбчатый вертикальный</span>;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Столбчатый горизонтальный</span>;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Линейный</span>;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Линейный с областью</span>;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Круговой</span>;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Кольцевой</span>;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Продвинутый круговой</span>;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Сетка из круговых</span>;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Числовые карты</span>;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Древовидная карта</span>;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Спидометр</span>;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Столбчатый вертикальный с drill down</span>;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Столбчатый горизонтальный с drill down</span>;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-size: 15px; font-family: Inter; font-weight: bold;">Воронка с drill down</span><span style="font-size: 15px; font-family: Inter;"> — доступен только для графиков по </span><span style="font-size: 15px; font-family: Calibri,Vectora,'Droid Sans','Open Sans',Frutiger,sans-serif; color: #0563c1;"><a href="chart.html#conversion" class="topiclink">конверсии элементов</a></span><span style="font-size: 15px; font-family: Inter;">;</span></li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-size: 15px; font-family: Inter; font-weight: bold;">Таблица с drill down</span><span style="font-size: 15px; font-family: Inter;">.</span></li></ul></li></ul>
<p class="p_CodeExample" style="page-break-inside: avoid;"><span class="f_CodeExample">Начало&nbsp;внимание</span></p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><a href="chart.html#drill-down" class="topiclink">Типы графиков с drill down</a> применяются для источников данных <span style="font-weight: bold;">Отчет</span> и <span style="font-weight: bold;">Приложение</span> и доступны только для пользователей с <a href="licenses-crm.html" class="topiclink">лицензией решения CRM</a>, в котором включены приложения <a href="leads.html" class="topiclink">Лиды</a> и <a href="360012680899.html" class="topiclink">Сделки</a>.</p>
<p class="p_CodeExample" style="page-break-inside: avoid;"><span class="f_CodeExample">Конец&nbsp;внимание</span></p>
<ul style="list-style-type:disc">
<li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Цветовая схема </span>— выберите цветовое отображение графика;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Размер графика</span> — выберите одну из доступных опций:<ul style="list-style-type:circle">
<li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Динамический</span> — размер графика подстраивается под объём отображаемых данных;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Фиксированный</span> — укажите<span style="font-weight: bold;"> </span>ширину и высоту графика в пикселях. </li></ul></li></ul>
<ol style="list-style-type:upper-roman" start="3">
<li value="3" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">При выборе таблицы в качестве источника данных вы можете построить график по нескольким показателям. Для этого укажите дополнительные настройки:</li></ol>
<p style="line-height: 1.28; margin: 0 0 11px 34px;"><img alt="widget-chart-3" width="674" height="818" style="margin:0;width:674px;height:818px;border:none" src="widget-chart-3.png"/></p>
<ul style="list-style-type:disc">
<li style="margin-top: 0; margin-right: 0; margin-bottom: 7px;"><span style="font-weight: bold;">Группировка по нескольким показателям</span> — опция появляется, если вы настраиваете <span style="font-weight: bold;">Столбчатый вертикальный</span> или <span style="font-weight: bold;">Столбчатый горизонтальный</span> график. Отметьте её, чтобы указать несколько показателей, которые будут отображаться на оси X; <ul style="list-style-type:circle">
<li style="margin-top: 0; margin-right: 0; margin-bottom: 0;"><span style="font-weight: bold;">Название оси показателей</span> — укажите название для оси Y;</li><li style="margin-top: 7px; margin-right: 0; margin-bottom: 7px;"><span style="font-weight: bold;">Показатели</span> — выберите свойства таблицы типа <a href="360009707032.html" class="topiclink">Число</a> или <a href="360009707032.html" class="topiclink">Деньги</a>, по значениям которых будет построен столбчатый график. </li></ul></li></ul>
<p style="margin: 7px 0 7px 0;">Как будет выглядеть столбчатый график с группировкой по нескольким показателям, смотрите в разделе <a href="chart.html#use-table" class="topiclink">«Примеры использования графика»</a>.</p>
<h3 class="p_Heading3"><a id="custom-filters" class="hmanchor"></a><span class="f_Heading3">Вкладка «Пользовательские фильтры»</span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Если вы настраиваете график по данным из приложения, отчёта или показателя, вы увидите вкладку <span style="font-weight: bold;">Пользовательские фильтры</span>. Перейдите на неё, чтобы указать <span style="font-weight: bold;">Поля для фильтрации </span>— свойства приложения, которые будут использоваться в качестве фильтров для построения графика.</p>
<h3 class="p_Heading3"><a id="status-display" class="hmanchor"></a><span class="f_Heading3">Вкладка «Отображение статусов»</span></h3>
<p style="margin: 7px 0 7px 0;">Вкладка появится в окне настроек виджета, если в качестве источника данных было выбрано приложение с <a href="360009920611.html" class="topiclink">настроенными статусами</a>. Чтобы график формировался только по элементам в определённых статусах, отметьте их на вкладке. </p>
<p style="margin: 7px 0 7px 0;">Для приложений <a href="leads.html" class="topiclink">Лиды</a> и <a href="360012680899.html" class="topiclink">Сделки</a> график можно построить по выбранным воронкам и настроенным в них статусам. При этом каждая воронка будет отображаться на отдельной вкладке. Для этого:</p>
<ol style="list-style-type:decimal">
<li value="1" style="margin-top: 7px; margin-right: 0; margin-bottom: 7px;">На вкладке <span style="font-weight: bold;">Отображение статусов</span> включите опцию <span style="font-weight: bold;">Отображать воронки</span>.</li><li value="2" style="margin-top: 7px; margin-right: 0; margin-bottom: 7px;">Отметьте воронки, которые нужно добавить в график.</li><li value="3" style="margin-top: 7px; margin-right: 0; margin-bottom: 7px;">В каждой воронке выберите статусы, по элементам в которых будет формироваться график.</li></ol>
<p style="margin: 7px 0 7px 35px;"><img alt="widget-chart-status" width="1071" height="566" style="margin:0;width:1071px;height:566px;border:none" src="widget-chart-status.png"/></p>
<h3 class="p_Heading3"><a id="display-settings" class="hmanchor"></a><span class="f_Heading3">Вкладка «Настройки отображения»</span></h3>
<p style="margin: 7px 0 7px 0;"><a id="drill-down" class="hmanchor"></a>С <a href="licenses-crm.html" class="topiclink">лицензией решения CRM</a>, включающего в себя приложения <span style="font-weight: bold;">Лиды</span> и <span style="font-weight: bold;">Сделки</span>, и при выборе источников данных <span style="font-weight: bold;">Отчет</span> или <span style="font-weight: bold;">Приложение</span> в виджете доступны типы графиков <span style="font-weight: bold;">Столбчатый вертикальный с drill down</span>, <span style="font-weight: bold;">Столбчатый горизонтальный с drill down</span>, <span style="font-size: 15px; font-family: Inter; font-weight: bold;">Воронка с drill down</span><span style="font-size: 15px; font-family: Inter;"> и </span><span style="font-size: 15px; font-family: Inter; font-weight: bold;">Таблица с drill down</span>. С их помощью можно просмотреть список элементов, по которым построен каждый столбец в готовом графике. </p>
<p style="margin: 7px 0 7px 0;">В настройках виджета на вкладке <span style="font-weight: bold;">Настройки отображения</span> выбираются свойства источника, которые будут показаны в списке элементов. По умолчанию в таблице отображается только название элемента. Чтобы добавить свойства в список с детальной информацией, выберите их на вкладке. </p>
<p style="margin: 7px 0 7px 0;">Как будет выглядеть столбчатый график с drill down, смотрите <span style="color: #394149;">в разделе </span><a href="chart.html#use-cases" class="topiclink">«Примеры использования графика»</a><span style="color: #394149;">.</span></p>
<p class="p_Normal">Для завершения настроек графика нажмите <span style="font-weight: bold;">Сохранить</span>. После этого на поле для моделирования отобразится макет графика с данными. <span style="font-family: Inter; color: #394149;">При необходимости отредактируйте настройки виджета, чтобы изменить график.</span></p>
<p class="p_Normal"><span style="color: #212529; background-color: #ffffff;">Чтобы настроенная форма стала доступна пользователям, нажмите&nbsp;</span><span style="font-weight: bold; color: #212529; background-color: #ffffff;">Сохранить</span><span style="color: #212529; background-color: #ffffff;">&nbsp;и&nbsp;</span><span style="font-weight: bold; color: #212529; background-color: #ffffff;">Опубликовать&nbsp;</span><span style="color: #212529; background-color: #ffffff;">на верхней панели дизайнера интерфейсов</span>.</p>
<h2 class="p_Heading2"><a id="use-cases" class="hmanchor"></a><span class="f_Heading2">Примеры использования графика</span></h2>
<h3 class="p_Heading3"><span class="f_Heading3">Данные из приложения</span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><span style="font-family: Inter; color: #394149;">Рассмотрим, как построить график с источником данных </span><span style="font-family: Inter; font-weight: bold; color: #394149;">Приложение</span><span style="font-family: Inter; color: #394149;">, на примере отчётов по приложению </span><span style="font-family: Inter; font-weight: bold; color: #394149;">Сделки</span><span style="font-family: Inter; color: #394149;">.</span></p>
<p class="p_CodeExample" style="page-break-inside: avoid;"><span class="f_CodeExample">начало&nbsp;внимание</span></p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><span style="font-family: Inter; color: #394149;">Использовать приложения </span><span style="font-family: Inter; font-weight: bold; color: #394149;">Лиды</span><span style="font-family: Inter; color: #394149;"> и</span><span style="font-family: Inter; font-weight: bold; color: #394149;"> Сделки</span><span style="font-family: Inter; color: #394149;"> в виджете </span><span style="font-family: Inter; font-weight: bold; color: #394149;">График</span><span style="font-family: Inter; color: #394149;"> можно только при наличии </span><span style="font-family: Inter; color: #0000ff;"><a href="licenses-crm.html" class="topiclink">лицензии решения CRM</a></span><span style="font-size: 15px; color: #394149;">, в котором включены эти приложения.</span></p>
<p class="p_CodeExample" style="page-break-inside: avoid;"><span class="f_CodeExample">конец&nbsp;внимание</span></p>
<h4 class="p_Heading4"><span class="f_Heading4">Пример 1</span></h4>
<p style="margin: 0 0 11px 0;"><span style="color: #394149;">Для приложений </span><span style="font-weight: bold; color: #394149;">Сделки</span><span style="color: #394149;"> и </span><span style="font-weight: bold; color: #394149;">Лиды</span><span style="color: #394149;"> вы можете настроить график для отображения конверсии элементов по статусам. Это позволит отследить, какой процент сделок закрывается успешно.</span></p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><span style="font-size: 15px; color: #394149;">При настройке отчёта вы можете выбрать тип графика </span><span style="font-size: 15px; font-weight: bold; color: #394149;">Воронка с drill down</span><span style="font-size: 15px; color: #394149;">, </span><span style="font-size: 15px; font-weight: bold; color: #394149;">Столбчатый горизонтальный с drill down </span><span style="font-size: 15px; color: #394149;">или </span><span style="font-size: 15px; font-weight: bold; color: #394149;">Столбчатый вертикальный с drill down</span><span style="font-size: 15px; color: #394149;">. Тогда появится возможность посмотреть список элементов, перешедших в каждый из статусов на графике. Для этого в готовом графике нажмите на значение в любом столбце.</span></p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><img alt="closing_ratio-2" width="1010" height="512" style="margin:0;width:1010px;height:512px;border:none" src="closing_ratio-2.png"/></p>
<p class="p_Normal"><span style="font-family: Inter; color: #394149;">Подробнее о настройке такого отчёта читайте в статье</span> <a href="closing_ratio.html" class="topiclink">«Конверсия сделок и лидов»</a>.</p>
<h4 class="p_Heading4"><span class="f_Heading4">Пример 2</span></h4>
<p style="margin: 0 0 11px 0;"><span style="font-size: 13px; font-family: Inter; color: #394149;">Постройте график для просмотра общей выручки отдела продаж и отслеживания наиболее прибыльных сделок. Для этого:</span></p>
<ol style="list-style-type:upper-roman">
<li value="1" style="margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-size: 13px; font-family: Inter; color: #394149;">Разместите виджет </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">График</span><span style="font-size: 13px; font-family: Inter; color: #394149;"> на отдельной странице. </span></li><li value="2" style="margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-size: 13px; font-family: Inter; color: #394149;">В качестве источника данных выберите приложение </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Сделки</span><span style="font-size: 13px; font-family: Inter; color: #394149;">. В поле </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Измерение</span><span style="font-size: 13px; font-family: Inter; color: #394149;"> укажите название сделки, а в поле </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Показатель </span><span style="font-size: 13px; font-family: Inter; color: #394149;">— её бюджет. </span></li><li value="3" style="margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-size: 13px; font-family: Inter; color: #394149;">Выберите тип графика </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Продвинутый круговой</span><span style="font-size: 13px; font-family: Inter; color: #394149;">. </span></li><li value="4" style="margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-size: 13px; font-family: Inter; color: #394149;">На вкладке </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Пользовательские фильтры</span><span style="font-size: 13px; font-family: Inter; color: #394149;"> добавьте поля сделки, по которым можно будет сортировать данные на странице, например, </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Ответственный</span><span style="font-size: 13px; font-family: Inter; color: #394149;">, </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Дата поставки</span><span style="font-size: 13px; font-family: Inter; color: #394149;">, </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Воронка</span><span style="font-size: 13px; font-family: Inter; color: #394149;">.</span></li><li value="5" style="margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-size: 13px; font-family: Inter; color: #394149;">Сохраните и опубликуйте страницу. </span></li></ol>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><span style="font-size: 13px; font-family: Inter; color: #394149;">Вы увидите на графике всю прибыль компании, бюджет каждой сделки, а также процентное соотношение этой суммы и общей выручки.</span></p>
<p style="margin: 0 0 11px 0;"><img alt="chart-2" width="948" height="499" style="margin:0;width:948px;height:499px;border:none" src="chart-2.png"/></p>
<h3 class="p_Heading3"><a id="use-table" class="hmanchor"></a><span class="f_Heading3">Данные из таблицы</span></h3>
<p style="margin: 0 0 11px 0;"><span style="font-size: 13px; font-family: Inter; color: #394149;">Для построения графика с источником данных </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Таблица </span><span style="font-size: 13px; font-family: Inter; color: #394149;">выполните следующие действия:</span></p>
<ol style="list-style-type:upper-roman">
<li value="1" style="margin-top: 0; margin-right: 0; margin-bottom: 11px;"><a href="360009924451.html" class="topiclink">Создайте страницу</a> и откройте её в <a href="interface_designer.html" class="topiclink">дизайнере интерфейсов</a>.</li><li value="2" style="margin-top: 0; margin-right: 0; margin-bottom: 11px;">Откройте вкладку <span style="font-weight: bold;">Контекст</span>. Создайте свойство типа <a href="360010201779.html" class="topiclink">Таблица</a>, перейдите в его настройки и добавьте колонки. </li><li value="3" style="margin-top: 0; margin-right: 0; margin-bottom: 11px;">Вернитесь на вкладку <span style="font-weight: bold;">Шаблон</span>. На правой панели конструктора нажмите <span style="font-weight: bold;">Свойства </span>и <span style="font-size: 13px; font-family: Inter; color: #394149;">перетащите созданное свойство на поле для моделирования. Это необходимо, чтобы на странице пользователи могли заполнять таблицу данными</span>.</li><li value="4" style="margin-top: 0; margin-right: 0; margin-bottom: 11px;">Вынесите на поле виджет <span style="font-weight: bold;">График</span>. В настройках в поле <span style="font-weight: bold;">Источник данных </span>выберите опцию <span style="font-weight: bold;">Таблица </span>и укажите название созданной переменной из контекста. Задайте показатели для построения графика, его параметры, тип, цветовую схему и размер.</li><li value="5" style="margin-top: 0; margin-right: 0; margin-bottom: 11px;">Сохраните и опубликуйте страницу.</li></ol>
<h4 class="p_Heading4"><span class="f_Heading4">Пример 1</span></h4>
<p style="margin: 0 0 8px 0;"><span style="font-size: 13px; font-family: Inter;">Виджет можно использовать для отображения статистики готовых заказов на отдельной странице.</span></p>
<p style="margin: 0 0 8px 0;"><span style="font-size: 13px; font-family: Inter; color: #394149;">Когда пользователи заполняют колонки таблицы, в графике типа </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Спидометр</span><span style="font-size: 13px; font-family: Inter; color: #394149;"> показывается сумма каждого выполненного заказа, а также общий доход компании.</span></p>
<p class="p_Normal"><img alt="chart-3" width="946" height="626" style="margin:0;width:946px;height:626px;border:none" src="chart-3.png"/></p>
<h4 class="p_Heading4"><a id="group-by-several-indicators" class="hmanchor"></a><span class="f_Heading4">Пример 2</span></h4>
<p style="margin: 0 0 8px 0;"><span style="font-size: 13px; font-family: Inter; color: #394149;">Рассмотрим, как работает опция </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Группировка по нескольким показателям</span><span style="font-size: 13px; font-family: Inter; color: #394149;">.</span></p>
<p style="margin: 0 0 8px 0;"><span style="font-size: 13px; font-family: Inter; color: #394149;">Например, на отдельную страницу добавьте таблицу, которая показывает прибыль от заказов на указанную дату, и график типа </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Столбчатый вертикальный</span><span style="font-size: 13px; font-family: Inter; color: #394149;">. Суммы в таблице будут распределены по колонкам в зависимости от группы заказов: опт, розница или заказы от ИП.</span></p>
<p style="margin: 0 0 8px 0;"><span style="font-size: 13px; font-family: Inter; color: #394149;">Чтобы в графике прибыль от разных групп заказов отображалась в виде отдельных столбцов, в настройках виджета включите опцию </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Группировка по нескольким показателям</span><span style="font-size: 13px; font-family: Inter; color: #394149;">. В качестве показателей выберите свойства типа </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Деньги</span><span style="font-size: 13px; font-family: Inter; color: #394149;"> из таблицы.</span></p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><span style="font-size: 13px; font-family: Inter; color: #394149;">Когда пользователи заполняют таблицу данными, строится график, в котором сумма по каждой группе заказов отображается в отдельном столбце. Это позволяет сравнить доходы и оценить, какая из групп приносит компании наибольшую выручку.</span></p>
<p><img alt="widget-chart-7" width="961" height="619" style="margin:0;width:961px;height:619px;border:none" src="widget-chart-7.png"/></p>
<h3 class="p_Heading3"><a id="use-report" class="hmanchor"></a><span class="f_Heading3">Данные из отчёта</span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><span style="font-size: 13px; font-family: Inter; color: #394149;">Отчёты агрегируют данные из нескольких приложений-источников. Виджет </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">График</span><span style="font-size: 13px; font-family: Inter; color: #394149;"> позволяет визуализировать эти данные. Подробнее о том, как настроить и использовать отчёт, читайте в разделе</span> <a href="report.html" class="topiclink">«Отчет»</a>. </p>
<p style="margin: 0 0 11px 0;"><span style="font-size: 13px; font-family: Inter; color: #394149;">В отчёте информация представлена в виде таблицы. Колонки этой таблицы можно указать в качестве показателей, по которым строится график.</span> </p>
<p style="margin: 0 0 11px 0;"><span style="font-size: 13px; font-family: Inter; color: #394149;">Рассмотрим, как построить график для отчёта, в котором в качестве источников выбраны приложения </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Заказы</span><span style="font-size: 13px; font-family: Inter; color: #394149;">, </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Договоры </span><span style="font-size: 13px; font-family: Inter; color: #394149;">и </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Счета</span><span style="font-size: 13px; font-family: Inter; color: #394149;">. Отчёт содержит информацию о заказах, включая связанные с ними договоры и сумму счетов по каждому договору.</span></p>
<p style="margin: 0 0 11px 0;"><span style="font-size: 13px; font-family: Inter; color: #394149;">С помощью графика можно отслеживать, какой процент от общей выручки компании составляет сумма каждого заказа. Для этого в поле </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Измерение</span><span style="font-size: 13px; font-family: Inter; color: #394149;"> выберите название заказа, а в поле </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Показатель</span><span style="font-size: 13px; font-family: Inter; color: #394149;"> — сумму по договору. Укажите тип графика </span><span style="font-size: 13px; font-family: Inter; font-weight: bold; color: #394149;">Сетка из круговых</span><span style="font-size: 13px; font-family: Inter; color: #394149;">. Это позволит просматривать показатели по каждому заказу в отдельности.</span></p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><span style="font-size: 13px; font-family: Inter; color: #394149;">Сохраните настройки и опубликуйте страницу. Теперь на ней отображаются круговые графики для каждого заказа. В них указано название заказа, сумма по договору и процент от общей прибыли компании.</span></p>
<p class="p_Normal"><img alt="widget-chart-8" width="953" height="586" style="margin:0;width:953px;height:586px;border:none" src="widget-chart-8.png"/></p>
<h3 class="p_Heading3"><a id="use-process-metrics" class="hmanchor"></a><span class="f_Heading3">Данные показателя процесса</span></h3>
<p class="p_Normal"><a href="business-process-metrics.html" class="topiclink">Показатель</a> позволяет отслеживать эффективность исполнения этапов бизнес-процесса. Например, выяснить, сколько времени проходит между назначением задачи и её завершением. Чтобы фиксировать значение в ходе процесса, на его схеме используется графический элемент <a href="set-process-metrics-value.html" class="topiclink">Установить значение показателя</a>. Отображать данные можно с помощью виджета <span style="font-weight: bold;">График</span>. </p>
<p class="p_Normal">Допустим, при оформлении сделки менеджер в рамках отдельной задачи предлагает клиентам дополнительные услуги. На схеме процесса после задачи размещён графический элемент, чтобы с помощью показателя отслеживать количество отказов от услуг. Вы можете настроить график и отобразить, сколько отказов получено за определённый период при исполнении экземпляров процесса. &nbsp;</p>
<p class="p_Normal">Для этого:</p>
<ul style="list-style-type:disc"><ol style="list-style-type:decimal">
<li value="1" class="p_Normal"><a href="360009924451.html" class="topiclink">Создайте страницу</a> и разместите на ней виджет <span style="font-weight: bold;">График</span>. </li><li value="2" class="p_Normal">В настройках графика в качестве источника данных выберите <span style="font-weight: bold;">Показатель</span>.</li><li value="3" class="p_Normal">В поле <span style="font-weight: bold;">Измерение</span> укажите свойство показателя, которое соответствует анализируемому параметру этапа процесса. В данном примере переменная называется <span style="font-weight: bold;">Значение</span>. </li><li value="4" class="p_Normal">В поле <span style="font-weight: bold;">Показатель графика</span> укажите свойство показателя, которое содержит значения, полученные из процесса. В данном случае это <span style="font-weight: bold;">Количество</span>. </li><li value="5" class="p_Normal">Остальные настройки можно оставить по умолчанию. </li><li value="6" class="p_Normal">На вкладке <span style="font-weight: bold;">Пользовательские фильтры</span> выберите фильтрацию по времени события, чтобы видеть количество экземпляров с отказом от услуг за период. </li><li value="7" class="p_Normal">Сохраните виджет и опубликуйте страницу. </li></ol></li></ul>
<p class="p_Normal"><img alt="charts-10" width="467" height="372" style="margin:0;width:467px;height:372px;border:none" src="charts-10.png"/></p>
<div class="bottom-nav">
<a id="prev-link" class="topic__navi_prev" href="todo-widget.html">
<span class="bottom-nav__arrow bottom-nav__arrow--prev"></span> <span
class="bottom-nav__link">todo-widget.html</span>
</a>
<a id="next-link" class="topic__navi_next" href="widget_reports.html">
<span class="bottom-nav__link">widget_reports.html</span> <span
class="bottom-nav__arrow bottom-nav__arrow--next"></span>
</a>
</div>
<!-- добавляет на страницу строку блок Была ли статья полезной? -->
<div class="feedback-wrap"><div class="feedback" id="feedback"><span><b>Была ли статья полезной?</b></span><form action="" method="POST" class="feedback-form" id="feedback-form"><div class="feedback__popup feedback__popup-response" id="feedback__popup_thx">Спасибо за ваш отзыв!</div><div id="feedback-success-popup"><div class="wrap"><button type="button" class="feedback-popup-close">×</button><svg width="44" height="44" viewBox="0 0 44 44" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_212_2187)"><path d="M22 0.6875C10.2294 0.6875 0.6875 10.2294 0.6875 22C0.6875 33.7706 10.2294 43.3125 22 43.3125C33.7706 43.3125 43.3125 33.7706 43.3125 22C43.3125 10.2294 33.7706 0.6875 22 0.6875ZM22 40.5625C11.8023 40.5625 3.4375 32.3078 3.4375 22C3.4375 11.8024 11.6922 3.4375 22 3.4375C32.1977 3.4375 40.5625 11.6922 40.5625 22C40.5625 32.1976 32.3078 40.5625 22 40.5625ZM34.1713 16.933L18.6613 32.3186C18.257 32.7197 17.604 32.7171 17.203 32.3128L9.82283 24.873C9.42176 24.4686 9.42434 23.8157 9.82867 23.4146L10.5609 22.6884C10.9652 22.2873 11.6181 22.2899 12.0192 22.6942L17.9468 28.6697L31.9926 14.7366C32.3969 14.3356 33.0498 14.3382 33.4509 14.7425L34.1772 15.4747C34.5783 15.879 34.5757 16.532 34.1713 16.933Z" fill="#27AE60"></path></g><defs><clipPath id="clip0_212_2187"><rect width="44" height="44" fill="white"></rect></clipPath></defs></svg><p>Ваш отзыв успешно отправлен!</p><span>Спасибо за обратную связь.</span></div></div><div class="feedback__popup" id="feedback__popup_why"><button type="button" class="feedback-popup-close">×</button><div class="feedback__popup-header">Уточните, почему:</div><input type="radio" name="category" id="bad_recommendation" value="bad_recommendation"><label for="bad_recommendation">Рекомендации не помогли</label><input type="radio" name="category" id="difficult_text" value="difficult_text"><label for="difficult_text">Текст трудно понять</label><input type="radio" name="category" id="no_answer" value="no_answer"><label for="no_answer">Нет ответа на мой вопрос</label><input type="radio" name="category" id="bad_header" value="bad_header"><label for="bad_header">Содержание статьи не соответствует заголовку</label><input type="radio" name="category" id="other_reason" value="other_reason"><label for="other_reason">Другая причина</label></div><div class="feedback__popup" id="feedback__popup-other"><button type="button" class="feedback-popup-close">×</button> <div class="feedback__popup-header">Расскажите, что вам не понравилось в статье:</div><textarea class="feedback__textarea" name="other" id=""></textarea><input type="submit" class="feedback__other-btn" value="Отправить"></div><div class="feedback-form__btn-group"><input type="radio" name="useful" id="feedback__useful_yes" value="true"><label for="feedback__useful_yes"><img src="like.svg"/><span class="feedback-form__btn-group_yes-btn">Да</span></label><input type="radio" name="useful" id="feedback__useful_no" value="false"><label for="feedback__useful_no"><img src="dislike.svg"/><span class="feedback-form__btn-group_no-btn">Нет</span></label></div><select name="category"><option disabled>Выберите вариант</option><option value="bad_recommendation" selected>Рекомендации не помогли</option><option value="difficult_text">Текст трудно понять</option><option value="no_answer">Нет ответа на мой вопрос</option><option value="bad_header">Содержание статьи не соответствует заголовку</option><option value="other_reason">Другая причина</option></select><input type="submit"></form></div></div>
</section>
</div>
<aside class="article__sidebar" style="display:none">
<input type="checkbox" />
<div class="article__arrow"></div>
<div class="table-of-contents elma365-right" id="toc2Content">
<h3 class="h3-toc">В этой статье</h3>
<nav id="toc2"></nav>
</div>
</aside>
</div>
</article>
</main>
<footer class="footer">
<div class="footer-container">
<div class="footer-mobile">
<ul class="footer-mobile__list"><li><a href="https://api.elma365.com/ru/" target="_blank">API</a></li><li><a href="https://tssdk.elma365.com/" target="_blank">TS SDK</a></li><li><a href="https://community.elma365.com/" target="_blank">Community</a></li><li><a href="https://elma-academy.com/ru/elma365" target="_blank">Академия</a></li></ul><ul class="footer-mobile__list"><li><a href="https://elma365.com/ru/help/platform/get-trial.html">Платформа</a></li><li><a href="https://elma365.com/ru/help/ecm/ecm-functions.html">ECM</a></li><li><a href="https://elma365.com/ru/help/service/service-functions.html">Service</a></li><li><a href="https://elma365.com/ru/help/projects/projects-functions.html">Проекты</a></li></ul>
</div>
<div class="container">
<div class="footer-wrap">
<div><span class="mobile-question-popup">Отправить фидбэк</span><form method="POST" action class="question__popup question-xs" id="question__popup"><div class="question-wrap"><span class="close"></span><span class="title">Задать вопрос</span><label for="help_question" style="display: none;"></label><textarea name="help_question" id="help_question"></textarea><input type="submit" value="Отправить"></div></form><div class="hidden fade-in question-success-xs">Ваш фидбэк отправлен.</div></div>
<div class="footer-flex-b">
<div class="footer-top">
<span class="footer-copy">&copy; 2025
ELMA365
</span>
<a href="https://navigator.sk.ru/orn/1122971" target="_blank">
<img src="sk-resident.svg" alt="sk icon" class="footer-img" width="117" height="34">
</a>
</div>
<div class="footer-line">
<div class="footer-line-copy">
<span class="footer-copy">&copy; 2025
ELMA365
</span>
</div>
<ul class="footer-list">
<li class="footer-item"><a href="https://elma365.com/ru/" target="_blank" class="footer-link" style="color: #0D4A75;"><img src="browse.svg" alt="browse icon" class="footer-img">elma365.com</a></li><li class="footer-item"><a href="https://www.youtube.com/user/ELMABPM" target="_blank" class="footer-link"><img src="yt.svg" alt="youtube icon" class="footer-img"></a></li><li class="footer-item"><a href="https://vk.com/elma_bpm" target="_blank" class="footer-link"><img src="vk.svg" alt="vk icon" class="footer-img"></a></li><li class="footer-item"><a href="https://t.me/elmaday" target="_blank" class="footer-link"><img src="tg.svg" alt="telegram icon" class="footer-img"></a></li><li class="footer-item"><a href="https://dzen.ru/elma" target="_blank" class="footer-link"><img src="dzen.svg" alt="dzen icon" class="footer-img"></a></li>
<li class="footer-item">
<a href="https://navigator.sk.ru/orn/1122971" target="_blank">
<img src="sk-resident.svg" alt="sk icon" class="footer-img" width="117" height="34">
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<a href="#" class="arrow-top"></a>
</div>
</footer>
<!-- <script type="text/javascript" src="jquery1.min.js"></script>-->
<iframe name="hmnavigation" style="display:none!important"></iframe>
<!--<script src="./jquery-ui.js"></script> -->
<script src="./jquery-ui.min.js"></script>
<!--script src="//cdn.jsdelivr.net/npm/featherlight@1.7.14/release/featherlight.min.js" type="text/javascript" charset="utf-8"></script-->
<script src="./jquery.tocify.min.js"></script>
<script src="./TypoReporter.min.js"></script>
<script src="./google-search.js"></script>
<script src="./main.js"></script>
</body>
</html>