Đinh Nhật Minh

onClick="…………………."

/>

Ở mục này

• 
  id=”1” để phân biệt giữa các hotspt với nhau, tại một điểm (“điểm” là nơi ảnh 360° được hienr thị, và hotspot được gán lên trên đó) có thể có số lượng hotspot kahcs nhau, ví dụ tại ngã ba thì số lượng hotspot sẽ nhiều hơn trên đường thẳng.
  
• 
  pan=”0” và tilt=”0” là 2 biến để định vị trí của hotspot, 2 biến này quan hệ chặt chẽ với 2 biến lastPanAngle và lastTiltAngel trong flash.
  
• 
  url=”hotspot.jpg” là đường dẫn đến file hình ảnh hiển thị cho hotspot.
  
• 
  Zoom=”1” là mức độ zoom của hotspot, giá trị này thay đổi theo giá trị zoom của flash.
  
• 
  Street và point là 2 thuộc tính xác định đường dẫn đến fie ảnh cần thiết
  
• 
  onClick=”……….”, trong phần …. là đoạn script mà flash sẽ thực hiện khi ta click vào hotspot, ở chương trình của chúng ta, đơn giản chỉ là thay đổi đường dẫn tới thư mục có ảnh tương ứng.
  

5. 
   Thực nghiệm
   
   1. 
      Môi trường thực nghiệm
      

RAM: 1024MB

OS: Microsoft Windows XP Professional Version 2002 Service Pack 3

HDD: 80GB (33,6GB – 32,9GB – 7,98GB)

1. 
   Công cụ thực nghiệm
   

• 
  Adobe Flash CS3
  
• 
  Adobe Flash Player 10.0
  
• 
  Flex Builder 3.0
  
• 
  Internet Explorer 7.0
  
• 
  Away3d ver 2.3
  

3. 
   Quá trình thực nghiệm
   

Trong đó:

• 
  away3d.cameras.HoverCamera3D: là lớp nằm trong away3d, tạo một camera mở rộng lơ lửng xung quanh một đối tượng được chỉ định.
  
• 
  away3d.containers.Scene3D: là lớp nằm trong away3d, là một container gốc chứa tất cả các đối tượng 3d trong một phông cảnh đơn (single scene).
  
• 
  away3d.containers.View3D: là lớp nằm trong away3d, là một Sprite container dùng để lưu trữ camera, scene, session, renderer và các clip có liên quan, bên cạnh đó lớp View3D cũng dùng để xử lý các sự kiện của chuột.
  
• 
  away3d.core.utils.Cast: là lớp nằm trong away3d, đây là lớp trợ giúp dùng để bắt trả về một kiểu dữ liệu được chỉ định của các đối tượng được sử dụng, trong chương trình này, ta đưa đối tượng về kêiur dũ liệu BitmapData.
  
• 
  away3d.events.*: là lớp nằm trong away3d, các class nằm trong events, để nắm bắt và xử lý các sự kiện như là CameraEvent, LoaderEvent hay Object3Devent….
  
• 
  away3d.lights.DirectionalLight3D: là lớp nằm trong away3d, là nguồn sáng để tô màu tất cả các nguyên liệu (material) bóng mờ theo tỉ lệ điểm sinh ra của vector có khoảng trống với vector thường. Giá trị vô hướng của khoảng cách không ảnh hưởng đến kết quả cường độ sáng, chúng được tính toán ngay cả khi nguồn là một khoảng cách vô hạn với một độ sáng vô hạn.
  
• 
  away3d.materials.BitmapMaterial: là lớp nằm trong away3d, là nguyên liệu kiểu Bitmap cơ bản.
  
• 
  away3d.primitives.Skybox: là lớp nằm trong away3d, đây chính là bức tranh toàn cảnh 360° được thiết lập với 6 mặt, giống như 6 mặt bên trong của một khối lập phương.
  
• 
  flash.display.*: là lớp có sẵn của flash, bao gồm các lớp phục vụ cho việc hiển thị của chương trình.
  
