Tải bản đầy đủ (.doc) (75 trang)

Lập trình webgis với ngôn ngữ PHP( Mapserver + postgresql)

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (3.65 MB, 75 trang )

LẬP TRÌNH WEBGIS TRÊN
MAPSERVER SỬ DỤNG
PHP/POSTGRESQL

NGUYỄN TÁ NAM –


Mục Lục

Mục Lục.............................................................................................................................. 1
Phần 1:

Lập trình WebGIS trên MapServer với PHP/PostgreSQL..................................3

Chương 1:

Giới thiệu chung về GIS và WebGIS........................................................3

Chương 2:

Giới thiệu chung về các ngôn ngữ lập trình được sử dụng và CSDL

PostgreSQL 5
2.1 Các ngôn ngữ lập trình được sử dụng.................................................................5
2.2 Hệ quản trị cơ sở dữ liệu PostgreSQL................................................................6
Chương 3:

Tổng quan về MS4W và thư viện OpenLayer........................................11

3.1 MS4W..............................................................................................................11
3.2 Thư viện OpenLayer........................................................................................13


Chương 4:

Xây dựng hệ thống người dùng, quản lý người dùng.............................14

Mục tiêu....................................................................................................................14
4.1 Xây dựng database chứa thông tin người dùng................................................14
4.2 Xây dựng phân quyền người dùng và các file chức năng.................................15
Chương 5:

Xây dựng và làm việc với bản đồ...........................................................22

Mục tiêu....................................................................................................................22
5.1 Tạo mapfile......................................................................................................22
5.2 Thiết kế giao diện cho Webgis (xây dựng file mapview.php)...........................24
5.3 Xây dựng chức năng tìm kiếm cho bản đồ.......................................................31
Chương 6:

Xây dựng, tương tác và xử lý dữ liệu.....................................................35

Mục tiêu....................................................................................................................35


6.1 Nhập dữ liệu dạng shapefile vào Postgres........................................................35
6.2 Nhập dữ liệu dạng .csv vào Postgres................................................................38
6.3 Nhập dữ liệu trực tiếp qua giao diện web.........................................................42
6.4 Xuất dữ liệu trong csdl ra file .csv và lưu trữ trên máy tính.............................45
6.5 Import shapefile vào postgres qua giao diện web.............................................47
6.6 Export shapefile từ postgres và cho download về máy tính..............................51
6.7 Sử dụng dữ liệu trong csdl để vẽ biểu đồ.........................................................56
6.8 Nội suy dữ liệu.................................................................................................68



Phần 1: Lập

trình

WebGIS

trên

MapServer

với

PHP/PostgreSQL
Chương 1:

Giới thiệu chung về GIS và WebGIS

Kiến trúc web của hệ thống thông tin dữ liệu không gian cũng gần giống như kiến
trúc dành cho một hệ thống thông tin web cơ bản khác, ngoại trừ có sử dụng kỹ thuật
GIS. Có nhiều dạng công nghệ cho việc thành lập web cho thông tin không gian như:
MapServer, GeoServer, ArcGIS Server,…
Cơ sở dữ liệu không gian sẽ được dùng để quản lý và truy xuất dữ liệu không gian,
được đặt trên Data Server. Nhà kho hay nơi lưu trữ (Clearing House) được dùng để
lưu trữ và duy trì siêu dữ liệu Metadata về những dữ liệu không gian tại những Data
Server khác nhau. Dựa trên những thành phần quản lý dữ liệu, ứng dụng Server và
mô hình Server được dùng cho ứng dụng hệ thống để tính toán thông tin không gian
qua các hàm cụ thể. Tất cả kết quả tính toán của ứng dụng Server sẽ được gởi đến
Web Server để thêm vào các gói HTML, gởi cho phía client và hiển thị nơi trình duyệt

