\chapter{ทฤษฎีที่เกี่ยวข้อง}
ในการจัดทำโครงงานคอมพิวเตอร์ในครั้งนี้ ผู้จัดทำโครงงานได้ศึกษาเอกสารและจากเว็บไชต์ต่างๆ ที่เกี่ยวข้องดังต่อไปนี้
\section{ความรู้พื้นฐาน PHP}
	\subsection{คุณสมบัติของภาษา PHP}
ภาษา PHP \cite{bib1} ที่ลักษณะเป็นแบบ Server Side Script คือจะอ่านโค้ด และทำงานที่เซิร์ฟเวอร์ จากนั้นจะส่งผลลัพธ์ที่ได้จากการประมวลผลกลับมาที่เครื่องของผู้ใช้ในรูปแบบของ HTML ซึ่งโค้ด PHP จะไม่สามารถมองเห็นได้
PHP สามารถทำงานร่วมกับระบบจัดการฐานข้อมูลที่หลากหลาย เช่น Oracle, MySQL เป็นต้น

	\subsection{โครงสร้างของภาษา PHP}
	ในภาษา PHP จะใช้เครื่องหมาย semicolon (;) ในการจบการทำงานของแต่ละคำสั่งเช่นเดียวกับภาษา C, C++ หรือ Java ภาษา PHP สามารถเขียนร่วมกับคำสั่ง Tag ของ HTML ได้ ตัวอย่างเช่น
	\begin{figure}[H]
		{\setstretch{1.0}\begin{lstlisting}
<html>
<head> 
</head>
<body>
<?php
echo"Hi";
?>
</body>
</html>			
			\end{lstlisting}}
		\caption{การจบการทำงานในแต่ละคำสั่งของภาษา PHP}
		\label{Fig:Php}
	\end{figure}
	
	จากตัวอย่างในรูปที่ \ref{Fig:Php} บรรทัดที่ 5 – 7 เป็นส่วนของภาษา PHP ซึ่งเขียนเริ่มต้นด้วย <?php ตามด้วยคำสั่ง และปิดด้วย ?> คำสั่ง echo จะใช้สำหรับแสดงข้อความ ภาษาPHPสามารถเปิดและปิดด้วย Tag ของ  PHP ได้หลายครั้งดังตัวอย่างในรูป \ref{Fig:Tagphp}

	\begin{figure}[H]
		{\setstretch{1.0}\begin{lstlisting}
<html>
<head> 
</head>
<body>
<?php
 echo"Hi";
?>
<?php
 echo"Hi";
?>
</body>
</html>
		
			\end{lstlisting}}
		\caption{การสร้างTag PHP}
		\label{Fig:Tagphp}
	\end{figure}
\subsection{ตัวแปร}
การประกาศตัวแปรในภาษา PHP ไม่ต้องกำหนดประเภทของตัวแปร ซึ่งตัวแปรจะขึ้นต้นด้วยเครื่องหมาย Dollar sign (\$) และตามด้วยชื่อตัวแปร ชื่อตัวแปรไม่สามารถขึ้นต้นด้วยตัวเลขได้
\subsection{Srting}
การประกาศตัวแปร  string สามารถทำได้ 2 แบบโดยการใช้ Double quote ("") หรือ Single quote ('') ซึ่งจะให้ผลลัพธ์แตกต่างกัน การใช้ Double quote จะทำให้สามารถแทรกตัวแปรใน string ได้ แต่การประกาศแบบ Single quote จะแสดงผลลัพธ์ของ string ตามที่ได้ประกาศไว้ในตัวแปร
การต่อ string คือการนำ string มาต่อรวมกันและได้ผลลัพธ์ใหม่ ในภาษา PHP จะใช้เครื่องหมาย Dot (.) ในการต่อ string เข้าด้วยกัน ดังตัวอย่างในรูป \ref{Fig:string}
\begin{figure}[H]
	{\setstretch{1.0}\begin{lstlisting}
$firstname = "Samu";
$lastname = "Rai";
$fullname = $firstname.$lastname;

		\end{lstlisting}}
	\caption{การต่อ String}
	\label{Fig:string}
