System windows forms datavisualization charting как подключить

Создание графиков в WinForms C#

Доброго времени суток! В данной статье мы рассмотрим, как можно создавать графики в WinForms C#.
В качестве платформы примера нужно взять .Net Framework 4.8. Далее в ссылки проекта необходимо добавить
ссылку на сборку System.Windows.Forms.DataVisualization.
Для этого нужно в обозревателе решений нажать правой мыши на элемент меню Ссылки и далее Добавить ссылку.
В открывшемся окне необходимо найти сборку и выделить ее галочкой. В панели элементов должен появиться новый элемент — Chart.
Обратите внимание, что проект должен быть для версии .Net Framework 4.*.
Теперь рассмотрим пример кода:


using System.Windows.Forms;
using System.Windows.Forms.DataVisualization.Charting;

namespace ChartsWinForms
{
    public partial class MainForm : Form
    {
        public MainForm()
        {
            InitializeComponent();

            string[] daysOfWeek = { "Понедельник", "Вторник", "Среда", "Четверг", "Пятница", "Суббота", "Воскресенье" };
            int[] numberOfVisitors = { 1200, 1450, 1504, 1790, 2450, 1900, 3050 };

            // Установим палитру
            chart.Palette = ChartColorPalette.SeaGreen;

            // Заголовок графика
            chart.Titles.Add("Посетители");

            // Добавляем последовательность
            for (int i = 0; i < daysOfWeek.Length; i++)
            {
                Series series = chart.Series.Add(daysOfWeek[i]);

                // Добавляем точку
                series.Points.Add(numberOfVisitors[i]);
            }

        }

    }
}

Таким образом, вот так просто можно создавать графики в WinForms C#.

  • Создано 16.03.2023 13:36:01

  • Михаил Русаков

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

  1. Кнопка:

    Она выглядит вот так:

  2. Текстовая ссылка:

    Она выглядит вот так: Как создать свой сайт

  3. BB-код ссылки для форумов (например, можете поставить её в подписи):

Под .NET существует множество библиотек для построения графиков. Выбор в сторону решения от Microsoft подкупил тем, что оно встроено в .NET Framework 4 и потому не требует подключения сторонних библиотек. Хотя есть и один недостаток — работать с ним можно только на форме Windows Forms, для WPF форм штатной работы с компонентом не предусмотрено. Из-за этого все мануалы, начинающиеся словами «перетащите компонент Chart на форму»

шли лесом

абсолютно не помогали решить поставленную проблему.

Сначала необходимо было решить, каким образом использовать компоненты Windows Forms на WPF форме. Для этого судя по инструкции с MSDN необходимо добавить ссылку на WindowsFormsIntegration и на System.Windows.Forms. Также необходимо добавить их пространства имен в элемент <Window> XAML-документа формы, и элемент <WindowsFormsHost>, в котором впоследствии будет размещаться нужный компонент Windows Forms:

<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:wfi="clr-namespace:System.Windows.Forms.Integration;assembly=WindowsFormsIntegration"
xmlns:wf="clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms">
<StackPanel>
<WindowsFormsHost></WindowsFormsHost>
</StackPanel>
</Window>

Теперь все готово к использованию компонентов Windows Forms, но всю работу по внедрению компонента на форму придется делать вручную. Подключим к проекту System.Windows.Forms.DataVisualization.Charting, добавим пространство имен в XAML-документ и сам компонент на форму.

<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
...
xmlns:dvc="clr-namespace:System.Windows.Forms.DataVisualization.Charting; assembly=System.Windows.Forms.DataVisualization">
<StackPanel>
<WindowsFormsHost><dvc:Chart x:Name="chart" /></WindowsFormsHost>
</StackPanel>
</Window>

Есть замечательный проект от Microsoft, содержащий массу примеров работы с компонентом Chart для Windows Forms. Но запустить его получится не сразу, так как нужный для инициализации компонента код под Windows Forms среда генерирует в методе InitializeComponent() сама на основе сделанных разработчиком настроек компонента. Я не нашел способа вызова конфигуратора компонента для WPF формы, поэтому прежде чем использовать код из примеров, надо будет вручную дописать пару строк кода.

using System.Windows.Forms.DataVisualization.Charting;
...

private void Window_Loaded(object sender, RoutedEventArgs e)
{
// Все графики находятся в пределах области построения ChartArea, создадим ее
chart.ChartAreas.Add(new ChartArea("Default"));

// Добавим линию, и назначим ее в ранее созданную область "Default"
chart.Series.Add(new Series("Series1"));
chart.Series["Series1"].ChartArea = "Default";
chart.Series["Series1"].ChartType = SeriesChartType.Line;

// добавим данные линии
string[] axisXData = new string[] {"a", "b", "c"};
double[] axisYData = new double[] {0.1, 1.5, 1.9};
chart.Series["Series1"].Points.DataBindXY(axisXData, axisYData);

}

