mozok.click » Інформатика » Візуалізація елементів табличної величини за допомогою графічних примітивів
Інформація про новину
  • Переглядів: 7716
  • Автор: admin
  • Дата: 14-09-2017, 06:40
14-09-2017, 06:40

Візуалізація елементів табличної величини за допомогою графічних примітивів

Категорія: Інформатика

У різних сферах діяльності виникає потреба подавати вихідні дані й результати в графічній формі.

Побудова лінійчатої діаграми з використанням автофігур

Алгоритм побудови лінійчатої діаграми:

1) створити масив автофігур Shape, розмірність якого дорівнює кількості значень даних у таблиці;

2) задати елементам масиву автофігур значення властивості Width, пропорційні значенням табличної величини.

Відобразити у вигляді лінійчатої діаграми дані таблиці.

На форму додамо компонент Panel як контейнер для компонентів Image і Shape (рис. 37.1). Розмістимо на панелі компонент Image і 4 компоненти Shape (за кількістю елементів у масиві). Для створення легенди діаграми на форму додамо 4 компоненти Label.

Об’єкти Shape належать до типу даних TShape. У розділі опису глобальних змінних опишемо:

var sh: array[1..4] of TShape; // масив типу TShape Тепер можна працювати з автофігурами, звертаючись до них, як до елементів масиву sh[i].

Аналогічно створимо масив типу TLabel для об’єктів Label. lb: array[1..N] of TLabel;



Заповнення масивів відбуватиметься під час створення форми:

У процедурі обробки події onclick для кнопки Побудувати діаграму створимо масиви-константи назв річок і довжин річок. Числові значення досить великі, тому значенням властивості Width елементів масиву автофігур присвоїмо значення елементів масиву довжин річок D[i], зменшені в 5 разів: sh[i].Width := D[i] div 5;

Код процедури обробки події onclick для кнопки Побудувати діаграму може бути таким:

Виведення тексту на полотно здійснюється за допомогою методу ТехЮиї(х,у,Техї). Вікно програми з діаграмою, побудованою за даними таблиці довжин річок в Україні, зображено на рис. 37.2.

Побудова гістограми з використанням графічних методів

Діаграми можна створювати, програмуючи креслення графічних примітивів (лінія, прямокутник, сектор) графічними методами полотна Canvas. Для побудови стовпців гістограми (стовпчастої діаграми) використаємо графічний метод Canvas.Rectangle(x1,y1,x2,y2).


Алгоритм побудови гістограми за значеннями елементів масиву Mas[1..N]:

1) побудувати координатні осі;

2) побудувати N прямокутників, розраховуючи координати і-го прямокутника за формулами

x1 = i * S1, y1 = H - Round(Mas[i]), x2 = i * S1 + dS, y2 = yox,

де і — номер, S1 — координата x1 першого прямокутника, Н — висота полотна, dS — ширина прямокутника, уох — відстань від верхнього краю полотна до осі Ox.

Побудувати гістограму прибутку підприємства за 4 квартали року на полотні елемента Imagel, яке має розміри 250x150 пікселів (рис. 37.3).

Код процедури побудови гістограми може бути таким:

const Pr: array [1..4] of Integer = (100, 40, 80, 70);

Nazva: array [1..4] of String = ('І kb.','II кв.'/ІІІ кв.'/IV кв.');

var i: Integer;

begin

Labell.Caption := '';

{ встановлюємо колір області побудови гістограми }

Imagel.Canvas.Brush.Color := clWhite;

Imagel .Canvas.FillRect(Imagel.ClientRect);

{ побудова координатних осей }

Imagel .Canvas.Polyline ([Point(5,5),Point(5,140),Point (240,140)]);

Imagel .Canvas.Polyline ([Point (2,8), Point (5,5), Point (9,9)]); Image1.Canvas.Polyline ([Point (235,137), Point (240,140), Point (235,143)]); Нижні сторони прямокутників (стовпців гістограми) розташовані на одному рівні (на осі Оу), тому координата y2 для нижнього кута стовпців дорівнює 140. Визначимо координати для побудови першого стовпця. Нехай координата х1 дорівнює 40 пікселів. Висота полотна елемента керування Image1 дорівнює 150 пікселів, висота першого стовпця становить Pr[1]. Отже, координата y1 верхнього кута першого стовпця дорівнює 150 - Pr[1] (рис. 37.4). Нехай ширина стовпця діаграми дорівнює 30 пікселів, тоді координата х2 першого стовпця становить (40 + 30) пікселів. Для i-го стовпця х1 = i * 40, х2 = i * 40 + 30.