\end{figure}
\section{ความรู้พื้นฐาน Laravel Framework}
Laravel Framework \cite{bib2} เป็น PHP Framework สำหรับการพัฒนาเว็บแอปพลิเคชัน ถูกพัฒนาโดย Taylor Otwell และทีมงาน Laravel Framework เป็น open-source framework  ทำให้นักพัฒนานำไปใช้ได้อย่างเสรี ทั้งในทางการค้าและไม่ใช่ทางการค้า 
\subsection{การติดตั้ง Laravel}
\begin{enumerate}
	\item ลง composer เพื่อใช้ในการติดตั้ง Laravel Framework
	\item เปิด command line เพื่อติดตั้ง Laravel Framework โดยใช้คำสั่ง        composer create-project --prefer-dist laravel/laravel blog
	\item หลังจากติดตั้งเรียบร้อยแล้วให้เปิดเข้าไปใน Folder และทำการ Run โดยใช้คำสั่ง php artisan serve
\end{enumerate}
\subsection{โครงสร้างของ Laravel}
\begin{enumerate}
	\item 	app เป็นโฟลเดอร์ที่ใช้เก็บไฟล์จำพวก Model หรือ Controller ที่ใช้ในการประมวลผลและติดต่อกับฐานข้อมูล
	\item	database เป็นโฟลเดอร์ที่ใช้เก็บไฟล์จำพวก Migrations และ Seeding เพื่อใช้ในการสร้าง Table หรือใส่ข้อมูลในฐานข้อมูลผ่านคำสั่ง “artisan” ของ laravel
	\item 	resources ใช้เก็บโฟลเดอร์ที่ใช้ในส่วนของการแสดงผลต่างๆ 
	\item routes เป็นส่วนที่ใช้เก็บไฟล์ในการกำหนด Url ของ web 
	\item storage เป็นส่วนของคลังพื้นที่จัดเก็บข้อมูลตระกูล Session, caches หรือไฟล์ที่ถูกทาง blade engine ทำการ compiled มาแล้ว 
	\item ไฟล์ .env เป็นไฟล์ที่ใช้ config laravel กับ ฐานข้อมูล
\end{enumerate}
\subsection{view}
View คือส่วนที่ใช้สำหรับแสดงผลของเว็บ โดยใช้ HTML ในการจัดการส่วนนี้ ซึ่งจะถูกเก็บไว้ใน resources/views สามารถใช้ไฟล์ที่เป็นนามสกุล .html .php และ.blade.php ซึ่งการใช้งาน .blade.php จะเป็นการใช้งาน laravel blade template
\subsubsection{blade template}
การใช้งาน blade template \cite{bib5} จะต้องตั้งชื่อไฟล์ที่มีนามสกุลเป็น .blade.php การใช้งาน blade template จะทำให้โค้ดดูอ่านง่ายขึ้น ทำให้นักพัฒนาสะดวกยิ่งขึ้น ใน blade template จะใช้เครื่องหมาย {{ }} ครอบตัวแปร จะเหมือนกับคำสั่ง echo ตัวอย่างเช่น {{\$name}} จะเป็นการเอาค่า \$name ออกมาแสดง  
\subsection{Controller}
Controller ทำหน้าที่เป็นส่วนจัดการการทำงานของระบบ โดยการสร้าง Controller จะใช้คำสั่ง  php artisan make:controller BlogController  ไฟล์ Controller ที่สร้างจะอยู่ที่ app/Http/Controllers ตัวอย่าง Code ใน Controller
\begin{figure}[H]
	{\setstretch{1.0}\begin{lstlisting}
<?php
namespace App\Http\Controller;
use Iluminate\Http\Request;
Class BlogController extends Controller{
Public function index(){
echo ‘Hello’;
}
}

		\end{lstlisting}}
	\caption{Controller}
	\label{Fig:controller}
\end{figure}
จากตัวอย่างในรูป \ref{Fig:controller} ถ้าทำการเรียกใช้ BlogController และ function index() จะทำการแสดงผลลัพธ์ว่า Hello โดยการเรียกใช้งานจะกำหนดอยู่ที่ Route
\subsection{Route}
Route เป็นการกำหนดเส้นทางให้กับเว็บว่าให้ไปทำงานที่ controller หรือ แสดงที่ view และยังสามารถส่งพารามิเตอร์ผ่าน Route ได้ ไฟล์ที่ใช้กำหนด Route จะอยู่ใน routes/web.php ตัวอย่างของการกำหนด Route
\begin{figure}[H]
	{\setstretch{1.0}\begin{lstlisting}
Route::get('/', function(){
return view('welcome');
})

		\end{lstlisting}}
	\caption{การกำหนด Route}
	\label{Fig:route1}
