Учись программированию на C++ Builder бесплатно!
Содержание[Скрыть]

Компонент Chart – удобный инструмент создания различных графиков и диаграмм с широкими возможностями и эффектным построением входных данных. Компонент Chart обладает множеством свойств, событий и методов, которые значительно сокращают время разработки приложений.

Компонент Chart это контейнер объекта Series типа TChartSeries. Этот тип относится к сериям данных, которые квалифицируются различными стилями оформления. Компонент Chart позволяет работать одновременно с несколькими сериями Series. Если нужно отображать несколько графиков в одном окне, то каждая серия отвечает за одну кривую на графике. Если нужно вывести данные в диаграмму, то в этом случае можно наложить несколько разных серий.

Свойства компонента Chart

Значение Описание
AllowPanning

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

  • pmNone – прокрутка области запрещена;
  • pmHorizontal – прокрутка области разрешена только в горизонтальном направлении;
  • pmVertical – прокрутка области разрешена только в вертикальном направлении;
  • pmBoth - прокрутка области разрешена в обоих направлениях.
AllowZoom

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

Title

Задаёт заголовок диаграммы.

Foot

Задаёт подпись под диаграммой. Текст подписи является подсвойством Text. По умолчанию подпись отсутствует.

Frame

Задаёт рамку вокруг диаграммы.

Legend

Отображает список обозначений в виде легенды.

MarginLeft,
MarginTop, MarginRight,
MarginBottom

Задаёт значения отступа левого, верхнего, правого и нижнего полей.

LeftAxis,
RightAxis,
BottomAxis

Задают характеристики левой, правой и нижней осей.

LeftWall,
BottomWall,
BackWall

Позволяют определить характеристики левой, нижней и задней граней для трёхмерного графика.

SeriesList

Список серий с данными, которые включены в компоненте.

View3d

Включает трёхмерное отображение диаграммы.

View3DOptions

Задаёт характеристики трёхмерного отображения диаграммы.

Chart3DPercent

Задаёт масштаб трёхмерности.

Большинство из описанных свойств компонента Chart имеют дополнительные параметры, которые вызываются нажатием в «Инспекторе объектов» кнопкой с многоточием. Где вызывается страница «Редактор диаграмм» (позволяет устанавливать все свойства диаграмм). Так же вызвать «Редактор диаграмм» можно двойным кликом левой кнопки мыши по компоненту Chart или же правой кнопкой мыши, выбрав команды Edit Chart.

Series – добавление графиков

Чтобы добавить в компонент Chart график следует проделать несколько не сложных пунктов:

  1. Открыть окно «Редактор диаграмм» компонента Chart.
  2. Перейти в закладку Series и нажать на кнопке Add, которая позволяет добавить серию Series.
  3. Появится список имеющихся типов графиков и диаграмм. Здесь можно выбрать ту или иную диаграмму для требуемых задач.
  4. После выбора желательно в разделе Titles задать заголовок диаграмме, в разделе Legend задать параметры для отображения легенды (списка обозначений), в разделе Panel задать внешний вид панели, остальные параметры по желанию.

Окно выбора типа диаграммы

При добавлении графика или диаграммы в компонент Chart, они создаются с демо-данными, чтобы можно было посмотреть результат отображения, применяя различные параметры. Кроме этого в «Редактор диаграмм» в разделе Series имеется ряд различных закладок, которые позволяют ещё глубже и детальнее настраивать серии.

Настройки Series

Параметры круговой диаграммы

  • Опция Circled Pie на закладке Format позволяет отображать круговую диаграмму при любом масштабировании компонента Chart.
  • Опции в Style на закладке Marks позволяет настроить ярлычки к различным сегментам диаграммы: Percent – проценты, Value – значение, Label – названия данных и прочее.
  • Можно установить шаблон отображения значений на закладке General.

Установка формата значений

Компонент Chart позволяет дублировать настроенную серию. В разделе Series окна «Редактор диаграмм» компонента Chart есть кнопка Clone, которая позволяет мгновенно скопировать созданную серию. После клонирования можно изменить тип диаграммы или некоторые параметры с помощью кнопки Change.

Общие параметры диаграмм

Раздел Axis в «Редактор диаграмм» позволяет детально задать и настроить отображение координатных осей графиков и диаграмм.

Раздел Wolls позволят настроить отображение трёхмерных граней графика.

Методы серий Series

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

  1. Clear – очищает серию от всех входных данных.
  2. Add – добавляет новую точку в график или диаграмму со следующими параметрами:
    • AValue – отображает входное значение;
    • ALabel – отображает название добавленной точки (параметр является не обязательным и можно оставить значение пустым);
    • AColor – устанавливает цвет точки.
  3. AddXY – добавляет новую точку в график функции со следующими параметрами:
    • AXValue и AYValue – устанавливают значения аргументу и функции;
    • ALabel и AColor выполняют те же функции, что и в методе Add.

Пример создания графика

int A1 = 55, A2 = 21, A3 = 33, A4=44;
const float Pi = 3.14159;
Series1->Clear();
Series2->Clear();
Series3->Clear();
Series1->Add(A1,"User 1",clYellow);
Series1->Add(A2,"User 2",clBlue);
Series1->Add(A3,"User 3",clRed);
Series1->Add(A4,"User 4",clPurple);
for(int i = 0; i <= 100; i++)
{
   Series2->AddXY(Pi*i,sin(0.1*Pi*i)*10,"",clRed);
   Series3->AddXY(Pi*i,cos(0.1*Pi*i)*10,"",clBlue);
}

Пример создания графика

Функции Clear для каждой серии нужны, чтобы в процессе работы программы данные обновлялись. Без этого при повторном построении графиков с помощью методов Add и AddXY, новые точки продолжат добавляться к графикам.

В компоненте Chart можно создать две серии Series для отображения одинаковых данных, но с разным видов, например, Pie и Bar, и для пользователя предусмотреть возможность выбора отображения той или иной диаграммы. Так, например, в событие OnClick кнопки Button можно создать простую обработку, которая загрузит данные в Series и сделает её невидимой:

Series2->Assign(Series1); //Переписывает данные из Series1 в Series2
Series2->Active = false; //Скрывает Series2

Процедура смены типа диаграммы очень проста:

Series1->Active =! Series1->Active;
Series2->Active =! Series2->Active;
Поделиться