Побудова кругової діаграми

У круговій діаграмі кожному елементу масиву відповідає сектор, градусна міра якого пропорційна величині елемента.

Алгоритм побудови кругової діаграми за значеннями елементів масиву:

3) побудувати всі сектори діаграми (у результаті сектори утворять повний круг).

Із курсу 8 класу вам відомо, що для побудови сектора еліпса використовується графічний метод СапуаБ.Ріе.


У 9-А класі навчається 30 учнів. Виконавши тест з інформатики, 7 учнів отримали 10-12 балів, 15 учнів — 7-9 балів, 6 учнів — 4-6 балів, решта — 1-3 бали. Побудувати кругову діаграму успішності учнів за рівнями навчальних досягнень (рис. 37.5).

Значення кількості учнів, які отримали оцінки за чотирма рівнями, занесені до масиву K[1..4] of Integer. Областю побудови діаграми є полотно елемента керування Imagel.

Побудова графіка

Необхідність у побудові графіка виникає, коли треба показати залежність однієї величини від іншої (графік функції, графік температур). Алгоритм побудови графіка змінення табличної величини:

1) побудувати координатні осі;

2) вивести імена категорій;

3) побудувати відрізки від точки (і - 1, /(і - 1)) до точки (і, /(ї)), де і — номер, /(і) — значення і-го елемента в масиві даних.

Користуючись даними прикладу 2, побудувати графік змінення прибутку підприємства за 4 квартали на полотні елемента Ітадеї, ширина і довжина якого по 160 пікселів (рис. 37.7).

Питання для самоперевірки

1. Опишіть порядок створення масиву автофігур типу ЇБбаре.

2. Який графічний метод використовують для побудови гістограми; кругової діаграми?

3. Опишіть алгоритм побудови кругової діаграми.

4. Додайте до проекту з практичної роботи 12 процедуру побудови графіка опадів за рік.

Вправа 37

У таблиці наведено дані про обсяг продажів книжкового магазину за місяцями у період із січня по червень. Визначити сумарний обсяг продажів за півріччя, побудувати гістограму і кругову діаграму обсягів продажу за місяцями.

1) Створіть новий проект. Змініть значення властивості Caption форми, розмістіть на формі компоненти і налаштуйте їх властивості згідно з рисунком. Компоненти Image призначені для побудови діаграм; компоненти Label — для оформлення легенди; компонент Edit — для виведення значення сумарного обсягу продажів.

2) Опишіть глобальні масиви значень, назв категорій, кольорів: const pr: array[1..6] of Real = (11, 17, 18, 32.5, 18.5, 15.5);

nom: array[1..6] of String = ('Січ', 'Лют', 'Бер', 'Квт', 'Трв', 'Чрв');

cl: array[1..6] of TColor = (cIBlue, cIGreen, clYellow, cIRed, cINavy, clAqua);

3) У процедурі обробки події onclick для кнопки Знайти сумарний обсяг запрограмуйте знаходження суми елементів масиву Pr і виведення значення у поле Edit1.

4) У процедурі обробки події onclick для кнопки Побудувати гістограму запрограмуйте побудову гістограми за значеннями елементів масиву Pr.

5) У процедурі обробки події onclick для кнопки Побудувати кругову діаграму запрограмуйте побудову кругової діаграми за значеннями елементів масиву Pr.

6) Перевірте роботу програми. Яку з побудованих діаграм доцільно використовувати для аналізу обсягу продажів за півріччя? Збережіть проект у папці Вправа 37. Завершіть роботу за комп’ютером.

Комп'ютерне тестування

Виконайте тестове завдання 37 із автоматичною перевіркою на сайті «Інтерактивне навчання».

 

Це матеріал з підручника Інформатика 9 клас Бондаренко

 






^