\end{figure}
จากตัวอย่างในรูป \ref{Fig:route1} หมายความว่าเมื่อเปิดหน้าแรกขึ้นมาจะแสดง view welcome
\begin{figure}[H]
	{\setstretch{1.0}\begin{lstlisting}
Route::get('/', 'BlogController@index')
		\end{lstlisting}}
	\caption{การเรียกใช้งาน Controller ผ่าน Route}
	\label{Fig:route2}
\end{figure}

จากตัวอย่างในรูป \ref{Fig:route2}จะเป็นการเรียกใช้ Controller ชื่อ BlogController และ Function index() ให้ทำงาน 
\begin{figure}[H]
	{\setstretch{1.0}\begin{lstlisting}
Route::get('product/{id}', 'BlogController@test')	
		\end{lstlisting}}
	\caption{การส่งพารามิเตอร์ผ่าน Route}
	\label{Fig:route3}
\end{figure}

จากตัวอย่างในรูป \ref{Fig:route3} จะเป็นการส่งพารามิเตอร์ {id} ไปด้วย โดยพารามิเตอร์ต้องคลุมด้วยเครื่องหมาย {} เสมอ
\subsection{Model}
Model จะทำหน้าที่สำหรับดึงข้อมูลจากตารางของฐานข้อมูลมาใช้งาน โดยไม่จำเป็นต้องเขียนคำสั่ง SQL โดยปกติชื่อของ Model จะดึงข้อมูลและจัดเก็บข้อมูลจากตารางชื่อเดียวกัน ยกตัวอย่างการสร้าง Model ชื่อ Product จะใช้คำสั่งดังแสดงในรูปที่ \ref{Fig:model}
\begin{figure}[H]
	{\setstretch{1.0}\begin{lstlisting}
		php artisan make:model Product	
		\end{lstlisting}}
	\caption{การสร้าง model}
	\label{Fig:model}
\end{figure}
การสร้างข้อมูลหรือการดึงข้อมูลจากตาราง ต้องทำการกำหนดการเข้าถึงของ column ในตารางก่อน โดยการกำหนดการเข้าถึงจะใช้ fillable หรือ guarded ตัวอย่างการใช้งาน
\begin{enumerate}
\item Fillable คือการกำหนดชื่อของ column ที่ต้องการอนุญาตให้เข้าถึง protected \$fillable = ['name'];
\item Guarded คือการกำหนดชื่อของ column ที่ไม่อนุญาตให้เข้าถึง protected \$guarded = ['name'];
protected \$guarded = [];
การกำหนด guarded เป็นค่าว่างจะหมายถึง column ทุก column สามารถเข้าถึงได้
\end{enumerate}
การ query ข้อมูลจาก Model สามารถ query ข้อมูลได้ทั้งใน Route และ Controller  โดยจะต้องทำการ use  Model ก่อน ตัวอย่างการ query ข้อมูลใน Controller
\begin{figure}[H]
	{\setstretch{1.0}\begin{lstlisting}
<?php
use App\Flight;
$flights = Flight::all();
foreach ($flights as $flight) {
echo $flight->name;
}
$flights = Flight::where('id', 1)->get();
			
		\end{lstlisting}}
	\caption{การ query ข้อมูลจาก Model}
	\label{Fig:model2}
\end{figure}
จากตัวอย่างในรูป \ref{Fig:model2} \$flights = Flight::all(); จะเป็นการดึงข้อมูลทั้งหมดมาเก็บไว้ในตัวแปร \$flights ส่วนคำสั่ง \$flights = Flight::where('id', 1)
->get(); จะเป็นการดึงข้อมูลที่มีค่า id เท่ากับ 1 มาเก็บในตัวแปร \$flights
\section{Guzzle}
Guzzle \cite{bib3} เป็น HTTP Client ที่ใช้สำหรับส่ง HTTP requests และเชื่อมต่อกับ Web services เพื่อแลกเปลี่ยนข้อมูลได้ Guzzle ทำงานได้กับ PHP 5.5.0 ขึ้นไป การติดตั้ง Guzzle จะติดตั้งผ่าน composer โดยใช้คำสั่ง	composer require guzzlehttp/guzzle
\subsection{การใช้งาน Guzzle}
การใช้งาน Guzzle จะต้องทำการ use ตัว Guzzle ก่อนโดยต้องประกาศไว้ที่ด้านบนจากนั้นทำการ new Client() และส่ง request ผ่าน method request ดังนี้
\begin{figure}[H]
	{\setstretch{1.0}\begin{lstlisting}
<?php
namespace App;
use GuzzleHttp\Client;
$client = new Client();
$response = $client->request($method, $url, $options)

		\end{lstlisting}}
	\caption{การใช้งาน Guzzle}
	\label{Fig:guzzle}