web.
a) Cilent gửi yêu cầu của người sử dụng thông qua giao thức HTTP đến Web Server.
b) Web Server nhận yêu cầu của người dùng từ cilent, xử lý và chuyển tiếp yêu cầu
đến ứng dụng trên Server có liên quan.
c) Application Server (chính là các ứng dụng GIS) nhận các yêu cầu cụ thể đối với
các ứng dụng và gọi các hàm có liên quan để tính toán xử lý. Nếu có yêu cầu dữ liệu
nó sẽ gửi yêu cầu dữ liệu đến Data Exchange Center (trung tâm trao đổi dữ liệu).
d) Data Exchange Center nhận yêu cầu dữ liệu, tìm kiếm vị trí dữ liệu, sau đó gửi
yêu cầu dữ liệu đến Data Server chứa dữ liệu cần tìm.
e) Data Server tiến hành truy vấn dữ liệu cần thiết và trả dữ liệu này về cho
Data Exchange Center.


f) Data Exchange Center nhận nhiều nguồn dữ liệu từ Data Server, sắp xếp logic dữ
liệu theo yêu cầu và trả dữ liệu về cho Application Server.
g) Application Server nhận dữ liệu trả về từ các Data Exchange Center và đưa
chúng đến các hàm cần sử dụng, xử lý, trả kết quả về Web Server.
h) Web Server nhận kết quả xử lý, thêm vào các code HTML, PHP,… để có thể
hiển thị lên trình duyệt, gửi trả kết quả về cho trình duyệt dưới dạng các trang web.
Kiến trúc 3-tier gồm 3 thành phần cơ bản, đại diện cho 3 tầng:
1) Database (Data tier): là nơi lưu trữ các dữ liệu địa lý bao gồm các dữ liệu không
gian và phi không gian. Các dữ liệu này được quản trị bởi các hệ quản trị cơ sở dữ liệu
như: Oracle, MS SQL Server, Esri SDE, PostgreSQL,… hoặc là các dạng file dữ liệu
như: Shapefile, Tab, XML,… Các dữ liệu này được thiết kế cài đặt và xây dựng theo
từng quy trình cụ thể. Tùy theo quy mô và yêu cầu của hệ thống mà tổ chức lựa chọn
công nghệ quản trị cơ sở dữ liệu cho phù hợp.
2) Application Server (Bussiness tier): thường được tích hợp trong một Webserver
nào đó, ví dụ như các Web Server nổi tiếng Apache Tomcat, Internet
Information Server. Đó là một ứng dụng phía Server nhiệm vụ chính của nó là tiếp
nhận các yêu cầu từ client, lấy dữ liệu từ phía cơ sở dữ liệu theo yêu cầu client,

trình bày dữ liệu theo cấu hình định sẵn hoặc theo yêu cầu của client và trả kết quả về
theo yêu cầu.
3) Client (Presentation tier): thông thường đơn thuần là một Browser như Internet
Explorer, FireFox, Google Chome,… để mở các trang web theo URL định sẵn. Các
ứng dụng client có thể là 1 Website, Applet, Flash,… được viết bằng các công nghệ
chuẩn mà W3C đã chứng thực. Các client đôi khi cũng là một ứng dụng
Desktop tương tự như phần mềm MapInfo, ArcMap,…


Chương 2:

Giới thiệu chung về các ngôn ngữ lập trình được sử

dụng và CSDL PostgreSQL
2.1
2.1.1

Các ngôn ngữ lập trình được sử dụng
Ngôn ngữ HTML