В результате получим замечательный график, и главное никаких сторонних библиотек:

Создание микросервисов с gRPC и Protobuf в C++

bytestream 06.05.2025

Монолитные приложения, которые ещё недавно считались стандартом индустрии, уступают место микросервисной архитектуре — подходу, при котором система разбивается на небольшие автономные сервисы, каждый. . .

Многопоточность и параллелизм в Python: потоки, процессы и гринлеты

py-thonny 06.05.2025

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

Конкурентность (concurrency) — это когда ваша программа умеет жонглировать. . .

Распределенное обучение с TensorFlow и Python

AI_Generated 05.05.2025

В машинном обучении размер имеет значение. С ростом сложности моделей и объема данных одиночный процессор или даже мощная видеокарта уже не справляются с задачей обучения за разумное время. Когда. . .

CRUD API на C# и GraphQL

stackOverflow 05.05.2025

В бэкенд-разработке постоянно возникают новые технологии, призванные решить актуальные проблемы и упростить жизнь программистам. Одной из таких технологий стал GraphQL — язык запросов для API,. . .

Распознавание голоса и речи на C#

UnmanagedCoder 05.05.2025

Интеграция голосового управления в приложения на C# стала намного доступнее благодаря развитию специализированных библиотек и API. При этом многие разработчики до сих пор считают голосовое управление. . .

Реализация своих итераторов в C++

NullReferenced 05.05.2025

Итераторы в C++ — это абстракция, которая связывает весь экосистему Стандартной Библиотеки Шаблонов (STL) в единое целое, позволяя алгоритмам работать с разнородными структурами данных без знания их. . .

Разработка собственного фреймворка для тестирования в C#

UnmanagedCoder 04.05.2025

C# довольно богат готовыми решениями – NUnit, xUnit, MSTest уже давно стали своеобразными динозаврами индустрии. Однако, как и любой динозавр, они не всегда могут протиснуться в узкие коридоры. . .

Распределенная трассировка в Java с помощью OpenTelemetry

Javaican 04.05.2025

Микросервисная архитектура стала краеугольным камнем современной разработки, но вместе с ней пришла и головная боль, знакомая многим — отслеживание прохождения запросов через лабиринт взаимосвязанных. . .

Шаблоны обнаружения сервисов в Kubernetes

Mr. Docker 04.05.2025

Современные Kubernetes-инфраструктуры сталкиваются с серьёзными вызовами. Развертывание в нескольких регионах и облаках одновременно, необходимость обеспечения низкой задержки для глобально. . .

Создаем SPA на C# и Blazor

stackOverflow 04.05.2025

Мир веб-разработки за последние десять лет претерпел коллосальные изменения. Переход от традиционных многостраничных сайтов к одностраничным приложениям (Single Page Applications, SPA) — это. . .

В этом уроке поговорим о том, как можно визуализировать информацию с помощью графиков. Для этого будем использовать приложение WPF и элементы Windows Forms.

Для успешного освоения материала рекомендуем вам изучить следующие понятия:

DB (Database), БД. Организованная структура, предназначенная для хранения, изменения и обработки взаимосвязанной информации, преимущественно больших объемов

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

Windows Presentation Foundation. Аналог WinForms, система для построения клиентских приложений Windows с визуально привлекательными возможностями взаимодействия с пользователем, графическая (презентационная) подсистема в составе .NET Framework (начиная с версии 3.0), использующая язык XAML

Демонстрация работы с графиками в Windows Forms

На данном занятии будет разработано простое приложение Windows Forms для визуализации расходов пользователей. Пользователи распределяют затраты по разным категориям и хранят их в общей базе данных. Итогом работы приложения будет служить работающая форма, в которой для каждого пользователя можно построить диаграммы различных типов для визуализации их расходов по категориям. Основные шаги построения приложения:

  1. Разработка интерфейса приложения
  2. Настройка взаимодействия с базой данных
  3. Реализация обработки данных

Важно

В рамках примера используется готовая база данных с информацией о пользователях, их платежах и категориях расходов

Разработка интерфейса приложения

1. Устанавливаем структуру формы

Важно

Интерфейс приложения будет состоять из двух основных частей: области построения и области настройки параметров просмотра

2. Добавляем элементы настройки параметров просмотра

Важно

Элементами настройки параметров просмотра будут являться выпадающие списки, позволяющие выбрать пользователя и тип диаграммы

3. Подключаем библиотеки для просмотра диаграмм

Важно

Диаграмма будет визуализироваться с помощью элемента Chart из WindowsForms. Воспользоваться данным элементом можно после подключения библиотеки System.Windows.Forms.DataVisualization, расположенного во вкладке Assemblies (сборки)

4. Добавляем элементы управления диаграммой

Важно

Диаграмма будет располагаться внутри элемента WindowsFormsHost. Данный элемент добавляется из окна ToolBox простым перетаскиванием

