Kiến trỳc hệ thống

Một phần của tài liệu tuyển tập các báo cáo hội nghị khoa học lần thứ 20 hà nội tháng 11 năm 2012 đại học mỏ địa chất (Trang 57 - 60)

- Mục đớch bản đồ: Cỏc bản đồ phổ thụng và bản đồ tra cứu đũi hỏi cỏc ký hiệu cú hỡnh th ức thể hiện khỏc nhau, độ chớnh xỏc định vị cũng khỏc nhau

a.Kiến trỳc hệ thống

Hệ thống thiết kế với 3 tầng khỏc nhau như sau:

Tầng trỡnh bày : được xõy dựng bằng Javascirpt, HTML và DHTML, thực hiện nhiệm vụ xử lý cỏc thao tỏc, lưu trữ thụng tin ứng với từng người sử dụng, đảm nhận vai trũ trung gian, truyền nhận dữ liệu, giữa người sử dụng với web server.

Tầng ứng dụng : chia làm 2 thành phần : GeoServer và OpenLayer. Cả 2 đều được phỏt triển dựa trờn cụng nghệ Java

o GeoServer: Đưa dữ liệu thành dạng cú thể đưa lờn Web, xử lý cỏc thao tỏc về phỏt sinh bản đồ, phúng to, thu nhỏ,dịch chuyển, tra cứu thụng tin trờn bản đồ.

o OpenLayer: Giỳp cho tập hợp bản đồ của ta cú thể liờn kết với bản đồ Google Map hoặc yahoo map. Ngoài ra OpenLayer cú thể hỗ trợ tạo ra cỏc cụng cụ cú thể cập nhật dữ liệu ngay trờn nền web từ những mỏy khỏch.

Tầng cơ sở dữ liệu : đúng vai tr ũ trung gian giữa tầng ứng dụng với cơ sở dữ liệu. Theo kiến trỳc hệ thống được trỡnh bày ở trờn thỡ hai phần chớnh mà nhúm tỏc giả muốn đi sõu trỡnh bày đú là “Tầng cơ sở dữ liệu” và “Tầng ứng dụng”

3.2. Cơ sở dữ liệu địa lý sử dụng

Dữ liệu địa lý sử dụng là dữ liệu tỉ lệ 1/50000 cú phạm vi địa lý nằm ở khu vực Hà Nội.

Dữ liệu địa lý đư ợc cung cấp bởi phũng đo đ ạc bản đồ thuộc Bộ Tài nguyờn và Mụi trường. Dữ liệu gồm 6 lớp cỏc lớp thụng tin sau:

Tuyển tập bỏo cỏo Hội nghị Khoa học lần thứ 20, Đại học Mỏ - Địa chất, Hà Nội, 15/11/2012 55 2) Thủy hệ 3) Giao thụng đường bộ 4) Giao thụng đường sắt 5) Hệ thống cầu 6) Trụ sởủy ban

3.3. Ứng dung Geoserver và Openlayer để biờn tập và đưa dữ liệu lờn Web

Để đưa được một tập hợp bản đồ lờn Web, chỳng tụi muốn đưa ra một quy trỡnh xõy dựng theo cỏch đơn giản nhất. Dưới đõy là hỡnh vẽ mụ tả quy trỡnh sử dụng Geoserver và OpenLayer biờn tập dữ liệu đưa lờn Web.

Hỡnh vẽ 3.1. Quy trỡnh xõy dựng Web Map

Tạo mới 1 Workspace: Tạo Workspace giống như một thư mục chứa cỏc nhúm lớp cú tớnh chất giống nhau.

Nguồn dữ liệu: Là những dạng format dữ liệu khỏc nhau mà Geoserver cú thể nhận biết được. Đối với Geoserver thỡ những loại dữ liệu sau cú thể đọc trực tiếp là: Với raster : Arcgrid, Geotiff, Gtopo30, và một số loại ảnh ghộp. Đối với dữ liệu vector: ESRI shape file, PosGIS, PosgreSQL…

Tạo lớp dữ liệu là thủ tục tiếp theo giống như chỳng ta khai bỏo ra tờn của lớp dữ liệu sẽ được hiển thị trờn Geoserver.

Khai bỏo cỏc thụng số: Hệ tọa độ (hệ tọa độ khai bỏo trong Geoserver là hệ tọa độ của cở sở dữ liệu ban đầu), kiểu dữ liệu khi hiển thị trong Geoserver…