- HTML (Hyper Text Markup Language, hay là "Ngôn ngữ Đánh dấu Siêu văn
bản") là một ngôn ngữ đánh dấu được thiết kế ra để tạo nên các trang web với các
mẩu thông tin được trình bày trên World Wide Web. HTML được định nghĩa như là
một ứng dụng đơn giản của SGML và được sử dụng trong các tổ chức cần đến các
yêu cầu xuất bản phức tạp. HTML đã trở thành một chuẩn Internet do tổ
chức World Wide Web Consortium (W3C) duy trì. HTML đang được phát triển
tiếp với phiên bản hiện tại HTML5 đã mang lại diện mạo mới cho Web.

- Bằng cách dùng HTML động hoặc Ajax, lập trình viên có thể được tạo ra và xử lý
bởi số lượng lớn các công cụ, từ một chương trình soạn thảo văn bản đơn giản –

có thể gõ vào ngay từ những dòng đầu tiên – cho đến những công cụ xuất
bản WYSIWYG phức tạp.
2.1.2

Ngôn ngữ Java

- Java là một ngôn ngữ lập trình dạng lập trình hướng đối tượng (OOP). Khác với
phần lớn ngôn ngữ lập trình thông thường, thay vì biên dịch mã nguồn
thành mã máy hoặc thông dịch mã nguồn khi chạy, java được thiết kế để biên
dịch mã nguồn thành bytecode, bytecode sau đó sẽ được môi trường thực thi
(runtime environment) chạy. Bằng cách này, Java thường chạy chậm hơn
những ngôn ngữ lập trình thông dịch khác như C++, Python, Perl, PHP, C#...

- Cú pháp java được vay mượn nhiều từ C & C++ nhưng có cú pháp hướng đối
tượng đơn giản hơn và ít tính năng xử l ý cấp thấp hơn. Do đó việc viết một
chương trình bằng java dễ hơn, đơn giản hơn, đỡ tốn công sửa lỗi hơn.


2.1.3

Ngôn ngữ JavaScript

- JavaScript theo phiên bản hiện hành, là một ngôn ngữ lập trình kịch bản
dựa trên đối tượng được phát triển từ các ý niệm nguyên mẫu. Ngôn ngữ này được
dùng rộng rãi cho các trang web, nhưng cũng được dùng để tạo khả năng viết
script sử dụng các đối tượng nằm sẵn trong các ứng dụng. Nó vốn được
phát triển bởi Brendan Eich tại Hãng truyền thông Netscape với cái tên đầu
tiên Mocha, rồi sau đó đổi tên thành LiveScript, và cuối cùng thành
JavaScript.


- Giống Java, JavaScript có cú pháp tương tự C, nhưng nó gần với Self hơn
Java. .js là phần mở rộng thường được dùng cho tập tin mã nguồn JavaScript.
JavaScript có một số đối tượng định nghĩa sẵn, bao gồm mảng ( Array),
đối tượng đại số Bool (Boolean), đối tượng ngày tháng (Date), đối tượng hàm
(Function), đối tượng toán học(Math), đối tượng số (Number), đối tượng đối tượng
(Object), đối tượng biểu thức tìm kiếm (RegExp) và đối tượng chuỗi ký tự
( String). Các đối tượng khác là đối tượng thuộc phần mềm chủ (phần mềm
áp dụng JavaScript - thường là trình duyệt).
2.1.4

Ngôn ngữ PHP

- PHP (viết tắt hồi quy "PHP: Hypertext Preprocessor") là một ngôn ngữ lập trình
kịch bản hay một loại mã lệnh chủ yếu được dùng để phát triển các ứng dụng viết
cho máy chủ, mã nguồn mở, dùng cho mục đích tổng quát. Nó rất thích hợp với
web và có thể dễ dàng nhúng vào trang HTML. Do được tối ưu hóa cho các ứng
dụng web, tốc độ nhanh, nhỏ gọn, cú pháp giống C và Java, dễ học và thời gian
xây dựng sản phẩm tương đối ngắn hơn so với các ngôn ngữ khác nên PHP đã
nhanh chóng trở thành một ngôn ngữ lập trình web phổ biến nhất thế giới.

2.2
2.2.1

Hệ quản trị cơ sở dữ liệu PostgreSQL
Tổng quan

- PostgreSQL là hệ quản trị cơ sở dữ liệu được viết theo hướng mã nguồn mở và rất
mạnh mẽ. Hệ quản trị cơ sở dữ liệu này đã có hơn 15 năm phát triển, đồng thời



kiến trúc đã được kiểm chứng và tạo được lòng tin với người sử dụng về độ tin cậy,
tính toàn vẹn dữ liệu, và tính đúng đắn. PostgreSQL có thể chạy trên tất cả các hệ
điều hành, bao gồm cả Linux, UNIX (AIX, BSD, HP-UX, SGI IRIX, Mac OS X,
Solaris, Tru64), và Windows. Do nó hoàn toàn tuân thủ ACID, có hỗ trợ đầy đủ các
foreign keys, joins, views, triggers, và stored procedures (trên nhiều ngôn ngữ). Hệ
quản trị này còn bao gồm các kiểu dữ liệu SQL: 2008 như INTEGER, NUMBER,
BOOLEAN, CHAR, VARCHAR, DATE INTERVAL, và TIMESTAMPs.
PostgreSQL cũng hỗ trợ lưu trữ các đối tượng có kiểu dữ liệu nhị phân lớn, bao
gồm cả hình ảnh, âm thanh, hoặc video. Hệ quản trị cơ sở dữ liệu này được sử
dụng thông qua giao diện của các ngôn ngữ C / C + +, Java,. Net, Perl, Python,
Ruby, Tcl, ODBC…

- Là một hệ quản trị cơ sở dữ liệu mạnh, PostgreSQL tự hào có các tính năng phức
tạp như kiểm soát truy cập đồng thời nhiều phiên bản (MVCC), khôi phục dữ liệu
tại từng thời điểm (Recovery), quản lý dung lượng bảng (tablespaces), sao chép
không đồng bộ, giao dịch lồng nhau (savepoints), sao lưu trực tuyến hoặc nội bộ,
truy vấn phức tạp và tối ưu hóa, và viết trước các khai báo để quản lý và gỡ lỗi.
PostgreSQL hỗ trợ bộ ký tự quốc tế, hỗ trợ bảng mã nhiều byte, Unicode, và cho
phép định dạng, sắp xếp và phân loại ký tự văn bản (chữ hoa, thường). PostgreSQL
còn được biết đến với khả năng mở rộng để nâng cao cả về số lượng dữ liệu quản
lý và số lượng người dùng truy cập đồng thời. Đã từng có những hệ thống
PostgreSQL hoạt động trong môi trường thực tế thực hiện quản lý vượt quá 4
terabyte dữ liệu.
2.2.2
-

Cài đặt
Truy cập vào trang và lựa chọn để download các phiên
bản khác nhau, khuyến nghị nên chọn bản 9.0 hoặc 9.1


-

Tiến hành cài đặt như các chương trình bình thường khác


Hình 2.2.1. Màn hình cài đặt ban đầu

Hình 2.2.2. Nhập password cài đặt
// Nên để password là admin


Hình 2.2.3. Kết thúc cài đặt chuyển sang cái plugin postgis
-

Tích chọn hộp thoại trên để tiếp tục tải về và cài đặt Postgis extention:

Hình 2.2.4. Màn hình cài đặt postgis


Hình 2.2.5. Chọn extention trong list
-

Ấn next và chờ bộ cài đặt download và cài postgis extention.

-

Chúng ta sẽ tương tác với postgres qua pgAdmin III.


Chương 3:

3.1
3.1.1
-

Tổng quan về MS4W và thư viện OpenLayer

MS4W
Tổng quan
WebGIS là xu hướng phổ biến thông tin mạnh mẽ trên Internet không chỉ dưới
góc độ thông tin thuộc tính thuần túy mà nó kết hợp được với thông tin không gian
hữu ích cho người sử dụng. Tiếp cận công nghệ WebGIS phù hợp là yếu tố quan
trọng để xây dựng một WebGIS hoàn chỉnh và có khả năng đáp ứng phát triển
trong tương lai. Đề tài này ứng dụng công nghệ mã nguồn mở GeoServer để xây
dựng WebGIS.

-

Mã nguồn mở MapServer được phát triển bởi UMN (University of Minnesota ).
Hỗ trợ nhiều môi trường phát triển khác nhau như: PHP, Python, Perl, Java, C#. Hỗ
trợ nhiều hệ điều hành: Linux, Windows, Mac OS X, Solaris. Hỗ trợ nhiều định
dạng dữ liệu ESRI shapfiles, PostGIS, ESRI ArcSDE, OracleSpatial, MySQL.
Tương thích với OGC.

-

Là gói ứng dụng được cung cấp để cài đặt và sử dụng Mapserver trên nền tảng
window. Trong gói ms4w tiêu chuẩn thường bao gồm các thành phần sau:
 Apache HTTP Server version 2.2.22
 PHP version 5.4.3
 MapServer CGI 6.0.3

 MapScript 6.0.3 (CSharp, Java, PHP, Python)
 Includes support for Oracle 11g, and SDE data (if you have
associated client/dlls)









MrSID support built-in
GDAL/OGR 1.9.1 and Utilities
MapServer Utilities
PROJ Utilities
Shapelib Utilities
Shp2tile Utility
Shpdiff Utility
AVCE00 Utilities


 OGR/PHP Extension 1.0.0
 OWTChart 1.2.0
3.1.2
-

Cài đặt
Vào địa chỉ tải bộ cài ms4w dưới dạng .zip hoặc
.exe. Dưới đây là cách cái đặt ms4w dạng .zip


-

Extract thư mục ms4w ra ổ C:\

Hình 3.1.1. Đặt ms4w trong ổ C:\
Trong thư mục ms4w ta sẽ thấy được 1 file ‘apache-install.bat’.
-

Vào start tìm kiếm cmd (command prompt) và chạy dưới quyền admin (Run as
administrator). Đưa con trỏ tới thư mục ms4w vừa extract và chạy file apacheinstall.bat:

Hình 3.1.2. Chạy apache-install.bat bằng cmd


-

Sau khi chạy xong ta vào kiểm tra xem ms4w đã được cài hay chưa bằng cách: vào
Run gõ services.msc

Hình 3.1.3. Kiểm tra apache ms4w đã hoạt động
-

Nếu ta thấy như trên là ms4w đã được cài đặt. Nếu k ta cần restart máy để apache
hoạt động (Automatic startup).

3.2
-

Thư viện OpenLayer

OpenLayers là bộ thư viện JavaScript hỗ trợ hiển thị bản đồ trên các ứng
dụng web, được viết bằng ngôn ngữ JavaScript. OpenLayers không chỉ là thư
viện cung cấp một API JavaScript mà nó có thể kết hợp các bản đồ từ nhiều
nguồn khác nhau vào trang web hoặc ứng dụng.

-

Đặc điểm nổi bật của thư viện OpenLayers:
o Bộ thư viện mã nguồn mở.
o

Tuân theo chuẩn quốc tế.

o Hỗ trợ nhiều loại dịch vụ (WMS, WFS, WCS,…) và Map Server
như ArcGIS, GeoServer, MapServer.
o Đọc được các định dạng trên Google Map, OpenStreetMap,…
o Hỗ trợ xây dựng các thao tác trên bản đồ.


Chương 4:

Xây dựng hệ thống người dùng, quản lý người dùng

Mục tiêu
-

Xây dựng trang giao diện thân thiện và dễ dàng sử dụng đối với người dùng

-


Phân quyền đăng nhập đối với người dùng.

-

Xây dựng trang đăng ký người dùng mới

-

Xây dựng trang chức năng chỉnh sửa đối với quyền admin

-

Xây dựng trang hiển thị bản đồ đối với người dùng.

4.1
-

Xây dựng database chứa thông tin người dùng
Trong Database webgis, ta tạo bảng với tên là account để chứa các thông tin người
dùng như sau.

CREATE TABLE account
(
id integer NOT NULL DEFAULT nextval('registration_id_seq'::regclass),
fullname character(100) NOT NULL,
email character(100) NOT NULL,
username character(100) NOT NULL,
password character(100) NOT NULL,
role character(1),
CONSTRAINT registration_pkey PRIMARY KEY (id )

)

-

Tạo 2 tài khoản với 2 quyền 1 và quyền 2

Hình 4.1.1. Dữ liệu người dùng trong postgres


4.2

Xây dựng phân quyền người dùng và các file chức năng

-

File connection.php: kết nối với csdl PostgreSQL

-

File function.php: chứa lệnh chức năng

-

File login.php: giao diên đăng nhập

-

File logout.php: chức năng thoát khỏi đăng nhập

-


File admin.php: giao diện cho phân quyền admin

-

File tamdao.php: giao diện cho phân quyền người dùng.

Kết nối với CSDL PostgreSQL
-

Dùng câu lệnh sau để kết nối với CSDL PostgreSQL

$host
= "host=localhost";
$port
= "port=5432";
$dbname
= "dbname=webgis";
$login = "user=postgres password=postgres";
$db = pg_connect( "$host $port $dbname $login" );
?>

4.2.1

Xây dựng file function.php

if(isset($_POST['ok'])){
session_start();
$user=$pass="";

if($_POST['username'] == NULL) {
echo "Please enter your username
";
} else {
$user=$_POST['username'];
}
if($_POST['password'] == NULL) {
echo "Please enter your password
";
} else {
$pass=$_POST['password'];
}
if($user && $pass)


-

Để kiểm tra chắn là bạn đã điền thông tin đăng nhập hay chưa, nếu chưa sẽ đưa ra
thông báo

require ("connection.php");
if(!$db){
echo "Error
";
} else {
echo " Success connect to database
";
}
$sql="SELECT * FROM account where username='".$user."' AND password='".
$pass."'";
$do= pg_query($db, $sql);
if(pg_num_rows($do) ==0)

{
echo "Username or password is not correct, please try again";
} else{
$row=pg_fetch_array($do);
$_SESSION['currUser'] = $row['username'];
if($row['role']==1){
$_SESSION['currAdmin'] = $row['role'];
header("location:admin.php");
} else {
header("location:mapview.php");
}
}
}

-

Code phân quyền đăng nhập cho người dùng. Nếu bạn là admin đăng nhập là
quyền 1 thì được đẩy vào trang admin.php với một số quyền đặc biệt. Còn với
phân quyền người dùng thì sẽ được đẩy vào trang mapview.php với các chức năng
chỉ cho người dùng.

4.2.2
-

Xây dựng trang login.php
Tạo style hiển thị

<style>
body{
background-image: url( />background-repeat: no-repeat;

background-size: cover;


background-position: center;
}

-

Liên kết với trang chức năng function.php và tạo form đăng nhập trang login

require ("function.php");
if($SERVER['REQUEST_METHOD']=='POST'){
$user = $_POST['username'];
$pass = $_POST['password'];
get_user($user, $pass); }
?>

Hình 4.2.1. Giao diện đăng nhập
-

Giao diện trang đăng nhập. Ở trên có nút “Click On Register”, nếu bạn chưa có tài
khoản thì các bạn click vào đây và sẽ được chuyển đến trang đăng ký tài khoản
mới register.php

4.2.3

Xây dựng trang logout.php
-


Code trang logout

session_start();
session_destroy();
header("location:login.php");
?>


4.2.4
-

Xây dựng trang admin.php
Với trang admin.php, ta sẽ xây dựng để cho admin có 1 số quyền thao tác với trang
web mà người dùng không được phép như quyền cập nhật đưa dữ liểu khảo sát vào
CSDL.

4.2.5
-

Xây dựng trang đăng ký người dùng mới
Tạo trang đăng ký người dùng register.php với nội dung.

<script type="text/javascript">
var reg_fullname = /^[a-zA-Z ]+$/;
var reg_email = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
var reg_username = /^[a-zA-Z0-9_\.\-]+$/;
var reg_password = /^[a-zA-Z0-9~!@#$%^&*()_+|]+$/;
function regexFullName() {
var tmp = document.getElementById("tb_fullname").value;

var isvalid = reg_fullname.test(tmp);
if (!isvalid || tmp == "") {
document.getElementById("lb_fullname").className = "format_msg";
} else {
document.getElementById("lb_fullname").className = "";
}
}
function regexEmail() {
var tmp = document.getElementById("tb_email").value;
var isvalid = reg_email.test(tmp);
if (!isvalid || tmp == "") {
//alert('Invalid email address!');
document.getElementById("lb_email").className = "format_msg";
} else {
document.getElementById("lb_email").className = "";
}
}
function regexUser() {
var tmp = document.getElementById("tb_username").value;
var isvalid = reg_username.test(tmp);
if (!isvalid || tmp == "") { document.getElementById("lb_username").className =
"format_msg";
} else {
document.getElementById("lb_username").className = "";
}
}
function regexPass() {
var tmp = document.getElementById("tb_password").value;
var isvalid = reg_password.test(tmp);



if (!isvalid || tmp == "") { document.getElementById("lb_password").className =
"format_msg";
} else {
document.getElementById("lb_password").className = "";
}
}
</script>

-

Code kiểm tra và khai báo cho các trường được đăng ký.

include('connection.php');
if($_SERVER['REQUEST_METHOD'] == 'POST') {
$fullname = addslashes($_POST['tb_fullname']);
$email = addslashes($_POST['tb_email']);
$username = addslashes($_POST['tb_username']);
$password = addslashes($_POST['tb_password']);
$sql = "INSERT INTO account (fullname, email, username, password) VALUES
('$fullname', '$email', '$username', '$password')";
$res =pg_query($db, $sql);
if(!$res) {
echo pg_last_error($db);
} else {
print "Account {$username} has already created. <a href='login.php'>Click on to
login</a>";
//
header("location: login.php");

}
}
?>

-

Code ghi nhận thông tin đăng ký người dùng. Thông tin người dùng đăng ký sẽ tự
động lưu vào bảng account trong CSDL

" /><html xmlns=" /><head>
<meta charset="UTF-8"/>
<title>Untitled Document</title>
<link href="./register.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="div_main_register">


name="register" id="register">

<div id="div_register_header"><label>Register</label>
</div>
<hr />
<div id="div_register_field">
<label id="lb_fullname" >Full Name:</label>

onchange="regexFullName()" onkeydown="regexFullName()" />


<label id="lb_email" >Email:</label>

onchange="regexEmail()" onkeypress="regexEmail()" />

<label id="lb_username" >Username:</label>

onchange="regexUser()" onkeydown="regexUser()" />

<label id="lb_password">Password:</label>

onchange="regexPass()" onkeydown="regexPass()" />

</div>
<div id="div_register_control">
<input name="bt_clear" id="bt_reset" type="submit" value="Reset" />name="bt_register" type="submit" value="Register" />
</div>
</form>
</div>
</body>
</html>
-

Code thiết kế form đăng ký người dùng mới.

#div_main_register {

float: left;
padding: 10px;
margin: 5px;
border: 1px solid #666;
-moz-border-radius: 5px; /* for Mozilla browsers */
-webkit-border-radius: 5px; /* for webkit browsers (Chrome, Safari) */
border-radius: 5px; /* for Opera and others */
border: 1px solid gray;
background: #EAEAEA;
padding: 5px 10px;


}
#div_register_header {
margin-top: 5px;
margin-right: 0px;
margin-bottom: 5px;
margin-left: 0px;
font-weight: bold;
}
#div_register_field {
margin: 10px;
font-weight: bold;
font-family: "Courier New", Courier, monospace;
}
#div_register_control {
text-align: right;
margin-top: 5px;
margin-right: 10px;
margin-bottom: 5px;

