Phát triển trang web giới thiệu khu du lịch ATK định hoá dựa trên công nghệ webgis

LỜI CẢM ƠN Em xin chân thành cảm ơn thầy – TS Nguyễn Văn Tảo TS Nguyễn Hải Minh tận tâm nhiệt tình dạy bảo suốt thời gian học làm đồ án tốt nghiệp, thầy dành nhiều thời gian quý báu để tận tình bảo, hướng dẫn, định hướng cho em thực đồ án, giúp em học hỏi kinh nghiệm quý báu đạt thành định Em xin chân thành cảm ơn thầy cô khoa Công nghệ thông tin nhiệt tình dạy bảo tạo điều kiện cho em suốt trình học trường Em xin cảm ơn bạn bè thành viên gia đình tạo điều kiện tốt nhất, động viên, cổ vũ em suốt trình học tập làm đồ án tốt nghiệp Do khả trình độ có hạn, kinh nghiệm thực tế chưa nhiều nên đồ án tốt nghiệp em không tránh khỏi thiếu sót Em mong nhận bảo thầy cô ý kiến đóng góp thầy cô bạn Cuối em xin gửi tới thầy, cô, anh, chị toàn thể bạn lời chúc tốt đẹp nhất, sức khỏe, thịnh vượng phát triển Chúc thầy cô đạt nhiều thành công công trồng người Em xin chân thành cảm ơn! Thái Nguyên, tháng năm 2016 Sinh viên Phạm Thị Thanh Huyền LỜI CAM ĐOAN Tôi xin cam đoan công trình nghiên cứu riêng hướng dẫn TS Nguyễn Văn Tảo TS Nguyễn Hải Minh Các nội dung kết đề tài trung thực chưa công bố hình thức trước Những thông tin viết, thống kê số liệu phục vụ cho việc phân tích, nhận xét, đánh giá thu thập từ nguồn khác có ghi rõ nguồn viết phần tài liệu tham khảo Nếu phát có gian lận xin hoàn toàn chịu trách nhiệm nội dung đồ án trước người hội đồng nhà trường Thái Nguyên, tháng năm 2016 MỤC LỤC LỜI CẢM ƠN LỜI CAM ĐOAN DANH MỤC HÌNH ẢNH LỜI MỞ ĐẦU CHƯƠNG CƠ SỞ LÝ THUYẾT 10 1.1 Các công cụ phát triển Web 10 1.1.1 Ngôn ngữ lập trình PHP 10 1.1.2 Hệ quản trị Cơ sở liệu MySQL 11 1.1.3 Ngôn ngữ kịch JavaScript 12 1.2 Hệ thống thông tin địa lý 16 1.2.1 Giới thiệu GIS .16 1.2.2 Giới thiệu WebGis 21 1.2.3 Google Map API 24 CHƯƠNG BÀI TOÁN QUẢNG BÁ VÀ TIỀM NĂNG DU LỊCH CỦA KHU DU LỊCH ATK ĐỊNH HOÁ 36 2.1 Về ATK Định Hoá 36 2.1.1 Tiềm du lịch ATK Định Hoá 36 2.1.2 Giải pháp phát triển du lịch bền vững ATK Định Hóa 37 2.2 Bài toán quảng bá du lịch 38 2.2.1 Các website quảng bá du lịch ATK Định Hoá .38 2.2.2 Yêu cầu toán 40 2.2.3 Tóm tắt nội dung hoạt động website 41 2.3 Phân tích, thiết kế chức hệ thống 42 2.3.1 Xác định tác nhân 42 2.3.2 Các chức hệ thống cần có 42 2.3.3 Biểu đồ Usecase 43 2.3.4 Biểu đồ Trình tự 57 2.3.5 Biểu đồ Hoạt động .65 2.3.6 Biểu đồ Lớp .68 2.3.7 Biểu đồ Thành phần 68 2.3.8 Biểu đồ Triển khai .69 2.4 Phân tích thiết kế liệu hệ thống 69 2.4.1 Mô tả liệu 69 2.4.2 Mô tả chi tiết bảng .69 2.4.3 Biểu đồ quan hệ CSDL .73 CHƯƠNG XÂY DỰNG CHƯƠNG TRÌNH 74 3.1 Mô tả toán .74 3.2 Môi trường cài đặt 74 3.2.1 Các công cụ sử dụng để xây dựng chương trình 74 3.2.2 Thử nghiệm Localhost 74 3.3 Giao diện website 74 3.3.1 Giao diện trang chủ .74 3.3.2 Giao diện đồ .78 3.4 Giao diện trang quản trị .80 KẾT LUẬN 85 TÀI LIỆU THAM KHẢO 86 DANH MỤC HÌNH ẢNH Hình 1.1 Kiến trúc hệ thống WebGis 22 Hình 1.2 Tạo API key 26 Hình 1.3 Tạo API key 26 Hình 1.4 Tạo API key 27 Hình 1.5 Tạo Markers đồ 32 Hình 1.6 Tạo Polyline đồ 33 Hình 1.7 Tạo Polygon đồ 34 Hình 1.8 Tạo Infowindows đồ 34 Hình 2.1 Trang web atkthainguyen.org 38 Hình 2.2 Trang web thainguyentourism.vn 39 Hình 2.3 Biểu đồ UseCase Tổng quát 43 Hình 2.4 Phân rã Usecase Quản lý địa điểm 44 Hình 2.5 Phân rã Usecase Quản lý loại địa điểm 44 Hình 2.6 Phân rã Usecase Quản lý tin tức 45 Hình 2.7 Phân rã Usecase Quản lý viết 45 Hình 2.8 Phân rã Usecase Tìm đường 46 Hình 2.9 Biểu đồ trình tự cho UC Đăng nhập 57 Hình 2.10 Biểu đồ trình tự cho UC Thêm địa điểm du lịch 57 Hình 2.11 Biểu đồ trình tự cho UC Sửa địa điểm du lịch 58 Hình 2.12 Biểu đồ trình tự cho UC Xoá địa điểm du lịch 58 Hình 2.13 Biểu đồ trình tự cho UC Thêm loại địa điểm du lịch 59 Hình 2.14 Biểu đồ trình tự cho UC Xoá loại địa điểm 59 Hình 2.15 Biểu đồ trình tự cho UC Sửa loại địa điểm 60 Hình 2.16 Biểu đồ trình tự cho use case Thêm tin tức 60 Hình 2.17 Biểu đồ trình tự cho use case Sửa tin tức 61 Hình 2.18 Biểu đồ trình tự cho use case Xoá tin tức 61 Hình 2.19 Biểu đồ trình tự cho use case Thêm viết 62 Hình 2.20 Biểu đồ trình tự cho use case Sửa viết 62 Hình 2.21 Biểu đồ trình tự cho use case Xoá viết 63 Hình 2.22 Biểu đồ trình tự cho use case Xem thông tin địa điểm du lịch 63 Hình 2.23 Biểu đồ trình tự cho use case Hiện dẫn 64 Hình 2.24 Biểu đồ trình tự cho use case Tìm đường Map 64 Hình 2.25 Biểu đồ trình tự cho use case Liên hệ 65 Hình 2.26 Biểu đồ hoạt động cho usecase Đăng nhập 65 Hình 2.27 Biểu đồ hoạt động cho usecase Quản lý địa điểm du lịch 66 Hình 2.28 Biểu đồ hoạt động cho usecase Quản lý loại địa điểm du lịch 66 Hình 2.29 Biểu đồ hoạt động cho usecase Xem thông tin địa điểm du lịch 67 Hình 2.30 Biểu đồ hoạt động cho usecase Tìm đường Map 67 Hình 2.31 Biểu đồ Lớp 68 Hình 2.32 Biểu đồ Thành phần 68 Hình 2.33 Biểu đồ Triển khai 69 Hình 2.34 Sơ đồ quan hệ thực thể 73 Hình 3.1 Giao diện trang chủ 75 Hình 3.2 Giao diện giới thiệu ATK Định Hoá 77 Hình 3.3 Giao diện thông tin địa điểm du lịch 77 Hình 3.4 Giao diện thông tin địa điểm du lịch đồ 78 Hình 3.5 Giao diện dẫn đường 79 Hình 3.6 Giao diện liên hệ người dùng 80 Hình 3.7 Giao diện đăng nhập quản trị 80 Hình 3.8 Giao diện Quản lý địa điểm du lịch 81 Hình 3.9 Giao diện Quản lý loại địa điểm du lịch 82 Hình 3.10 Giao diện Quản lý viết 82 Hình 3.11 Giao diện Quản lý tin tức 83 Hình 3.12 Danh sách đặc sản vùng ATK 83 Hình 3.13 Giao diện Quản lý tour du lịch 84 LỜI MỞ ĐẦU GIS-Geography Information System (Hệ thống thông tin địa lý) đời phát triển mạnh thời gian gần Cùng với bùng nổ cộng nghệ Internet, GIS phát triển công nghệ cho phép chia sẻ thông tin thông qua mạng toàn cầu cách kết hợp GIS Web Công nghệ Web GIS ngày phát triển đòi hỏi việc xem đồ Internet trọng kết hợp tạo thành WebGIS đáp ứng nhu cầu WebGIS xu hướng phổ biến không hiển thị dạng thông tin tuý mà hiển thị không gian hữu ích cho người sử dụng Bên cạnh đó, khu du lịch ATK chưa có ứng dụng cụ thể để tìm kiếm tra cứu thông tin quảng bá điểm du lịch di tích lịch sử Vì lý này, đề tài “Phát triển trang Web giới thiệu Khu du lịch ATK Định Hoá dựa công nghệ WebGis ” đề tài mà em lựa chọn làm đồ án tốt nghiệp Nội dung đề tài nghiên cứu tảng công nghệ GIS, từ đưa giải pháp đồ trực tuyến, khả xây dựng ứng dụng đồ ngôn ngữ lập trình từ xây dựng website đồ trực tuyến giới thiệu khu du lịch ATK-Định Hoá Mục đích đồ án ứng dụng GIS vào việc xây dựng website quảng bá du lịch ATK-Định Hoá Từ nhận tầm quan trọng sống đại với kỹ thuật ngày phát triển mạnh mẽ  Mục tiêu nghiên cứu:  Tìm hiểu hệ thống GIS, nghiên cứu công cụ ngôn ngữ để hỗ trợ cho việc thiết kế WebGIS  Ứng dụng GIS vào việc xây dựng trang web giới thiệu quảng bá du lịch ATK-Định Hoá  Phạm vi nghiên cứu:  Về giới hạn địa lý: Nghiên cứu xây dựng hệ thống thông tin địa lý hỗ trợ công tác quản lý điểm du lịch ATK( An toàn khu) Định Hoá  Về phần mềm sử dụng: Sử dụng phần mềm MapInfo Google Map API để xây dựng hệ thống giới thiệu quản lý điểm du lịch Chiến khu Việt Bắc- ATK Định Hoá  Bố cục đề tài: Gồm chương: Chương 1: Cơ sở lý thuyết Các công cụ xây dựng phát triển Web Hệ thống thông tin địa lý (GIS) Chương 2: Bài toán quảng bá tiềm du lịch Khu du lịch ATK Định Hoá Chương 3: Xây dựng Website quảng bá Khu du lịch ATK Định Hoá Mô tả toán Cài đặt chương trình Thiết kế giao diện Thái Nguyên, tháng năm 2016 CHƯƠNG CƠ SỞ LÝ THUYẾT 1.1 Các công cụ phát triển Web  Ngôn ngữ lập trình PHP  Lịch sử đời PHP PHP đời khoảng năm 1994, người phát minh mang tên Rasmus Lerdorf nhiều người phát triển ngày hôm PHP sử dụng nhiều ứng dụng Web thương mại điện tử, tính đến năm 2001 có khoảng triệu tên miền sử dụng mã nguồn PHP PHP phiên mã nguồn mở, điều cho phép bạn làm việc mã nguồn, thêm, chỉnh sửa, sử dụng hay phân phối chúng  Tại nên dùng PHP Để thiết kế Web động có nhiều ngôn ngữ lập trình khác để lựa chọn, cấu hình tính khác chúng đưa kết giống Chúng ta lựa chọn cho ngôn ngữ: ASP, PHP, Java, Perl… số loại khác Vậy lại nên chọn PHP Rất đơn giản, có lý sau mà lập trình Web không nên bỏ qua lựa chọn tuyệt vời PHP sử dụng làm Web động nhanh, dễ dàng, tốt so với giải pháp khác PHP có khả thực tích hợp chặt chẽ với hầu hết sở liệu có sẵn, tính linh động, bền vững khả phát triển không giới hạn Đặc biệt PHP mã nguồn mở tất đặc tính miễn phí, mã nguồn mở sẵn có nên cộng đồng nhà phát triển Web có ý thức cải tiến nó, nâng cao để khắc phục lỗi chương trình PHP vừa dễ với người sử dụng, vừa đáp ứng yêu cầu lập trình viên chuyên nghiệp, ý tưởng bạn PHP đáp ứng cách xuất sắc 10 Hình 3.3 Giao diện thông tin địa điểm du lịch Về giao diện thông tin địa điểm du lịch: Khi click vào địa điểm cụ thể trang chủ, thông tin địa điểm lên trang website Gồm tên địa điểm, hình ảnh nội dung địa điểm, bên viết link danh sách địa điểm liên quan khác 3.3.2 Giao diện đồ 103 Hình 3.4 Giao diện thông tin địa điểm du lịch đồ Về giao diện thông tin địa điểm du lịch đồ: đồ du lịch tỉnh Thái Nguyên khoanh vùng đường màu hồng Huyện Định Hoá nằm phía Tây Bắc Thái Nguyên Vị trí phân bổ di tích thể đồ icon, biểu tượng Bảng thích ký hiệu đồ Bảo tàng Di tích lịch sử Thắng cảnh 104 Nhà hàng Nhà nghỉ-khách sạn Lễ hội Điểm xã Khi click vào biểu tượng, thông tin địa điểm lên bảng bảng gồm thông tin về: tên địa điểm, hình ảnh địa điểm, miêu tả, giới thiệu địa điểm, vị trí địa điểm Nhấn button “Chi tiết” để hiển thị chi tiết địa điểm cửa sổ Nhấn “x” góc bên phải để thoát 105 Hình 3.5 Giao diện dẫn đường Về giao diện đường giao diện hiển thị đồ: Thanh công cụ tìm đường tích họp vào góc phải giao diện đồ Ô text “ Đi từ ” để nhập thông tin điểm chọn button “Vị trí tôi” để lấy toạ độ vào ô text “Đi từ” Kế điểm đến, ta lấy điểm đến cách click vào icon điểm đến tương ứng đồ , tên điểm đến tên địa điểm đồ lên ô “Đến” Click “Tìm kiếm”, đường dẫn tới địa điểm lên đường màu xanh dương Điểm đầu đường icon 106 đích đến icon Trên đường dẫn có icon biểu diễn cho hành động chuyển hướng đường Hình 3.6 Giao diện liên hệ người dùng 3.4 Giao diện trang quản trị 107 Hình 3.7 Giao diện đăng nhập quản trị Người quản trị nhập tên đăng nhập mật để đăng nhập vào hệ thống quản trị Nhấn button “Thoát ” để huỷ bỏ đăng nhập vào hệ thống 108 Hình 3.8 Giao diện Quản lý địa điểm du lịch Đăng nhập vào hệ thống quản trị, hệ thống tên đăng nhập người đăng nhập góc trái hình Giao diện mặc định trang quản trị Danh sách loại địa điểm du lịch Bên trái menu chức quản lý bên phải chức cập nhật với kí hiệu icon: icon chức Thêm icon chức Xoá icon chức Sửa 109 Hình 3.9 Giao diện Quản lý loại địa điểm du lịch Quản lý loại địa điểm gồm chức năng: Thêm mới, Sửa, Xoá loại địa điểm 110 Hình 3.10 Giao diện Quản lý viết Quản lý viết gồm chức năng: Thêm mới, Sửa, Xoá viết 111 Hình 3.11 Giao diện Quản lý tin tức Quản lý tin tức gồm chức năng: Thêm mới, Sửa, Xoá tin tức 112 Hình 3.12 Danh sách đặc sản vùng ATK 113 Hình: 3.13 Giao diện Quản lý tour du lịch 114 KẾT LUẬN  Kết đạt  Nghiên cứu tổng quan hệ thống thông tin địa lý - GIS  Tìm hiểu công cụ API Google Map phần mềm MapInfo để hỗ trợ cho việc số hóa đồ  Xây dựng trang web quảng bá điểm du lịch ATK Định Hoá với công nghệ WebGis  Quản lý liệu thông tin đồ  Định hướng phát triển Công cụ mà đề tài sử dụng để phát triển giải số vấn đề giúp người biên tập đồ, nhiên nhiều hạn chế thời gian chưa có nhiều kinh nghiệm lĩnh vực GIS, hướng phát triển đề tài sau:  Hoàn thiện chương trình với nhiều chức thao tác đồ  Thu thập liệu, xây dựng sở liệu đồ số đầy đủ thông tin giúp ích cho người quản lý người cần xem thông tin đồ  Tìm hiểu phát triền đề tài với công cụ khác như: ArcGIS, PostGIS,…  Sử dụng công cụ, phần mềm mã nguồn mở để không phát sinh nhiều chi phí mà đảm bảo tính hiệu quả, độ xác cáo an toàn, bảo mật 115 TÀI LIỆU THAM KHẢO I Tài liệu tiếng Việt [1] Đặng Văn Đức, Phân tích thiết kế hướng đối tượng UML, Nhà xuất Giáo dục, 2002 [2] Đoàn Văn Ban, Giáo trình Phân tích thiết kế hướng đối tượng, Nhà xuất Khoa học Kỹ thuật, 2000 [3] Bộ môn Mạng & Truyền thông, Khoa Công nghệ thông tin, Trường ĐH CNTT & TT, Bài giảng môn học Phát triển ứng dụng môi trường mạng [4] Học viện Công nghệ bưu viễn thông, Giáo trình phân tích thiết kế hệ thống thông tin II Tài liệu tham khảo từ Internet [5] http://thachpham.com [6] http://hocwebchuan.com [7] http://gisvn.com.vn/forum.php [8] http://hocphp.info/ [9] http://atkthainguyen.org.vn/ [10]http://thainguyentourism.vn/vi/page/ [11]http://gisvn.com.vn/forum.php [12]http://www.w3schools.com/ [13]https://developers.google.com/maps/documentation/javascript/tutorial 116 NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN Thái Nguyên, ngày tháng năm 2016 GIÁO VIÊN HƯỚNG DẪN 117 ... quảng bá điểm du lịch di tích lịch sử Vì lý này, đề tài Phát triển trang Web giới thiệu Khu du lịch ATK Định Hoá dựa công nghệ WebGis ” đề tài mà em lựa chọn làm đồ án tốt nghiệp Nội dung đề tài... Định Hoá 36 2.1.1 Tiềm du lịch ATK Định Hoá 36 2.1.2 Giải pháp phát triển du lịch bền vững ATK Định Hóa 37 2.2 Bài toán quảng bá du lịch 38 2.2.1 Các website quảng bá du. .. 1.2.1 Giới thiệu GIS .16 1.2.2 Giới thiệu WebGis 21 1.2.3 Google Map API 24 CHƯƠNG BÀI TOÁN QUẢNG BÁ VÀ TIỀM NĂNG DU LỊCH CỦA KHU DU LỊCH ATK ĐỊNH HOÁ 36 2.1 Về ATK Định