\end{figure}
\begin{enumerate}
	\item \$method คือ HTTP Method ได้แก่ GET,POST,PUT,DELETE
	\item \$url คือ url ที่จะทำการ request
	\item \$options เป็น Array สำหรับเก็บ option ต่างๆ เช่น Header และAuthentication เป็นต้น
\end{enumerate}
ตัวอย่างการ GET ค่าจาก URL  https://maps.googleapis.com/maps/api
\begin{figure}[H]
	{\setstretch{1.0}\begin{lstlisting}
<?php
namespace App;
use GuzzleHttp\Client;
$client = new Client();
$response = 
$client->request(‘GET’,’https://maps.googleapis.com/maps/api’);
echo $response->getBody();
		
		\end{lstlisting}}
	\caption{ตัวอย่างการใช้งาน Method GET}
	\label{Fig:guzzle2}
\end{figure}
การส่ง headers ใน Guzzle จะต้องเขียนใน Array ดังตัวอย่างในรูป \ref{Fig:guzzle3} 
\begin{figure}[H]
	{\setstretch{1.0}\begin{lstlisting}
<?php
namespace App;
use GuzzleHttp\Client;
$client = new Client();
$response = 
$client->request(‘GET’,’https://maps.googleapis.com/maps/api’,
[
‘headers’=>[
‘key’ => ‘f40asd5’
]
]
);
echo $response->getBody();
	
		\end{lstlisting}}
	\caption{ตัวอย่างการใช้งาน headers}
	\label{Fig:guzzle3}
\end{figure} 
\section{Distance Matrix API}
Distance Martrix API \cite{bib4} เป็นหนึ่งในบริการ Web Service ของ google map โดย Distance Martrix API มีความสามารถในการคำนวณระยะทางจากสถานที่ต้นทางไปยังสถานที่ปลายทางและสามารถกำหนดปลายทางได้หลายตำแหน่ง ข้อมูลที่ได้รับกลับจาก Web Service จะอยู่ในรูปแบบ JSON หรือ XML ระบบเว็บไซต์หรือแอปพลิเคชันสามารถนำข้อมูลเหล่านี้ไปแสดงผลหรือประยุกต์ใช้ต่อได้ การใช้งาน Distance Matrix API ต้องส่งคำขอเป็น URL string โดยมีแบบฟอร์มดังในรูปที่ \ref{Fig:api}
\begin{figure}[H]
	{\setstretch{1.0}\begin{lstlisting}
https://maps.googleapis.com/maps/api/distancematrix/outputFormat?parameters
		\end{lstlisting}}
	\caption{ตัวอย่าง URL ที่เรียกใช้งาน Distance Matrix API }
	\label{Fig:api}
\end{figure} 
outputFormat สามารถเลือกค่าได้ดังต่อไปนี้
\begin{enumerate}
	\item json ตัวอย่างผลลัพธ์ที่ถูกส่งกลับมา
	\begin{figure}[H]
		{\setstretch{1.0}\begin{lstlisting}
{
"status": "OK",
"origin_addresses": [
"Vancouver, BC, Canada"
],
"destination_addresses": [
"Victoria, BC, Canada"
],
"rows": [
{
"elements": [
{
"status": "OK",
"duration": {
"value": 24487,
"text": "6 heures 48 minutes"
},
"distance": {
"value": 129324,
"text": "129 km"
}
}
]
}
]
}

			\end{lstlisting}}
		\caption{ตัวอย่างผลลัพธ์ในรูปแบบ json}
		\label{Fig:api2}
	\end{figure} 
	\item xml ตัวอย่างผลลัพธ์ที่ถูกส่งกลับมา
	\begin{figure}[H]
		{\setstretch{1.0}\begin{lstlisting}
{
"status": "OK",
"origin_addresses": [
"Vancouver, BC, Canada"
],
"destination_addresses": [
"Victoria, BC, Canada"
],
"rows": [
{
"elements": [
{
"status": "OK",
"duration": {
"value": 24487,
"text": "6 heures 48 minutes"
},
"distance": {
"value": 129324,
"text": "129 km"
}
}
]
}
]
}
			
			\end{lstlisting}}
		\caption{ตัวอย่างผลลัพธ์ในรูปแบบ xml}
		\label{Fig:api3}
	\end{figure} 
\end{enumerate}
parameters พารามิเตอร์แต่ละตัวจะถูกคั่นด้วยเครื่องหมาย ‘\&’ โดยมีพารามิเตอร์ที่จำเป็นดังต่อไปนี้
\begin{enumerate}
	\item origins คือจุดเริ่มต้นสำหรับคำนวณระยะทางโดยสามารถใส่ในรูปแบบของที่อยู่พิกัดละติจูดและลองจิจูด ที่อยู่ หรือรหัสสถานที่ โดยใช้เครื่องหมาย | คั่นกรณีมีหลายตำแหน่ง เช่น
	origins=41.43206,-81.38992|-33.86748,151.20699
	
	\item destinations คือจุดปลายทางสำหรับการคำนวณโดยสามารถใส่ในรูปแบบของที่อยู่พิกัดละติจูดและลองจิจูด ที่อยู่ หรือรหัสสถานที่ โดยใช้เครื่องหมาย | คั่นกรณีมีหลายตำแหน่ง เช่น
	destinations= San+Francisco|Vancouver+BC
	
	\item key คือรหัส API ที่ได้ทำการขอใช้งานจาก google 
\end{enumerate}
\section{การหาลำดับการเดินทาง}
การหาลำดับการเดินทางของระบบท่องเที่ยวอีสาน จะจัดลำดับโดยการเลือกสถานที่ที่อยู่ใกล้กับตำแหน่งปัจจุบันของผู้ใช้งาน ตัวอย่างเช่น ผู้ใช้งานต้องการไป ธาตุก่องข้าวน้อย ศาลเจ้าพ่อหลักเมือง และวิมานพญาแถน ซึ่งจากตำแหน่งปัจจุบันไปธาตุก่องข้าวน้อย 20กม. ตำแหน่งปัจจุบันไปศาลเจ้าพ่อหลักเมือง 13กม. และตำแหน่งปัจจุบันไปวิมานพญาแถน 14กม. ระบบจะทำการเลือกไปศาลเจ้าพ่อหลักเมืองก่อน จากนั้นจะดูว่าจากศาลเจ้าพ่อหลักเมืองใกล้สถานที่ใดก็จะเลือกสถานที่นั้นต่อไป ในตัวอย่างนี้จะทำการเลือกวิมานพญาแถนและธาตุก่องข้าวน้อยตามลำดับ
\begin{figure}[H]
	\centering
	\includegraphics[width=\textwidth]{Figures/2/1}
	\caption{ตัวอย่างลำดับการเดินทางที่ได้จากระบบ}
	\label{Fig:result1}
\end{figure}
\begin{figure}[H]
	\centering
	\includegraphics[width=\textwidth]{Figures/2/2}
	\caption{ตัวอย่างลำดับการเดินทางที่เรียงลำดับตามสถานที่ที่เลือก}
	\label{Fig:result2}
\end{figure}
\section{เอกสารและงานวิจัยที่เกี่ยวข้อง}
\subsection{Google Maps}
Google Maps เป็นเว็บไซต์ที่สามารถแสดงเส้นทางการเดินทาง โดยผู้ใช้งานสามารถเลือกสถานที่ที่ต้องการไปได้ สามารถเข้าใช้งานได้ทาง https://www.google.co.th/maps
\begin{enumerate}
	\begin{figure}[H]
		\centering
		\includegraphics[width=14cm]{Figures/2/googlemap}
		\caption{หน้าแรกของ Google Maps}{ที่มา : https://www.google.co.th/maps}
		\label{Fig:googlemap}
	\end{figure}
\end{enumerate}
\subsection{Thailand Tourism Directory}
Thailand Tourism Directory เป็นเว็บไซต์ค้นหาสถานที่ท่องเที่ยว ร้านอาหาร ที่พัก ในประเทศไทย สามารถเข้าใช้งาน
ได้ทาง https://thailandtourismdirectory.go.th/th/home
\begin{enumerate}
	\begin{figure}[H]
		\centering
		\includegraphics[width=14cm]{Figures/2/tourism}
		\caption{หน้าแรกของ Thailand Tourism Directory}{ที่มา : https://thailandtourismdirectory.go.th/th/home}
		\label{Fig:tourism}
	\end{figure}
\end{enumerate}