margin-left: 10px;
}
.format_msg {
font-style: italic;
font-weight: bold;
color: #F00;
}

-

Style cho trang đăng ký, liên kêt trong file register.css

-

Giao diện trang đăng ký người dùng mới, sau khi đăng ký, hệ thông sẽ báo thành
công và đưa bạn quay lại trang login để đăng nhập vào.


Chương 5:

Xây dựng và làm việc với bản đồ

Mục tiêu
-

Sử dụng shapefile đã được import trong csdl, ngôn ngữ PHP kết hợp
Mapserver/postgres để xây dựng trang web hiển thị bản đồ.

-


Thực hiện các chức năng với bản đồ như truy vẫn thông tin, hiển thị, ẩn các layers

-

Truy vấn tìm kiếm bản đồ

-

Để làm việc được với Mapserver chúng ta cần có dữ liệu ban đầu. Chúng ta sẽ làm
việc với các shapefile trong bộ dữ liệu tam đảo đã được import vào csdl (6.1)

5.1
-

Tạo mapfile
Để tạo mapfile mà chứa tất cả dữ liệu, thuộc tính có trong shapefile mà chúng ta đã
import vào CSDL nhanh chóng ta dùng phần mềm QGIS (lưu ý là dùng version <
1.7, các version mới hơn không có Plugin hỗ trợ) với Plugin hỗ trợ là Plugin
Mapserver Export.

