lnd212/Graphs_dart
1
0
Fork 0
Code Issues Pull Requests Projects Releases 1 Wiki Activity

Загрузил(а) файлы в 'tex'

Browse Source
This commit is contained in:
Морозов Андрей 2021-11-23 12:53:52 +00:00
parent 3ff5b62054
commit a3bd0cc3fe
2 changed files with 103 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

110
tex/example-work.tex
View File

@ -23,7 +23,6 @@
\usepackage[cp1251]{inputenc}
\usepackage{graphicx}
\usepackage{minted}
\usepackage{spverbatim}
\usepackage{float}
\usepackage[sort,compress]{cite}
@ -116,7 +115,7 @@
% Раздел "Введение"
\intro
Целью настоящей работы является изучение работы фреймворка для кроссплатформенной разработки "Flutter" и разработка приложения для создания графов и взаимодействия с ними.
Целью настоящей работы является изучение работы фреймворка для кроссплатформенной разработки ''Flutter'' и разработка приложения для создания графов и взаимодействия с ними.
Поставлены задачи:
\begin{itemize}
@ -134,7 +133,7 @@
\subsection{Основные определения}
\textbf{Ориентированный граф} определяется как пара \textit{(V, E)}, где \textit{V} --- конечное множество, а \textit{E} --- бинарное отношение на \textit{V}, т.~е. подмножество множества ${V \times V}$. Ориентированный граф для краткости называют \textbf{орграфом}. Множетсво $V$ называют \textbf{множеством вершин графа}, а его элемент называют \textbf{вершиной} графа. Множество $E$ называют \textbf{множеством рёбер}, а его элементы называют \textbf{рёбрами}. Граф может содержать \textbf{рёбра-циклы}, соединяющие вершину с собой. На рисунке~\ref{fig:orgrapf_example} изображен оринетированный граф с множеством вершин \{0, 1, 2, 3, 4\}.~\citenum{Algo_2013}
\textbf{Ориентированный граф} определяется как пара \textit{(V, E)}, где \textit{V} --- конечное множество, а \textit{E} --- бинарное отношение на \textit{V}, т.~е. подмножество множества ${V \times V}$. Ориентированный граф для краткости называют \textbf{орграфом}. Множество $V$ называют \textbf{множеством вершин графа}, а его элемент называют \textbf{вершиной} графа. Множество $E$ называют \textbf{множеством рёбер}, а его элементы называют \textbf{рёбрами}. Граф может содержать \textbf{рёбра-циклы}, соединяющие вершину с собой. На рисунке~\ref{fig:orgrapf_example} изображен ориентированный граф с множеством вершин \{0, 1, 2, 3, 4\}.~\citenum{Algo_2013}
\begin{figure}[!ht]
\centering
@ -155,7 +154,7 @@
Вершина \textit{v} \textbf{смежна} с вершиной \textit{u}, если в графе имеется ребро $\{u, v\}$. Для неориентированных графов отношение смежности является симметричным, но для ориентированных графов это не обязательно.
\textbf{Степенью} вершины в неориентированном графе называется число инцидентных ей рёбер. Для ориентированного графа различают исходящую степень, определяемую как число выходящих из неё рёбер, и входящую степень, определяемую как число входящих в неё рёбер. Сумма исходяшей и входящей степеней называется степенью вершины.
\textbf{Степенью} вершины в неориентированном графе называется число инцидентных ей рёбер. Для ориентированного графа различают исходящую степень, определяемую как число выходящих из неё рёбер, и входящую степень, определяемую как число входящих в неё рёбер. Сумма исходящей и входящей степеней называется степенью вершины.
\textbf{Маршрутом} в графе называется конечная чередующаяся последовательность смежных вершин и ребер, соединяющих эти вершины.
@ -194,12 +193,12 @@ $$ V = \{a, b, c, d, e\} $$
$$ E = \{(a, b), (a, c), (a, e), (b, c), (b, d), (c, e), (d, e)\}$$
\subsubsection{Матрица смежности}\label{ref:smej}
Пусть $G$ --- граф с $n$ вершинами, пронумерованными числами от 1 до $n$. \textbf{Матрица смежности} --- это таблица с $n$ строками и $n$ столбцами, в которой элемент, стоящий на пересечении строки с номером $i$ и столбца с номером $j$, равен 1, еcли вершины с номерами $i$ и $j$ смежны, и 0, если они не смежны.
Пусть $G$ --- граф с $n$ вершинами, пронумерованными числами от 1 до $n$. \textbf{Матрица смежности} --- это таблица с $n$ строками и $n$ столбцами, в которой элемент, стоящий на пересечении строки с номером $i$ и столбца с номером $j$, равен 1, если вершины с номерами $i$ и $j$ смежны, и 0 в противоположном случае.
\begin{table}[!ht]
%\centering
\caption{Пример матрицы смежности}
\begin{tabular}{|p{15pt}|p{15pt}|p{15pt}|p{15pt}|p{15pt}|}
\begin{tabular}{|l|c|c|c|c|}
\hline 0 & 1 & 1 & 0 & 1\\
\hline 1 & 0 & 1 & 1 & 0\\
\hline 1 & 1 & 0 & 0 & 1\\
@ -211,12 +210,12 @@ $$ E = \{(a, b), (a, c), (a, e), (b, c), (b, d), (c, e), (d, e)\}$$
\subsubsection{Матрица инцидентности}\label{ref:incident}
Пусть $G$ --- граф с вершинами, пронумерованными числами от 1 до $n$, и ребрами, пронумеровнными от 1 до $m$. В матрице инцидентности строки соответствуют вершинам, а столбцы рёбрам. На пересечении строки с номером $i$ и столбца с номером $j$ стоит 1, если вершина с номером $i$ инцидентна ребру с номером $j$, и 0 в противном случае.
Пусть $G$ --- граф с вершинами, пронумерованными числами от 1 до $n$, и ребрами, пронумерованными от 1 до $m$. В матрице инцидентности строки соответствуют вершинам, а столбцы рёбрам. На пересечении строки с номером $i$ и столбца с номером $j$ стоит 1, если вершина с номером $i$ инцидентна ребру с номером $j$, и 0 в противном случае.
\begin{table}[!ht]
%\centering
\caption{Пример матрицы инцидентности}
\begin{tabular}{|p{15pt}|p{15pt}|p{15pt}|p{15pt}|p{15pt}|p{15pt}|p{15pt}|}
\begin{tabular}{|c|c|c|c|c|c|c|}
\hline 1 & 1 & 1 & 0 & 0 & 0 & 0\\
\hline 1 & 0 & 0 & 1 & 1 & 0 & 0\\
\hline 0 & 1 & 0 & 1 & 0 & 1 & 0\\
@ -229,8 +228,6 @@ $$ E = \{(a, b), (a, c), (a, e), (b, c), (b, d), (c, e), (d, e)\}$$
\subsubsection{Списки смежности}\label{ref:spisok}
Списки смежности часто используются для компьютерного представления графов. Для каждой вершины задается список всех смежных с ней вершин. В структурах данных, применяемых в программировании, списки смежности могут быть реализованы как массив линейных списков.
Указывается номер или имя вершины и перечисляются все смежные с ней вершины.
Пример:
\begin{itemize}
\item[1] : 2, 3, 5
@ -240,18 +237,78 @@ $$ E = \{(a, b), (a, c), (a, e), (b, c), (b, d), (c, e), (d, e)\}$$
\item[5] : 1, 3, 4
\end{itemize}
\subsection{Алгоритмы}
\subsubsection{Обход в ширину}
Поиск в ширину (обход в ширину, breadth-first search) --- один из основных алгоритмов на графах.
Пусть задан граф $G = (V, E)$ и выделена исходная вершина $s$. Алгоритм поиска в ширину систематически обходит все ребра $G$ для «открытия» всех вершин, достижимых из $s$, вычисляя минимальное количество рёбер от $s$ s до каждой достижимой из $s$ вершины.
Поиск в ширину имеет такое название потому, что в процессе обхода мы идём вширь, то есть перед тем как приступить к поиску вершин на расстоянии $k + 1$, выполняется обход вершин на расстоянии $k$~\cite{Algo_2013}.
Приведенная ниже процедура поиска в ширину BFS предполагает, что входной граф $G = (V, E)$ представлен при помощи списков смежности. Псевдокод:
\inputminted[fontsize=\footnotesize, linenos]{python}{./dart/pseudoBFS.txt}
Воспользуемся групповым анализом. Операции внесения в очередь и удаление из нее требует $O(1)$ времени. Следовательно на очередь потребуется $O(V)$ времени. Т.к. максимальная длина списков смежности $\theta(E)$, то время, необходимое для сканирования списков, равно $O(E)$. Расходы на инициализацию: $O(V)$. Таким образом, общее время работы алгоритма: $O(V + E)$. Время поиска в ширину линейно зависит от размера представления графа.
\subsubsection{Обход в глубину}
\inputminted[fontsize=\footnotesize, linenos]{python}{./dart/pseudoDFS.txt}
\section{Инструменты}
Рассмотрим используемый язык и библиотеку для отрисовки.
\subsection{Dart}
В качестве основы используется язык \textbf{Dart}, разработанный компанией Google, и широко используемый для кросс-платформенной разработки~\cite{dart_web}.
\subsection{Flutter}
Dart позиционируется в качестве замены/альтернативы JavaScript. Один из разработчиков языка Марк Миллер (Mark S. Miller) написал, что JavaScript «имеет фундаментальные изъяны»\cite{futureOfJavascript} («Javascript has fundamental flaws…»), которые невозможно исправить.
Версия 1.0 вышла в 14 ноября 2013 года.
Вторая версия была выпущена в августе 2018 года. В языке появилась надежная система типов, т.~е. во время выполнении программы все переменные будут гарантированно указанному типу~\cite{dart_sound}.
Пример HelloWorld на Dart:
\inputminted[fontsize=\footnotesize, linenos]{dart}{./dart/helloWorld.dart}
Dart поддерживает сокращенную запись. Код примера HelloWorld можно записать так:
\inputminted[fontsize=\footnotesize, linenos]{dart}{./dart/hW.dart}
Концепты языка~\cite{dart_tour}:
\begin{itemize}
\item Все, что можно поместить в переменную, является объектом, а каждый объект является частью класса;
\item Dart -- язык со строгой типизацией, но объявления типов опциональны, т.к. поддерживается определение типа при компиляции;
\item В версии языка 2.12 появилась Null безопасность. Каждый объект не может быть Null, если не указано обратное;
\item поддерживаются дженерики;
\item для объявления локальных функций и переменных необходимо начать имя со знака ''\_''
\end{itemize}
.
\subsection{Flutter}
Для отрисовки информации используется фреймворк c открытым исходным кодом ''Flutter'', разработанный компанией Google.
Flutter не использует нативные компоненты для отрисовки интерфейса. В его основе лежит графический движок ''Skia'', написанный преимущественно на С++.
Skia --- библиотека для работы с 2D графикой с открытым исходным кодом, поддерживающая работу на большом количестве платформ~\cite{skia_docs}
Первая версия выпущена в 2015 году под названием ''Sky'', работала только для Android-приложений. Основная заявленная особенность --- высокая графическая производительность (возможность отображения 120 кадров в секунду). Полная поддержка создания веб-приложений появилась в версии 2.0 (март 2021 года), также разрабатывается поддержка создания настольных приложений для Windows, macOS и Linux и Google Fuchsia.
Простейший пример приложения с использованием Flutter:
\inputminted[fontsize=\footnotesize, linenos]{dart}{./dart/flutter.dart}
\begin{figure}[!ht]
\centering
\includegraphics[width=11cm]{./pic/flutter0.png}
\caption{\label{fig:flutter_example}
Простейшее приложение на Flutter}
\end{figure}
\section{Реализация}
\subsection{Текст с формулами и леммой}
\subsection{Графы}
\subsubsection{Класс для вершины}
\subsubsection{Класс для графа}
\subsubsection{Алгоритмы}
\subsubsection{Кнопки}
\subsubsection{Отрисовка графа}
\subsection{Название другого подраздела}
\subsubsection{Более мелкий подраздел}
\subsubsection{Текст с таблицей}
\section{Таблица}
\subsection{Текст с таблицей}
\begin{table}[!ht]
\small
@ -278,17 +335,24 @@ $$ E = \{(a, b), (a, c), (a, e), (b, c), (b, d), (c, e), (d, e)\}$$
\end{tabular}
\end{table}
\subsubsection{Текст с кодом программы}
% Раздел "Заключение"
\conclusion
В настоящей работы приведен пример оформления студенческой работы средствами системы \LaTeX.
Было разработано простое приложение для создания и работы с графами с использованием Dart и Flutter.
Показано, как можно оформить документ в соответствии:
В приложении возможно:
\begin{itemize}
\item с правилами оформления курсовых и выпускных квалификационных работ, принятых в Саратовском государственном университете в 2012 году;
\item с правилами оформления титульного листа отчета о прохождении практики в соответствии со стандартом.
\item создать пустой граф;
\item добавить вершину;
\item удалить вершину;
\item добавить/изменить путь;
\item удалить путь;
\item сохранить граф;
\item загрузить граф;
\item построить минимальное остовное дерево с помощью алгоритма Крускала;
\item найти минимальный путь из выбранной вершины в другие с помощью алгоритма Дейкстры;
\item проверить доступность вершин с помощью обхода в глубину;
\item построить путь из одной вершины в другую с помощью обхода в ширину.
\end{itemize}
@ -317,7 +381,7 @@ $$ E = \{(a, b), (a, c), (a, e), (b, c), (b, d), (c, e), (d, e)\}$$
\inputminted[fontsize=\footnotesize, linenos]{dart}{./lib/pages/drawing_page.dart}
\section{Код отрисовки графа}\label{painter}
Выводит на экран информацияю из графа.
Вывод на экран информации из графа.
\inputminted[fontsize=\footnotesize, linenos]{dart}{./lib/src/curve_painter.dart}
\section{Код класса для работы с графом}\label{graph}
@ -325,6 +389,4 @@ $$ E = \{(a, b), (a, c), (a, e), (b, c), (b, d), (c, e), (d, e)\}$$
\inputminted[fontsize=\footnotesize, linenos]{dart}{./lib/src/graph.dart}
\noindent
\end{document}