5. Добавляем пространство имен для работы с элементом Chart

6. Добавляем дополнительные параметры просмотра

Важно

Дополнительными параметрами являются имя диаграммы, а также легенда

Настройка взаимодействия с базой данных

1. Реализуем взаимодействие с базой данных

Важно

Взаимодействие реализуется путем добавления элемента «ADO.NET Entity Data Model»

2. Настраиваем свойства подключения базы данных

3. Добавляем подключение к базе данных

Реализация обработки данных

1. Создаем область построения графиков

Важно

Сперва создается поле для контекста EntityFramework с инициализацией. Затем создается область построения диаграммы ChartArea и добавляется в соответствующую коллекцию в конструкторе MainWindow

2. Добавляем наборы данных

Важно

Для каждого набора данных (например, данные линии на графике) необходимо добавлять в коллекцию Series. В данном случае есть одна серия данных для отображения сумм платежей по категориям. Объект Series создается с указанием названия и необходимости отображения на диаграмме

3. Загружаем данные из базы

Важно

Данные о пользователях загружаются в выпадающий список. Также загружаются типы диаграммы из перечисления SeriesChartType

4. Реализуем адаптивное изменение интерфейса

Важно

При выборе другого значения в ComboBox будет вызываться метод UpdateChart()

5. Получаем выбранные значения в выпадающих списках

Важно

Значения получаются как currentUser и currentType

6. Обрабатываем данные диаграммы

Важно

Приведенный код описывает получение серии данных диаграммы из соответствующей коллекции Series, установку типа диаграммы и очистку предыдущих данных

7. Обрабатываем список категорий

Важно

Список категорий получается из базы данных. Далее, в цикле foreach для каждой категории значение точки диаграммы добавляется в Points. Координата X будет названием категории, а координата Y будет суммой платежа для выбранного пользователя в текущей категории

Результат работы программы

Вы познакомились с тем, как использовать основные элементы Windows Forms в приложении WPF. Теперь давайте перейдем от теории к практике!

Для закрепления полученных знаний пройдите тест

Для взаимодействия с базами данных используется технология

Для размещение элемента управления Windows Forms на странице WPF используется

WindowsFormsIntegration является

К сожалению, вы ответили неправильно

Прочитайте лекцию и посмотрите видео еще раз

Но можно лучше. Прочитайте лекцию и посмотрите видео еще раз

Вы отлично справились. Теперь можете ознакомиться с другими компетенциями

27
Haz

This example shows how to display your data in your Windows Forms program as a bar graph or spline chart. To achieve this, you use Chart class in System.Windows.Forms.DataVisualization.Charting. Chart control can be found in Toolbox(.NET Framework 4.0 or newer). Older versions will not have the Chart control available.
To add a chart control to your application,

  • In design view, open the Toolbox.
  • From the Data category, drag a Chart control to the design area.

If you cannot see the Chart control in the Toolbox, right click in the Toolbox, select Choose Items, and then select the following namespaces in the .NET Framekwork Components tab:

  • System.Web.UI.DataVisualization.Charting
  • System.Windows.Forms.DataVisualization.Charting

Usage:

        void FrmChartExample_Load(object sender, EventArgs e)
        {
            BarExample(); //Show bar chart
            //SplineChartExample();
        }


This method shows how to add a bar chart.

        public void BarExample()
        {
            this.chartControl.Series.Clear();

            // Data arrays
            string[] seriesArray = { "Cat", "Dog", "Bird", "Monkey" };
            int[] pointsArray = { 2, 1, 7, 5 };

            // Set palette
            this.chartControl.Palette = ChartColorPalette.EarthTones;

            // Set title
            this.chartControl.Titles.Add("Animals");

            // Add series.
            for (int i = 0; i < seriesArray.Length; i++)
            {
                Series series = this.chartControl.Series.Add(seriesArray[i]);
                series.Points.Add(pointsArray[i]);
            }
        }

This method shows how to add a spline chart.

        private void SplineChartExample()
        {
            this.chartControl.Series.Clear();

            this.chartControl.Titles.Add("Total Income");

            Series series = this.chartControl.Series.Add("Total Income");
            series.ChartType = SeriesChartType.Spline;
            series.Points.AddXY("September", 100);
            series.Points.AddXY("Obtober", 300);
            series.Points.AddXY("November", 800);
            series.Points.AddXY("December", 200);
            series.Points.AddXY("January", 600);
            series.Points.AddXY("February", 400);
        }

Понравилась статья? Поделить с друзьями:
0 0 голоса
Рейтинг статьи
Подписаться
Уведомить о
guest

0 комментариев
Старые
Новые Популярные
Межтекстовые Отзывы
Посмотреть все комментарии
  • Ноут не видит гарнитуру на windows 10
  • Как сделать из телефона второй монитор windows 10
  • Ios emoji for windows
  • Лучший бесплатный просмотрщик фотографий для windows 10
  • Google drive app for windows