-

Sau khi đã có phần mềm QGIS. Chúng ta tạo 1 QGIS project, chọn tất cả shapefile
và lưu mới project

-

Sau khi đã lưu project, các bạn mở project lên. Vào Web  Mapserver Export 
đặt tên mapfile và thiết lập size, url cấu hình cho mapfile



Hình 5.1.1. Tạo mapfile bằng plugin Qgis
-

-

Tiến hành chỉnh sửa mapfile
Sửa trong tab WEB
IMAGEPATH ‘/tmp/’ thành IMAGEPATH ‘c:/ms4w/tmp/’
IMAGEURL ‘/tmp/’ thành IMAGEURL ‘c:/ms4w/tmp’
Như vậy ta đã tạo được 1 mapfile sử dụng shapefile trực tiếp. Để mapfile được
tạo sư dụng shapefile được lưu trữ trên PostgreSQL ta phải sửa liên kết trong thẻ
LAYER của mapfile đến csdl PostgreSQL

Trong thẻ Layer ta sửa thành
LAYER
NAME 'commune'
TYPE POLYGON
CONNECTIONTYPE POSTGIS
CONNECTION "user=postgres password=admin dbname=webgis host=localhost
port=5432"
DATA "geom from commune using unique gid using srid 32648"
METADATA
'ows_title' 'commune'
'wms_src' 'EPSG:32648'
END
STATUS DEFAULT
TRANSPARENCY 100
PROJECTION
'proj=utm'