Viết code html để hiển thị bản đồ

Sử dụng cỏc phần mềm viết code html kết hợp với việc sử dụng cỏc hàm của ứng dụng OpenLayers, chỳng ta cú thể hiển thị bản đồ được lưu trữ trong GeoServer lờn bất kỳ một trang web nào.

Kết quả ta được một file cú định dạng html. Dưới đõy là một số vớ dụ về việc đưa dữ liệu vào trong một file của Openlayer.

Hiển thịngày, thỏng, năm trờn trang web:

<script language="JavaScript"> var today = new Date();

var thisHours = today.getHours();

CSDL đó được xõy dựng trờn Desktop Đưa CSDL lờn GeoServer - Tạo Workspace. - Chọn nguồn dữ liệu. - Tạo cỏc lớp dữ liệu. - Khai bỏo cỏc thụng số cho

cỏc lớp dữ liệu.

Viết code HTML, kết hợp với OpenLayer

Tuyển tập bỏo cỏo Hội nghị Khoa học lần thứ 20, Đại học Mỏ - Địa chất, Hà Nội, 15/11/2012

56

var thisMinutes = today.getMinutes();

var weekdayNames = ['Chủ nhật', 'Thứ Hai', 'Thứ Ba', 'Thứ Tư', 'Thứ Năm',

'Thứ Sỏu', 'Thứ Bảy']; (adsbygoogle = window.adsbygoogle || []).push({});

var monthNamesR = ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12'];

var thisDay = today.getDay(); var thisDate = today.getDate(); var currMonth = today.getMonth(); var currYear = today.getFullYear();

if(today.getMinutes() < 10) {thisMinutes = "0" + today.getMinutes()}; if(today.getHours() < 10) {thisHours = "0" + today.getHours()}; function datetime() {

document.write(weekdayNames[thisDay] + ", " + thisDate + "/" + monthNamesR[currMonth] + "/" + currYear + ", " + thisHours + ":" + thisMinutes)

}

function popCenter(URL,name,w,h) { l = (screen.width - w) / 2 ;

t = (screen.height - h) / 2; params = '';

popCenterWin = window.open(URL, name, params + 'width=' + w + ', height=' + h + ', left=' + l + ', top=' + t + ', location=0,status=0,scrollbars=1');

popCenterWin.focus(); return false;

} </script>

Đưa dữ liệu trong GeoServer vào file html của OpenLayer

var GT = new OpenLayers.Layer.WMS( "Giao thụng đường bộ", "/geoserver/wms", {layers: 'hanoi:HNO_GT', transparent: 'true', format: 'image/png'} );

map.addLayers([wms, satellite, yahooLayer, Huyen, Thuyhe1, Thuyhe2, Xa, GT, GT1, GT2, UBND]);

Giải thuật:

+ Khai bỏo cỏc lớp bản đồ và liờn kết để lấy cơ sở dữ liệu trong GeoServer và hiển thị cỏc lớp bản đồ.

+ layers: ' hanoi:HNO_gthong',

Lớp: 'Tờn Workspaces: tờn lớp dữ liệu'

+transparent: 'true',

Chế độ hiển thị: true (Hiển thị dưới dạng lớp dữ liệu chồng phủ: Overlays);

false (Hiển thị thành lớp bản đồ cơ sở: Base Layer)

+format: 'image/png'

Định dạng dữ liệu: Tuỳ thuộc vào dữ liệu mà ta chọn định dạng cho phự hợp nhưng đa phần đều là hiển thị bản đồ web dưới dạng ảnh nờn định dạng chủ yếu vẫn là image/png.

Tuyển tập bỏo cỏo Hội nghị Khoa học lần thứ 20, Đại học Mỏ - Địa chất, Hà Nội, 15/11/2012 57 Hỡnh 3.2. Cỏc lớp bản đồ khi hiển thị trờn GeoServer - Hiển thị toạđộ tại từng vị trớ của bản đồ của khu vực nghiờn cứu map.addControl(new OpenLayers.Control.MousePosition()); Giải thuật:

+ Toạ độ của bản đồ được hiển thị theo toạ độ địa lý và ở gúc dưới bờn phải của khung bản đồ.

Một phần của tài liệu tuyển tập các báo cáo hội nghị khoa học lần thứ 20 hà nội tháng 11 năm 2012 đại học mỏ địa chất (Trang 57 - 60)