Ứng dụng công nghệ webgis trong xây dựng website quản lý thông tin các điểm bưu điện của tỉnh thái nguyên

LỜI CẢM ƠN Em xin gửi lời cảm ơn chân thành tri ân sâu sắc thầy cô khoa Công nghệ thông tin - Đại học Công nghệ thông tin truyền thông – ĐHTN tạo điều kiện cho em tham gia hoàn thiện đồ án Và em xin chân thành cảm ơn cô Ths Hồ Thị Tuyến nhiệt tình hướng dẫn em hoàn thành tốt đồ án tốt nghiệp Trong trình làm bài, trình làm báo cáo, khó tránh khỏi sai sót, em mong nhận góp ý Thầy, Cô hội đồng để em học thêm nhiều kinh nghiệm Em xin chân thành cảm ơn! Thái Nguyên, ngày tháng năm 2016 Sinh viên thực Trần Lan Phương LỜI CAM ĐOAN Em xin cam đoan: Toàn nội dung đồ án tốt nghiệp“Ứng dụng công nghệ WebGis xây dựng WebSite quản lý thông tin điểm bưu điện tỉnh Thái Nguyên” Do em tự học tập, tìm hiểu từ trình học tập trường, nghiên cứu Internet, sách báo, tài liệu có liên quan Không chép hay sử dụng làm khác Em xin chịu hoàn toàn trách nhiệm lời cam đoan trước Quý thầy Cô nhà trường Thái Nguyên, ngày tháng năm 2016 NGƯỜI CAM ĐOAN Trần Lan Phương MỤC LỤC LỜI CẢM ƠN LỜI CAM ĐOAN MỤC LỤC DANH MỤC HÌNH ẢNH DANH MỤC BẢNG LỜI NÓI ĐẦU CHƯƠNG TỔNG QUAN VỀ CƠ SỞ LÝ THUYẾT 1.1 Tổng quan HTML-CSS 1.1.1 Giới thiệu HTML 1.1.2 Giới thiệu CSS 1.2 Tổng quan WebGis 1.2.1 Tổng quan kiến trúc WebGis 1.2.2 Tổng quan Google Map API6 1.3 Tổng quan UML 17 1.4 Hệ quản trị CSDL MySQL 27 CHƯƠNG KHẢO SÁT PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG 2.1 Khảo sát hệ thống 33 33 2.1.1 Giới thiệu hệ thống điểm bưu điện 33 2.1.2 Hiện trạng việc quản lý quản lý điểm bưu điện địa bàn tỉnh Thái Nguyên 34 2.1.3 Bài toán đặt 34 2.1.4 Yêu cầu hệ thống 35 2.2 Phân tích hệ thống 35 2.2.1 Sơ đồ USE CASE 35 2.2.2 Sơ đồ trình tự xem thông tin bưu điện 37 2.2.3 Sơ đồ trình tự xem đồ điểm bưu điện 38 2.2.4 Sơ đồ trình tự tìm kiếm điểm bưu điện 39 2.2.5 Sơ đồ trình tự tìm đường đồ 2.2.6 Sơ đồ trình tự thêm điểm bưu điện 41 2.2.7 Sơ đồ trình tự sửa thông tin điểm bưu điện 2.2.8 Sơ đồ trình tự xóa điểm bưu điện 2.2.9 Sơ đồ trình tự thêm tin 44 2.2.10 Sơ đồ trình tự sửa tin tức 45 2.3 Thiết kế hệ thống 40 42 43 46 2.3.1 Biểu đồ lớp tổng quát 46 2.3.2 Biểu đồ hoạt động 47 2.3.3 Ánh xạ sang bảng liệu 48 2.3.4 Sơ đồ thực thể liên kết 50 CHƯƠNG XÂY DỰNG CHƯƠNG TRÌNH DEMO VỀ HỆ THỐNG 3.1 Giao diện trang Web 51 3.2 Giao diện quản lý 55 KẾT LUẬN 58 TÀI LIỆU THAM KHẢO 59 51 DANH MỤC HÌNH ẢNH Hình 1.1: Kiến trúc hệ thống WebGIS Hình 1.2: Tạo API key Hình 1.3: Tạo Markers đồ 13 Hình 1.4: Tạo Polyline đồ 14 Hình 1.5: Tạo Polygon đồ 15 Hình 1.6: Tạo Infowindows đồ 16 Hình 1.7: Sơ đồ ca sử dụng mẫu 19 Hình 1.8: Đối tượng lớp mẫu sơ đồ lớp 20 Hình 1.9: Một sơ đồ trình tự mẫu 22 Hình 1.10: Sơ đồ hoạt động24 Hình 1.11: Một sơ đồ thành phần 25 Hình 1.12: Sơ đồ triển khai 26 Hình 1.13: Hệ quản trị CSDL mysql 27 Hình 2.1: Sơ đồ USER CASE tổng quát 36 Hình 2.2: Sơ đồ USER CASE phân rã chức quản lý thông tin điểm bưu điện 36 Hình 2.3: Sơ đồ USER CASE phân rã chức quản lý tin tức Hình 2.4: Sơ đồ trình tự xem thông tin bưu điện 37 Hình 2.5: Sơ đồ trình tự xem đồ 38 Hình 2.5: Sơ đồ trình tự tìm kiếm điểm bưu điện39 Hình 2.6: Sơ đồ trình tự tìm đường đồ Hình 2.7: Sơ đồ trình tự thêm điểm bưu điện 41 Hình 2.8: Sơ đồ trình tự sửa thông tin điểm bưu điện Hình 2.9: Sơ đồ trình tự xóa điểm bưu điện Hình 2.10: Sơ đồ trình tự thêm tin 44 Hình 2.11: Sơ đồ trình tự sửa tin tức 45 40 43 42 37 Hình 2.12: Sơ đồ lớp tổng quát 46 Hình 2.13: Sơ đồ hoạt động tìm kiếm thông tin điểm bưu điện 47 Hình 2.14: Sơ đồ hoạt động tìm đường đồ 47 Hình 2.15: Sơ đồ hoạt động thêm thông tin điểm bưu điện 48 Hình 2.16: Sơ đồ thực thể liên kết 50 Hình 3.1: Giao diện trang chủ 51 Hình 3.2: Giao diện trang xem đồ 52 Hình 3.3: Giao diện trang cập nhật53 Hình 3.4: Giao điện trang liên hệ 54 Hình 3.5: giao diện hiển thị thông tin điểm bưu điện Hình 3.6: Giao diện hiển thị tin tức 56 Hình 3.7: Giao diện thêm điểm bưu điện 56 Hình 3.8: Giao diện thêm tin tức 57 55 DANH MỤC BẢNG Bảng 2.1: Bảng tblhuyen 48 Bảng 2.2: Bảng tbldiembd 49 Bảng 2.3: Bảng baiviet 49 Bảng 2.4: Bảng loaitin 49 Bảng 2.5: Bảng tbl_taikhoan 50 LỜI NÓI ĐẦU Do nhu cầu tìm kiếm thông tin ngày cao đặc biệt nhu cầu tìm kiếm thông tin theo địa điểm, theo tọa độ không gian, theo khoảng cách chưa đáp ứng nhu cầu người dùng Mà WebGIS xu hướng phổ biến thông tin mạnh mẽ Internet không góc độ thông tin thuộc tính túy mà kết hợp với thông tin không gian hữu ích cho người sử dụng Bằng việc kết hợp GIS Web để tạo thành WebGIS, người dùng dễ truy cập thông tin kết hợp với đồ động để có nhìn trực quan thông qua trình duyệt Vì em chọn đề tài nghiên cứu: “Ứng dụng công nghệ WebGis xây dựng WebSite quản lý thông tin điểm Bưu Điện tỉnh Thái Nguyên”  Nội dung nghiên cứu: Gồm chương: Chương 1: Tổng quan sở lý thuyết Tổng quan HTML - CSS Lý thuyết WebGis Tổng quan UML Hệ quản trị CSDL MySQL Chương 2: Khảo sát phân tích thiết kế hệ thống Khảo sát hệ thống Hiện trạng hệ thống Bài toán đặt yêu cầu hệ thống Phân tích hệ thống Thiết kế hệ thống Chươg 3: Xây dựng chương trình Kết giao diện chương trình Kết luận, ý nghĩa CHƯƠNG TỔNG QUAN VỀ CƠ SỞ LÝ THUYẾT 1.1 Tổng quan HTML-CSS 1.1.1 Giới thiệu HTML HTML (Hyper Text Markup Language, "Ngôn ngữ Đánh dấu Siêu văn bản") ngôn ngữ đánh dấu thiết kế để tạo nên trang web với mẩu thông tin trình bày World Wide Web HTML định nghĩa ứng dụng đơn giản SGML sử dụng tổ chức cần đến yêu cầu xuất phức tạp HTML trở thành chuẩn Internet tổ chức World Wide Web Consortium (W3C) trì HTML phát triển tiếp với phiên HTML5 mang lại diện mạo cho Web Bằng cách dùng HTML động Ajax, lập trình viên tạo xử lý số lượng lớn công cụ, từ chương trình soạn thảo văn đơn giản – gõ vào từ dòng – công cụ xuất WYSIWYG phức tạp 1.1.2 Giới thiệu CSS CSS chữ viết tắt Cascading Style Sheets, đơn dạng file text với phần tên mở rộng css Trong Style Sheet chứa câu lệnh CSS Mỗi lệnh CSS định dạng phần định HTML ví dụ như: font chữ, đường viền, màu nền, chỉnh hình ảnh v.v Trước chưa có CSS, người thiết kế web phải trộn lẫn thành phần trình bày nội dung với Nhưng với xuất CSS, người ta tách rời hoàn toàn phần trình bày nội dung Giúp cho phần code trang web gọn quan trọng dễ chỉnh sửa Trước bắt đầu tìm hiểu thêm CSS muốn bạn biết chút mạnh việc thiết kế web Ví dụ làm việc với HTML bạn muốn font chữ toàn trang web Arial Bạn phải làm làm lại cho tất file html mà bạn có Nhưng bạn sử dụng CSS, bạn cần làm lần tất cà trang khác tự động thay đổi Có ba cách bạn sử dụng để định dạng trang web là: cục bộ, nhúng vào trang liên kết đến file CSS riêng biệt Trong thực tế cách cuối liên kết đến file riêng biệt sử dụng phổ biến Nhưng bạn nên biết hai cách lại bạn phải sử dụng đến không nhiều Cục – code CSS chèn trực tiếp vào thẻ HTML Cách định dạng cục bạn sử dụng code CSS chèn trực tiếp vào thẻ HTML có tác động lên thẻ Ví dụ:

Nếu bạn thêm code CSS vào thẻ thay đổi cách hiển thị trình duyệt

Nhúng vào trang web Cách thứ hai bạn khai báo code CSS nằm cặp thẻ đặt phần tài liệu Về có tác động cục lên file mà bạn chèn đoạn code CSS Nó có phạm vi ảnh hưởng lớn cách chèn cục nói trên, ảnh hưởng đến file khác trang web 10 b Giao diện trang Xem Bản đồ Hình 3.2: Giao diện trang xem đồ 85 c Giao diện trang Cập nhập Hình 3.3: Giao diện trang cập nhật 86 87 d Giao diện trang liên hệ 88 89 Hình 3.4: Giao điện trang liên hệ 90 3.2 Giao diện quản lý a Giao diện trang hiển thị thông tin điểm bưu điện 91 Hình 3.5: giao diện hiển thị thông tin điểm bưu điện 92 b Giao diện trang hiển thị tin tức Hình 3.6: Giao diện hiển thị tin tức c Giao diện thêm điểm bưu điện 93 Hình 3.7: Giao diện thêm điểm bưu điện 94 d Giao diện thêm tin tức Hình 3.8: Giao diện thêm tin tức 95 KẾT LUẬN  Kết đạt Xây dựng WebSite hiểnthị thông tin điểm bưu điện tỉnh Thái Nguyên phục vụ người dùng thuận lợi việc tìm kiếm, truy vấn số thông tin cần thiết tiện lợi Giúp người quản lý dễ dàng lưu trữ, quản lý, cập nhật thông tin nhanh, xác, giảm chi phí, hiệu cao  Hạn chế Chưa xây dựng đầy đủ chức nâng cao cho trang Web Giao diện chưa đẹp, chưa đáp ứng đầy đủ chức  Hướng phát triển Cần nghiên cứu, xây dựng thêm số công cụ chức như: thêm lớp liệu, quản lý thêm nhiều dạng đồ hơn… Sử dụng công nghệ trang web hoạt động nhanh Tích hợp WebGIS với Google Earth Tìm hiểu chếđộ bảo mật thông tin cho trang web trước đưa WebGIS lên mạng Nghiên cứu thêm để xây dựng chức định vị vị trí người dùng đồ 96 TÀI LIỆU THAM KHẢO [1] Đặng Văn Đức, Hệ thống thông tin địa lý, NXB Khoa học kỹ thuật, 2001 [2] Phạm Hữu Khang, Lập trình PHP, NXB Khoa học kỹ thuật, 2001 [3] Đoàn Thị Xuân Hương, Ứng dụng ArcGIS Server xây dựng hệ thống WebGIS để tích hợp, phân phối sở liệu địa lý lên Internet Kỷ yếu hội thảo ứng dụng GIS toàn quốc 2010 – Nhà xuất Nông nghiệp, Thành phố Hồ Chí Minh [4] Nguyễn Kim Lợi,Hệ thống thông tin địa lý - Phần mềm ArcView 3.3, Nhà xuất Nông nghiệp, Thành phồ Hồ Chí Minh, 2009 [5].Antonio Santiago Perez, 2012 OpenLayers Cookbook Packt Publishing Ltd, UK, 2009 [6] Erik Hazzard, “OpenLayers 2.10 – Beginner ‘s Guide”, Packt Publishing Ltd, UK, 2011 [7] Tài liệu số website: http://gisvn.com.vn/forum.php http://www.w3schools.com/ https://developers.google.com/maps/documentation/javascript/tutorial http://www.laptrinhwebphp.com/ http://forum.diachatvietnam.net/ 97 NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… 98 …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… …………………………………………………………………………………… Thái nguyên, ngày tháng năm 2016 Giáo viên hướng dẫn 99 ... ĐOAN Em xin cam đoan: Toàn nội dung đồ án tốt nghiệp Ứng dụng công nghệ WebGis xây dựng WebSite quản lý thông tin điểm bưu điện tỉnh Thái Nguyên Do em tự học tập, tìm hiểu từ trình học tập trường,... thành WebGIS, người dùng dễ truy cập thông tin kết hợp với đồ động để có nhìn trực quan thông qua trình duyệt Vì em chọn đề tài nghiên cứu: Ứng dụng công nghệ WebGis xây dựng WebSite quản lý thông. .. xem thông tin bưu điện 37 2.2.3 Sơ đồ trình tự xem đồ điểm bưu điện 38 2.2.4 Sơ đồ trình tự tìm kiếm điểm bưu điện 39 2.2.5 Sơ đồ trình tự tìm đường đồ 2.2.6 Sơ đồ trình tự thêm điểm bưu điện