• 
  flash.events.*: là lớp có sẵn của flash, gồm các lớp thực hiện việc nắm bắt và xử lý các sự kiện như MouseEvent, KeyboardEvent…
  
• 
  flash.net.URLLoader và flash.net.URLRequest: là 2 lớp sẵn có của flash, phục vụ cho việc tải các tài nguyên từ bên ngoài mà không cần phải đưa các tài nguyên đó vào trong thư viện của flash, ta sẽ giải thích kỹ hơn về vấn đề này trong phần sau.
  
• 
  flash.utils.Timer: là lớp sẵn có của flash, sử dụng với mục đích dừng chương trình trong một khoảng thời gian nhất định để cho các dữ liệu bên ngoài được tải về một cách đầy đủ.
  

Sau đó là việc tải (load) các ảnh nằm ngoài thư viện vào chương trình, flash có hay kiểu dữ liệu về ảnh là Bitmap và BitmapData, ta không thể trực tiếp đưa ảnh vào các biến có kiểu như trên mà phải thông qua biến kiểu Loader. Hai lớp flash.net.URLLoader và flash.net.URLRequest chính là để phục vụ cho bước này.

Sau khi đã load được ảnh vào trong các biến thích hợp, ta sẽ khởi tạo một khối lập phương với 6 mặt là 6 ảnh đã load, đó là Skybox, tuy nhiên tham số đầu vào của Skybox lại là kiểu dữ liệu dùng riêng cho away3d là BitmapMaterial chứ không phải là Bitmap hay BitmapData, do đó, ta phải dùng đến lớp away3d.core.utils.Cast, lớp này cho phép ta đọc kiểu dữ liệu Bitmap hoặc BitmapData về kiểu dữ liệu BitmapMaterial.

Một vấn đề khác nảy sinh, đó là biến kiểu Loader do phải đọc dữ liệu từ bên ngoài vào nên tốc độ xử lý chậm, nếu thực hiện việc gán giá trị ngay lúc đó thì các biến sẽ có giá trị là null, và kết quả khi đưa ra màn hình sẽ là một lưới các tam giác (TriangleGrid). Để khắc phục, tôi đã sử dụng đến class flash.utils.Timer để dừng chương trình trong một khoảng thời gian đủ để load xong các ảnh và gán giá trị vào các biến.

Sau khi đã có được khung ảnh, có điểm nhìn, camera và cả đối tượng 3D, việc cuối cùng chúng ta cần làm là xử lý việc xoay của khối lập phương bằng chuột. Ta sẽ dùng hàm addEventListrner với các sự kiện của chuột, ta nắm bắt các sự kiện sau:

• 
  Chỉ xử lý khi chuột tiến vào trong màn hình (ENTER_FRAME), khi đó ta cần có một biến lưu trạng thái (có được di chuyển hay không), đặt tên là move, kiểu dữ liệu Boolean, việc di chuyển chỉ được thực hiện khi move = true;
  
• 
  Khi chuột ra khỏi màn hình (MOUSE_LEAVE), bất kể trạng thái của chuột như thế nào (click chuột trái, click chuột phải hay không, di chuyển hay không di chuyển…), trạng thái màn hình không thay đổi, khi đó gán move = false;
  
• 
  Khi chuột di chuyển (MOUSE_MOVE):
  
  • 
    Khi chuột trái được bấm và giữ (MOUSE_DOWN): thực hiện di chuyển, bằng cách gán move = true;
    
  • 
    Khi chuột trái được thả (MOUSE_UP): không thực hiện gì, bằng cách gán move = false;
    

Điều quan trọng hiện nay là cho phép người dùng “tự do” chọn những địa điểm mà mình đưa ra, không nhất thiết phải tiến hay lùi lần lượt từng bước một. Việc tạo hotspot đã thành công, tuy nhiên, việc sắp xếp và lưu trữ, cũng như nội dung của file xml hiện nay vẫn chưa được hoàn thiện.

