Ứng dụng webgis hỗ trợ tra cứu thông tin phân bố các loài động vật hoang dã ở Việt Nam

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƢỜNG ĐẠI HỌC NÔNG LÂM THÀNH PHỐ HỒ CHÍ MINH TIỂU LUẬN TỐT NGHIỆP ỨNG DỤNG WEBGIS HỖ TRỢ TRA CỨU THÔNG TIN PHÂN BỐ CÁC LOÀI ĐỘNG VẬT HOANG DÃ Ở VIỆT NAM Họ tên sinh viên: ĐẶNG THỊ HƢƠNG Ngành: Hệ thống Thơng tin Địa lý Niên khóa: 2012 – 2016 Tháng 6/2016 ỨNG DỤNG WEBGIS HỖ TRỢ TRA CỨU THÔNG TIN PHÂN BỐ CÁC LOÀI ĐỘNG VẬT HOANG DÃ Ở VIỆT NAM Tác giả ĐẶNG THỊ HƢƠNG Giáo viên hƣớng dẫn: ThS Lê Văn Phận Tháng năm 2016 LỜI CẢM ƠN Đầu tiên, xin trân trọng cảm ơn Ban Giám Hiệu trƣờng Đại học Nông Lâm Thành phố Hồ Chí Minh, tồn thể q thầy Trƣờng Đại học Nơng Lâm Thành phố Hồ Chí Minh đặc biệt thầy PGS.TS Nguyễn Kim Lợi tận tình dạy, truyền đạt kiến thức quý báu cho suốt bốn năm học vừa qua Tôi xin chân thành cám ơn sâu sắc đến ThS Lê Văn Phận, giảng viên khoa Công nghệ Thông tin Trƣờng Đại học Nơng Lâm TP.Hồ Chí Minh, ngƣời tận tình hƣớng dẫn, bảo tạo điều kiện tốt cho trình thực luận văn Xin cảm ơn giúp đỡ tập thể lớp DH12GI ngày tháng ngồi dƣới giảng đƣờng đại học Cuối cùng, vô biết ơn ủng hộ, lời động viên tinh thần từ gia đình cho động lực để hoàn thành luận văn Mặc dù cố gắng nỗ lực để thực luận văn này, nhiên khơng tránh khỏi thiếu sót hạn chế Kính mong nhận đƣợc chia sẻ, góp ý từ phía Thầy Cơ để đề tài đƣợc hồn thiện tốt Đặng Thị Hƣơng Khoa Mơi trƣờng Tài nguyên Trƣờng Đại học Nông Lâm TP Hồ Chí Minh Số điện thoại: 01674208741 Email: 12162027@st.hcmuaf.edu.vn i TĨM TẮT Đề tài nghiên cứu “Ứng dụng WebGIS hỗ trợ tra cứu thơng tin phân bố lồi động vật hoang dã Việt Nam” đƣợc thực thời gian từ tháng 3/2016 đến tháng 6/2016 Đề tài thực nghiên cứu WebGIS tích hợp Google maps API làm đồ nền, sử dụng hệ quản trị sở liệu PostgreSQL, ngơn ngữ lập trình HTML,PHP, CSS, JavaScript Đề tài tiến hành phân tích, thiết kế CSDL, thiết kế xây dựng trang WebGIS cung cấp thông tin phân bố loại động vật hoang dã Đề tài đạt đƣợc kết cụ thể sau: - Hoàn thành việc thiết kế xây dựng CSDL địa lý điểm phân bố thơng tin liên quan đến lồi động vật hoang dã Việt Nam - Hoàn thành việc thiết kế chức thiết kế giao diện WebGIS để cung cấp thơng tin phân bố lồi - Xây dựng thành công trang WebGIS tra cứu thông tin phân bố thông tin đặc điểm loài với chức tƣơng tác đồ, hiển thị, tìm kiếm quản lý cập nhật thơng tin phân bố động vật hoang dã Việt Nam ii MỤC LỤC LỜI CẢM ƠN i TÓM TẮT ii MỤC LỤC .iii DANH MỤC VIẾT TẮT v DANH MỤC BẢNG BIỂU vi DANH MỤC HÌNH ẢNH vii CHƢƠNG MỞ ĐẦU 1.1 Tính cấp thiết đề tài 1.2 Mục tiêu nghiên cứu 1.2.1 Mục tiêu chung 1.2.2 Mục tiêu cụ thể 1.3 Đối tƣợng phạm vi nghiên cứu CHƢƠNG TỔNG QUAN TÀI LIỆU 2.1 Khu vực nghiên cứu 2.1.1 Vị trí địa lý 2.1.2 Địa hình 2.1.3 Khí hậu 2.1.4 Kinh tế - Xã hội 2.1.5 Hệ động vật Việt Nam 2.2 Tổng quan hệ thống thông tin địa lý (GIS) 2.2.1 Khái niệm 2.2.2 Các thành phần GIS 2.2.3 Chức 2.2.4 Dữ liệu GIS 2.2.5 Ứng dụng GIS iii 2.3 WebGIS 2.3.1 Khái niệm 2.3.2 Kiến trúc WebGIS 10 2.3.3 Các bƣớc xử lý thông tin WebGIS 10 2.3.4 Ứng dụng WebGIS 12 2.4 Google Maps API 12 2.4.1 Khái niệm 12 2.4.2 Một số ứng dụng Google Maps API 13 2.5 Các nghiên cứu liên quan đến ứng dụng WebGIS 13 2.5.1 Trên giới 13 2.5.2 Một số nghiên cứu nƣớc 14 CHƢƠNG PHƢƠNG PHÁP NGHIÊN CỨU 15 3.1 Phân tích, thiết kế xây dựng CSDL 15 3.2 Thiết kế chức trang Web 18 3.3 Thiết kế giao diện trang Web 21 3.4 Xây dựng trang Web 26 CHƢƠNG KẾT QUẢ 30 4.1 Giao diện trang Web cho ngƣời dùng 30 4.2 Giao diện trang Web cho ngƣời quản trị 33 4.3 Giao diện trang giới thiệu 37 CHƢƠNG KẾT LUẬN, KIẾN NGHỊ 38 5.1 Kết luận 38 5.2 Kiến nghị 38 - TÀI LIỆU THAM KHẢO 39 iv DANH MỤC VIẾT TẮT API Application Programming Interface (Giao diện lập trình ứng dụng) CSDL Cơ sở liệu GIS Geographical Information System (Hệ thống thông tin địa lý) HTML HyperText Markup Language (Ngôn ngữ đánh dấu siêu văn bản) PHP Hypertext Preprocessor (Bộ tiền xử lý siêu văn bản) CSS Cascading Style Sheets (Các tập tin định kiểu theo tầng) SQL Structured Query Language (Ngôn ngữ truy vấn mang tính cấu trúc) v DANH MỤC BẢNG BIỂU Bảng 3.1: Mơ tả thuộc tính LOAI 17 Bảng 3.2: Mơ tả thuộc tính VITRIPHANBO 18 Bảng 3.3: Mơ tả thuộc tính HANHTRINH 18 Bảng 3.4: Mô tả chức cho ngƣời quản trị 19 Bảng 3.5: Mô tả chức cho ngƣời dùng 20 vi DANH MỤC HÌNH ẢNH Hình 2.1 Bản đồ hành Việt Nam Hình 2.2: Các thành phần GIS Hình 2.3: Sơ đồ kiến trúc tầng WebGIS 10 Hình 2.4: Các bƣớc xử lý thơng tin WebGIS 11 Hình 3.1: Sơ đồ phƣơng pháp nghiên cứu 15 Hình 3.2: Mơ hình thực thể kết hợp 16 Hình 3.3: Mơ hình quan hệ sở liệu 17 Hình 3.4: Sơ đồ thiết kế chức trang Web 19 Hình 3.5: Thiết kế giao diện trang chủ 22 Hình 3.6: Thiết kế giao diện trang hành trình 22 Hình 3.7: Thiết kế giao diện trang đăng nhập 23 Hình 3.8: Thiết kế giao diện trang thêm liệu 24 Hình 3.9: Thiết kế giao diện chỉnh sửa liệu 25 Hình 3.10: Thiết kế giao diện xóa liệu 25 Hình 3.11: Sơ đồ tổ chức trang Web 26 Hình 3.12: Sơ đồ giải thuật tốn đăng nhập hệ thống 27 Hình 3.13: Sơ đồ giải thuật tốn quản lý thêm 27 Hình 3.14: Sơ đồ giải thuật tốn chỉnh sửa liệu 28 vii Hình 3.15: Sơ đồ thuật tốn xóa liệu 28 Hình 3.16: Sơ đồ thuật tốn tìm kiếm, hiển thị thơng tin 29 Hình 4.1: Giao diện trang chủ 30 Hình 4.2: Giao diện chức hiển thị thơng tin thuộc tính 31 Hình 4.3: Giao diện chức tìm kiếm theo lồi 31 Hình 4.4: Giao diện trang hành trình 32 Hình 4.5: Giao diện kết trang xem hành trình 33 Hình 4.6: Giao diện trang đăng nhập hệ thống 33 Hình 4.7: Giao diện trang quản lý sở liệu 34 Hình 4.8: Giao diện trang thêm liệu 35 Hình 4.9: Giao diện trang chỉnh sửa liệu 36 Hình 4.10: Giao diện trang xóa liệu 36 Hình 4.11: Giao diện trang giới thiệu 37 viii Hình 3.9: Thiết kế giao diện chỉnh sửa liệu Giao diện trang xóa liệu Hình 3.10: Thiết kế giao diện xóa liệu 25 3.4 Xây dựng trang Web  Sơ đồ tổ chức trang Web Trang Web Trang chủ Giới thiệu Quản lý Hành trình Thêm liệu Chỉnh sửa liệu Đăng nhập Xóa liệu Hình 3.11: Sơ đồ tổ chức trang Web Trang Web bao gồm trang chủ, giới thiệu, hành trình đăng nhập  Trang chủ: Hiển thị đồ với chức tƣơng tác đồ, tìm kiếm theo lồi hiển thị thơng tin thuộc tính  Giới thiệu: Bao gồm phần giới thiệu chung động vật hoang dã, phần hƣớng dẫn sử dụng Web phần đóng góp ý kiến ngƣời dùng  Hành trình: Hiển thị đồ; tìm kiếm hành trình loài theo mã số, thời gian bắt đầu thời gian kết thúc; hiển thị thơng tin thuộc tính  Quản lý: Trang đăng nhập vào hệ thống quản lý CSDL Sau đăng nhập, ngƣời quản trị đƣợc phép vào trang quản lý truy cập vào trang: - Thêm mới: Thêm thông tin đặc điểm phân bố loài - Chỉnh sửa: Sửa thơng tin CSDL 26 - Xóa: Xóa dịng CSDL  Sơ đồ giải thuật toán quản lý liệu Sơ đồ thuật toán đăng nhập vào hệ thống Trang đăng nhập Nhập tên mật Sai Đúng Trang quản lý Hình 3.12: Sơ đồ giải thuật toán đăng nhập hệ thống Sơ đồ giải thuật toán quản lý liệu  Thêm mới: Trang thêm Nhập đầy đủ thơng tin thuộc tính Cơ sở liệu Insert into Đã thêm dịng Hình 3.13: Sơ đồ giải thuật toán quản lý thêm Việc nhập thêm đối tƣợng đƣợc thực có đối tƣợng phát sinh Sau nhập đầy đủ thông tin, hàm insert into thực thêm thông tin vào CSDL 27  Chỉnh sửa: Sai Trang chỉnh sửa Một hàng CSDL tƣơng ứng với ID chọn đƣợc thay đổi Nhập ID Đún Cơ sở liệu Update Hiển thị thông tin tƣơng ứng với ID Nhập thơng tin Hình 3.14: Sơ đồ giải thuật tốn chỉnh sửa liệu Khi ngƣời quản lý muốn thay đổi thơng tin đối tƣợng đó, việc chỉnh sửa liệu đƣợc thực sở số thứ tự không thay đổi Sau nhập ID thơng tin thuộc ID đƣợc chọn hiển thị bảng, nhập thông tin cần thay đổi, hàm update cho phép thay đổi liệu CSDL theo ID tƣơng ứng  Xóa: Sai Trang xóa Nhập ID Đúng Delete Cơ sở liệu Xóa dịng tƣơng ứng với ID CSDL Hình 3.15: Sơ đồ thuật tốn xóa liệu 28 Việc xóa liệu đƣợc thực ngƣời quản lý muốn xóa thơng tin CSDL Sau nhập ID cần xóa, hàm delete cho phép xóa dịng có ID tƣơng ứng CSDL  Sơ đồ giải thuật tốn tìm kiếm, hiển thị thơng tin Cơ sở liệu Hiển thị thông tin lên đồ Tải liệu theo yêu Hình 3.16: Sơ đồ thuật tốn tìm kiếm, hiển thị thơng tin Thơng tin đƣợc lƣu trữ CSDL Sử dụng hàm Select để tìm kiếm thông tin theo điều kiện, thông tin đƣợc tải lên hiển thị đồ tƣơng ứng với điểm Ngƣời sử dụng xem thơng tin thuộc tính điểm cách click vào điểm Tóm lại, trang Web sử dụng Google Maps API làm lớp đồ nền, sử dụng liệu từ hện quản trị CSDL PostgreSQL/PostGIS ngôn ngữ lập trình PHP, HTML, CSS, Javascript 29 CHƢƠNG KẾT QUẢ 4.1 Giao diện trang Web cho ngƣời dùng  Giao diện trang chủ Hình 4.1: Giao diện trang chủ Trang chủ bao gồm đồ phân bố thẻ tìm kiếm, với chức tƣơng tác đồ, hiển thị thơng tin thuộc tính tìm kiếm theo lồi  Click vào điểm đồ để xem thơng tin thuộc tính đối tƣợng Giao diện chức hiển thị thơng tin thuộc tính đƣợc thể hình 4.2 30 Hình 4.2: Giao diện chức hiển thị thơng tin thuộc tính  Chọn tên lồi tìm kiếm bấm chọn “Seach” Kết tìm kiếm đƣợc thể hình 4.3 Hình 4.3: Giao diện chức tìm kiếm theo lồi 31  Giao diện trang hành trình Hình 4.4: Giao diện trang hành trình Chọn “Mã” lồi, thẻ chọn Mã hiển thị tên hình ảnh tƣơng ứng với Mã chọn, tiến hành chọn thời gian bắt đầu thời gian kết thúc, kết đƣợc hiển thị nhƣ hình 4.5 Kết đƣợc xác định khoảng thời gian định, ứng với mốc thời gian khác vị trí khác lồi đƣợc chọn Các điểm đƣợc nối với đoạn thẳng hƣớng di chuyển loài khoảng thời gian nghiên cứu 32 Hình 4.5: Giao diện kết trang xem hành trình 4.2 Giao diện trang Web cho ngƣời quản trị  Giao diện trang đăng nhập Hình 4.6: Giao diện trang đăng nhập hệ thống 33  Giao diện trang quản lý sở liệu (danh sách liệu) Ngƣời quản trị nhập tên mật để đăng nhập, đăng nhập thành công hệ thống chuyển đến trang quản lý sở liệu Giao diện trang quản lý sở liệu đƣợc thể nhƣ hình 4.7 Hình 4.7: Giao diện trang quản lý sở liệu  Giao diện trang thêm liệu Để thêm thông tin vào CSDL, ngƣời quản lý phải điền đầy đủ thông tin vào form thêm liệu Sau bấm chọn thêm liệu, dòng đƣợc lƣu vào CSDL đƣợc cập nhật danh sách liệu 34 Hình 4.8: Giao diện trang thêm liệu  Giao diện trang chỉnh sửa liệu Nhập số thứ tự vào ô form chỉnh sửa liệu, liệu đƣợc cập nhật vào form tƣơng tự với số thứ tự đƣợc chọn, tiến hành sửa thông tin liệu (giữ nguyên số thứ tự), sau bấm chọn Update để cập nhật liệu 35 Hình 4.9: Giao diện trang chỉnh sửa liệu  Giao diện trang xóa liệu Nhập số thứ tự cần xóa, bấm chọn Xóa, dịng tƣơng ứng với số thứ tự chọn đƣợc xóa danh sách CSDL Hình 4.10: Giao diện trang xóa liệu 36 4.3 Giao diện trang giới thiệu Trang “Giới thiệu” hƣớng dẫn cách sử dụng Web, giới thiệu chung động vật hoang dã Việt Nam tiếp nhận ý kiến đóng góp ngƣời dùng Hình 4.11: Giao diện trang giới thiệu 37 CHƢƠNG KẾT LUẬN, KIẾN NGHỊ 5.1 Kết luận Với mục tiêu ứng dụng WebGIS hỗ trợ tra cứu thơng tin phân bố lồi động vật hoang dã Việt Nam, đề tài đạt đƣợc kết cụ thể sau:  Hoàn thành việc thiết kế xây dựng CSDL cung cấp thông tin phân bố loài động vật hoang dã Việt Nam  Hoàn thành việc thiết kế xây dựng chức giao diện trang WebGIS  Xây dựng thành công trang WebGIS tra cứu thông tin với chức tƣơng tác đồ, hiển thị thơng tin thuộc tính, tìm kiếm quản lý cập nhật thơng tin phân bố lồi động vật hoang dã Việt Nam Tuy nhiên, mục tiêu đạt đƣợc đề tài tồn số hạn chế:  Dữ liệu chƣa đầy đủ chi tiết  Trang Web cịn chức  Giao diện trang Web đơn giản, thiếu chuyên nghiệp 5.2 Kiến nghị Để đề tài hoàn thiện đƣợc ứng dụng hiệu vào thực tế, cần nghiên cứu phát triển thêm nội dung sau: - Xây dựng nguồn liệu đầu vào phong phú chi tiết - Thiết kế giao diện Web chuyên nghiệp - Nghiên cứu thêm nhiều chức cho trang Web để ứng dụng hiệu vào thực tế - Nghiên cứu chế độ bảo mật đƣa trang WebGIS lên mạng Internet 38 - TÀI LIỆU THAM KHẢO Tiếng Việt Nguyễn Kim Lợi cộng tác viên, 2009 Hệ thống thông tin địa lý nâng cao Nhà xuất Nơng Nghiệp, Tp Hồ Chí Minh, trang Nguyễn Quang Tuấn, Hà Văn Thành, Trƣơng Đình Trọng, Lê Thái Sơn, 2010 “Ứng dụng cơng nghệ WebGIS để xây dựng sở liệu phục vụ khai thác tiềm di lịch bền vững tỉnh Quảng Trị” Trong kỷ yếu hội thảo ứng dụng GIS tồn quốc 2010 NXB Nơng Nghiệp Phạm Thị Phép, 2013 Ứng dụng Công nghệ WebGIS mã nguồn mở phục vụ cơng tác quảng bá du lịch Khóa luận tốt nghiệp, Đại học Nơng Lâm TP.Hồ Chí Minh, Việt Nam Trần Thị Thúy An, 2014 Ứng dụng WebGIS hỗ trợ tra cứu thông tin cấp giấy chứng nhận quyền sử dụng đất tỉnh Bình Dương Khóa luận tốt nghiệp, Đại học Nơng Lâm Tp.Hồ Chí Minh, Việt Nam Climate GIS: [Truy cập ngày 20-4-2016] Tiếng Anh Google Developers,2013 Google Maps JavaScript API v3 Available at: [Accessed 25 April 2016] Google Maps API Tutorial: .[Accessed 26 April 2016] 39