'zone=48'
'datum=WGS84'
'units=m'
'no_defs'
END
CLASS
NAME 'commune'
STYLE
WIDTH 0.91
OUTLINECOLOR 0 0 0
COLOR 103 132 169
END
END
END

-

5.2

Ở đây câu lệnh CONNECTIONTYPE và CONNECTION sẽ giúp ta kết nối với
cơ sở dữ liệu

Thiết kế giao diện cho Webgis (xây dựng file mapview.php)
-

Khai báo thư viện html, và thư viện script (cần được tải về và lưu vào
htdocs/js/)


<script type="text/javascript" src="js/ext-base.js"></script>
<script type="text/javascript" src="js/ext-all.js"></script>
<link rel="stylesheet" type="text/css" href="js/ext-all.css" />
<link rel="stylesheet" type="text/css" href="js/examples.css" />
<script src="js/OpenLayers/OpenLayers.js"></script>
<script src="js/proj4js-combined.js"></script>
<script src="js/proj4js-compressed.js"></script>
<script type="text/javascript" src="js/GeoExt.js"></script>
<script type="text/javascript" src="js/proj4.js"></script>

-

Ở đây các file java scripts được lấy lên từ folder js đã lưu sẵn trước đó, tránh
việc phải load trực tuyến (khi mất mạng).

-

Download và chỉnh sửa file proxy.cgi và copy vào trong C:\ms4w\Apache\cgibin. Thêm câu lệnh sau vào nguồn:

OpenLayers.ProxyHost = "/cgi-bin/proxy.cgi?url=";


×