6. 
   Kết quả thực nghiệm
   

Sau (back) – Trái (left) – Trước (front) – Phải (right) – Dưới (down) – Trên (up)

Và bên dưới là kết quả thu được

Kết quả thu được tuy không thể có nhiều chức năng nhự của Google Maps Street View hay MapJack nhưng đã đáp ứng được các yêu cầu đề ra của bài toán, cơ bản tạo cho người sử dụng cảm giác đang đứng tại đúng vị trí như ngoài đời thật, có thể nhìn bao quát xung quanh (tuy hạn chế về phía trên và bên dưới).

Chương trình thu được các kết quả như sau:

• 
  Cho phép người dùng “nhìn” xung quanh 360°
  
• 
  Tạo được các hotspot trên màn hình, làm tiền đề cho việc định dạng con đường và các dự định sau này.
  
• 
  Cho phép người sử dụng tiến hoặc lùi lần lượt tới các điểm liền kề dựa vào bàn phím hoặc button trên màn ảnh.
  

• 
  Chưa có chế độ zoom in và zoom out
  
• 
  Chưa có phần hỗ trợ công cụ (độ tương phản, độ nét, ánh sáng…)
  
• 
  Chưa vận hành trên mô hình client-server, chỉ kiểm tra trên local host
  
• 
  Và các ý tưởng khác
  

1. 
   Đóng góp của mình
   

• 
  Tìm hiểu về công nghệ Flash và ngôn ngữ lập trình Action Script
  
• 
  Nghiên cứu, tìm hiểu Google Maps API và công cụ hỗ trợ là Krpano
  
• 
  Tìm hiểu, đánh giá các open source hỗ trợ cho chương trình, như away3d, papervision3d, sandy…
  
• 
  Phân tích bài toán mục tiêu và đưa ra hướng giải quyết
  
• 
  Xây dựng thành công chương trình demo cho một đoạn đường nhỏ
  

2. 
   Hướng phát triển của đề tài
   

Việc cập nhật Cơ sở dữ liệu đơn giản chỉ là cập nhật (thêm mới hoặc chỉnh sửa) lại các hình ảnh về tuyến đường, về khu vực. Chính do việc đặt cơ sở dữ liệu bên ngoài flash nên việc cập nhật sẽ không phức tạp như khi đặt trong flash.

Trên các tuyến đường, các nhà hàng, khách sạn, địa điểm kinh doanh, vui chơi giải trí có thể đăng ký để được quảng cáo trên dịch vụ Street View. Ý tưởng hiện nay là: khi đến địa điểm của một nhà hàng nào đó, người sử dụng có thể click vào hình ảnh của nhà hàng, khi đó sẽ hiện ra các thông tin về nhà hàng đó. Phát triển cao hơn nữa, chúng ta có thể cho phép người sử dụng “tham quan” bên trong nhà hàng đó. Việc “tham quan” bên trong một kiến trúc thực hiện tương tự như việc chúng ta cho người sử dụng “đi lại” và “quan sát” trên đường phố, chỉ thay đổi về cảnh vật.

Street View có tích hợp với hệ thống bản đồ, do đó việc tìm đường sẽ dễ dàng hơn, việc tìm các điểm mốc sẽ dễ hơn khi có hình ảnh cụ thể.

Bên cạnh đó, do hạn chế về mặt thời gian cũng như phương tiện, chương trình demo chưa thực hiện đầy đủ các chức năng như mong muốn của tác giả, nếu đề tài này được đầu tư và phát triển, tôi tin rằng kết quả sẽ tốt hơn và lợi ích mà nó mang lại cũng không nhỏ.

Tài liệu tham khảo

Các tài liệu về adbo flash và Action Script:

[1] OReilly. Learning.ActionScript.3.0.A.Beginners.Guide.Jan.2008

[2] Friends of Ed Foundation ActionScript Animation Making Things Move

[3] Trang web: http://www.kirupa.com/

Các tài liệu về away3d:

[4] Trang web: http://away3d.com/