- •Давайте не будем изобретать колесо.
- •Прежде всего: Данные
- •Рисование и Упорство
- •Объект Graphics
- •Начинаем
- •Расположение и Размер
- •Вычислите Общее значение
- •Вычислите Доли и Нарисуйте Диаграмму
- •Рисуем диаграмму
- •Улучшите диаграмму
- •Заголовок
- •Пули (Bullets) и Информация о Компании
- •Расположите После Использования
- •Все сделано!
- •Нарисуем это!
- •Давайте начнем
- •Шаг 1: генерация данных
- •Шаг 2: Получаем элемент управления
- •Повторно используемые значения
- •Шаг 3: Установка полей, промежутки и размеры
- •Шаг 4а: Объекты Graphics и Bitmap
- •Шаг 4b: Вертикальная ось
- •Шаг 4c: Отметки и текст
- •Шаг 4d: Время для проверки
- •Шаг 5: Горизонтальная ось и панели
- •5B. Панели
- •5C. Названия стран
- •Шаг 6: Все показано!
- •Удачные диаграммы: Вторая помощь в круговых диаграммах. Часть 3
- •Разметка формы
- •Давайте начнем писать код
- •Временные переменные
- •Элементы пользовательского ввода
- •Получение данных
- •Создание диаграммы
- •Рисуем Panel
- •Финальное домоводство
- •Опция «Уппс!»
- •Настройка
- •Создаем данные
- •Элементы управления
- •Вертикальная ось
- •Точечные отметки шкалы
- •Проверяем 1, 2, 3
- •Базовая линия (ось X)
- •3D Панели
- •Последние штрихи
- •Удачные диаграммы. Часть 5 - Линейные графики
- •Данные для образца
- •Переменные
- •Внешние границы диаграммы
- •Объект Graphics
- •Вертикальная ось
- •Отметки
- •Горизонтальная ось (a.K.A. Базовая линия)
- •Рисование Линии (Линий)
- •Расчет вертикальной шкалы
- •Создаем и рисуем первый сегмент линии
- •Превращающаяся и исчезающая проблема линий
- •Первый сегмент линии
- •Остающиеся сегменты линии
- •Преобразования
- •Рисуем преобразованную линию
- •Проверяем
- •Отображаем месяцы
- •Отображаем результат
- •Соединения линий
- •Линии сетки
- •Горизонтальные линии сетки
- •Вертикальные линии сетки
- •Последнее отображение
- •Удачные диаграммы. Часть 6 - Динамическая линейная диаграмма
- •Элементы управления формы
- •Инициирующий код
- •Рисование направляющих линий диаграммы
- •Как это работает
- •Отображаем значения
- •Использование Vertical ScrollBar
- •Проверяем
- •Итоги первой демонстрации
- •Затененный график
- •Значения вертикальной оси
- •Код Вертикальных Значений
- •Подвижные направляющие линии
- •Отображаем направляющие линии
- •Направляющие линии и отображенные значения
- •Вертикальные значения
- •Возможные улучшения
- •Охваченные темы
Удачные диаграммы: GDI+ Работа с графикой. Часть 1
Автор: Ged Mead Перевод: Виталий Готовцов [Оригинал Статьи] [Обсудить в форуме]
Давайте не будем изобретать колесо.
Во многих ситуациях знакомая круговая диаграмма является хорошим способом представления данных в иллюстрированной форме. Класс Graphics в .NET предлагнает нам легкий способ создавать этот стиль диаграмм для демонстрации миру фактов и цифр.
Вышерасположенная диаграмма может быть создана всего несколькими строками кода. Однако это, очевидно, очень ограничивает ее самостоятельное использование. Картинка красочна, но нам необходимо знать, что представляют сегменты. Давайте рассмотрим основной, но очень полезный способ этого – использование ключа диаграммы:
С таким ключом, как показанный выше, пользователю очень легко определить, какая часть круговой диаграммы представляет какую компанию. Чтобы сделать данные еще более полезными, общее значение каждой отдельной компании тоже показано в ключе. Вы увидите, что класс Graphics в .NET Framework делает совсем легким создание круговой диаграммы и ключей подобного рода. Так что мы будем использовать встроенные возможности DrawPie и DrawString и избежим изобретения колеса.
Прежде всего: Данные
Очевидно, нам будут нужны данные для создания нашей диаграммы-примера. Поскольку эта статья направлена на то, чтобы показать вам способы использования GDI+ и класса Graphics, я хочу тратить как можно меньше времени на ту часть проекта, которая занимается сбором данных. По этой причине я выбрал создание данных во время проектирования. Хотя это может подходить в реальных ситуациях, я уверен, что большую часть времени вы будете вынуждены получать данные из других источников, таких как файлы с данными, базы данных, непосредственный ввод пользователем. Мы планируем посмотреть на эти другие источники в будущих статьях. В настоящее же время я остановился на использовании простой Структуры (Structure), которая создает определенный пользователем Тип (Type), называемый GraphData. Это Тип будет содержать три Поля (Fields) – Amount, Clr и Description. Мы будем создавать данные для некоторых вымышленных компаний, и три поля будут представлять: Amount – Ежегодный товарооборот $K Clr – цвет, используемый в диаграмме для представления компании Description – название компании. Для создания структуры GraphData поместите следующий код в вашу форму, убедившись, что он помещен вне процедур.
Structure GraphData
Dim Amount As Single
Dim Clr As Color
Dim Description As String
' Создает конструктор
Sub New(ByVal amt As Integer, ByVal col As Color, _
ByVal desc As String)
Me.Amount = amt
Me.Clr = col
Me.Description = desc
End Sub
End Structure
Конструктор New включен только для уменьшения количества строк, необходимых во время «производства» данных, что является нашим следующим шагом. Для удобства обработки, данные будут помещены в массив. Массив может содержать любое количество объектов GraphData. Фактически мы собираемся создать только четыре объекта для демонстрации. Объявите и создайте массив, поместив следующую строку в начале вашего кода, и снова вне любой процедуры.
Dim Companies As New System.Collections.ArrayList
Теперь нужно создать данные. Мы создадим четыре компании и присвоим значения их полям Amount, Col и Description. Этот код в событии Form Load – это все, что нужно:
Companies.Add(New GraphData(50, Color.Blue, "Muir Inc."))
Companies.Add(New GraphData(75, Color.Yellow, "Philmas Co."))
Companies.Add(New GraphData(62, Color.Red, "Xamco"))
Companies.Add(New GraphData(27, Color.LightGreen, "Wright plc"))
У нас есть данные, и мы можем их использовать теперь, как источник для выбранного способа отображения – круговой диаграммы.