18
tex/thesis.bib
View File

@ -42,7 +42,23 @@
@TechReport{futureOfJavascript,
title={Future of Javascript. [{Ý}ëåêòðîííîå ïèñüìî]},
note={URL:~\url{https://markmail.org/message/uro3jtoitlmq6x7t}}
note={URL:~\url{https://markmail.org/message/uro3jtoitlmq6x7t}},
year={2010}
}
@Manual{dart_sound,
title={The Dart type system. [{Ý}ëåêòðîííûé ðåñóðñ]},
note={URL:~\url{https://dart.dev/guides/language/type-system}(Äàòà îáðàùåíèÿ 20.11.2021). Çàãë. ñ ýêð. ßç. àíãë.},
}
@Manual{dart_tour,
title={A tour of the Dart language. [{Ý}ëåêòðîííûé ðåñóðñ]},
note={URL:~\url{https://dart.dev/guides/language/language-tour}(Äàòà îáðàùåíèÿ 20.11.2021). Çàãë. ñ ýêð. ßç. àíãë.},
}
@Manual{skia_docs,
title={Skia documentation. [{Ý}ëåêòðîííûé ðåñóðñ]},
note={URL:~\url{https://skia.org/docs/}(Äàòà îáðàùåíèÿ 20.11.2021). Çàãë. ñ ýêð. ßç. àíãë.},
}
@Comment{jabref-meta: databaseType:bibtex;}