Phân tích dữ liệu trò chơi của Oculus Rift bằng Bluemix
Eduardo Domene, Jr. (https://www.ibm.com/
31 03 2015
developerworks/community/profiles/html/simpleSearch.do?
searchFor=2700077F2U&searchBy=userid&lang=en&tabid=dWAboutMe)
Kỹ sư phần mềm
Student
Guilherme Borges Oliveira (https://www.ibm.com/
developerworks/community/profiles/html/
profileView.do?key=34966777-7562-48dd-8c66c9c5beb5aea8&tabid=dwAboutMe)
Kỹ sư phần mềm
Student
Jordan Boaz Rodrigues (https://www.ibm.com/
developerworks/community/profiles/
html/profileView.do?key=78d4a550c3ea-4f71-910c-843320d0fd1b&tabid=dwAboutMe)
Kỹ sư phần mềm
Student
Bradley Steinfeld
Nhà phát triển phần mềm
IBM
Môi trường người dùng tương tác giúp cho việc học dựa trên trò chơi kỹ thuật số trở nên thu hút
và hiệu quả. Và dữ liệu đã thu thập có thể giúp các lập trình viên trò chơi cải thiện giá trị mang
tính giáo dục của trò chơi. Xem cách thức dữ liệu được thu thập từ thiết bị thực tế ảo Oculus Rift
có thể được truyền đến máy chủ Bluemix để phân tích như thế nào. Ứng dụng BlueMix lưu trữ
tất cả dữ liệu từ Rift, như chuyển động của đầu người dùng, có thể được phân tích để nắm bắt rõ
hơn về tốc độ học tập.
Đăng ký IBM Bluemix™
Nền tảng đám mây này có sẵn dịch vụ, thời gian chạy (runtime) và cơ sở hạ tầng miễn phí,
giúp bạn nhanh chóng tạo và triển khai ứng dụng di động hoặc web tiếp theo của bạn.
Thực tế ảo (VR) là công nghệ đương thời, và thiết bị VR như Oculus Rift đã trở nên nổi tiếng trong
các công ty công nghệ, bao gồm Sony và Facebook. Cách thức người dùng tương tác với VR rất
đơn giản. Thiết bị nắm bắt những chuyển động từ tư duy của người chơi và gửi dữ liệu này đến máy
© Copyright IBM Corporation 2015
Phân tích dữ liệu trò chơi của Oculus Rift bằng Bluemix
Nhẫn hiệu đăng ký
Trang 1 của 10
developerWorks®
ibm.com/developerWorks/vn/
tính, tạo ra môi trường ảo tương tác, hòa nhập. Ngoài ra, dữ liệu đã thu thập này có thể được lưu
trữ cho lần phân tích tiếp theo để cải thiện trải nghiệm người dùng. Bluemix là nền tảng thực hiện
tác vụ này hoàn hảo.
Hướng dẫn này mô tả cách tạo ứng dụng đơn giản bằng Bluemix và vr.js, plug-in trình duyệt. Ứng
dụng này thu thập vị trí hệ tọa độ quaternion (x, y, z, và w) từ Oculus Rift và gửi đến Cloudant, cơ
sở dữ liệu dưới dạng dịch vụ (DBaaS). Bạn có thể triển khai ứng dụng này cho Bluemix và sử dụng
nó khi kết nối với Oculus Rift và mở trình duyệt.
“ Tạo hệ thống VR linh hoạt có thể được mở rộng cho nhiều
kiểu ứng dụng mới, bằng cách tích hợp Node.js, Cloudant,
và Oculus Rift. ”
Chạy ứng dụng
Nhận mã
Những điều cần có để tạo ứng dụng
•
•
•
•
•
•
Tài khoản DevOps Services được liên kết với ID IBM của bạn
Tài khoản Bluemix
Khung Express và nano
Cơ sở dữ liệu Cloudant
plug-in trình duyệt vr.js
Hiểu biết cơ bản về Node.js
Bước 1. Phân nhánh dự án này
Nhấp vào nút Get the code của hướng dẫn này và phân nhánh dự án trên DevOps Services.
1. Nhấp vào EDIT CODE (nhập chứng danh DevOps Services nếu bạn chưa đăng nhập).
2. Nhấp vào nút FORK trên trình đơn để tạo dự án mới.
3. Khi bạn nhìn thấy dấu nhắc, hãy chọn tên kho lưu trữ được phân nhánh mới. Chúng ta chọn
rift2cloudant.
4. Kiểm tra Deploy to Bluemix.
5. Nhấp vào SAVE để tạo bản sao của mã trong dự án và kho lưu trữ Git.
Bạn có thể để chế độ riêng tư cho dự án này bằng cách nhấp vào ô chọn Make it private (not
public).
Lập cấu hình máy chủ và tên cho ứng dụng của bạn
Để triển khai mã này đến Bluemix, bạn cần phải thiết lập một số cấu hình để có thể xác định tên và
máy chủ mới cho ứng dụng.
1. Nhấp vào BUILD & DEPLOY.
2. Trên trang đang mở, hãy chọn OFF. Bạn không muốn tự động triển khai các thay đổi được
thực hiện trong kho lưu trữ.
3. Nhấp vào EDIT CODE.
4. Nhấp vào manifest.yml.
Phân tích dữ liệu trò chơi của Oculus Rift bằng Bluemix
Trang 2 của 10
ibm.com/developerWorks/vn/
developerWorks®
Bạn cần phải đổi tên và máy chủ hiện có thành một tên duy nhất cho máy chủ của bạn. Chúng ta đã
thay đổi ký hiệu host và name gốc thành rift2cloudant.
Cam kết các thay đổi
Đi đến trang trạng thái git bằng cách nhấp vào Git Repository:
Tiếp theo, phân cấp việc điều chỉnh để cam kết và sau đó nhúng chúng vào kho lưu trữ.
1. Trong hộp văn bản, gõ các điều chỉnh mà bạn đã thực hiện.
2. Nhấp vào Select All để thêm các tập tin vào cam kết.
3. Nhấp vào COMMIT:
4. Nhấp vào Push.
5. Quay lại Show Current Folder (Hiển thị thư mục hiện tại).
6. Nhấp vào DEPLOY.
7. Trong pop-up, nhấn Deploy để triển khai ứng dụng.
Thêm dịch vụ Cloudant
Nếu ứng dụng triển khai thành công, ứng dụng mới được khởi động trong tài khoản Bluemix của
bạn. Để thêm dịch vụ Cloudant:
1. Nhấp vào ứng dụng mới xuất hiện trên bảng điều khiển. Bạn sẽ nhìn thấy dấu chấm đỏ cho biết
ứng dụng không chạy.
2. Nhấp vào ADD A SERVICE.
3. Cuộn xuống đến khi bạn tìm thấy Cloudant JSONDB và chọn nó.
4. Trong trường Name, gõ cloudant và nhấn Create. Nếu bạn muốn sử dụng tên khác cho dịch
vụ Cloudant, phải chắc chắn thay đổi mã trong app.js. Tìm kiếm mã này:
var cloudantServiceName = 'cloudant';
Phân tích dữ liệu trò chơi của Oculus Rift bằng Bluemix
Trang 3 của 10
developerWorks®
ibm.com/developerWorks/vn/
Pop-up xuất hiện và yêu cầu bạn khởi động lại ứng dụng.
5. Nhấp vào OK.
Bước 2. Sao chép và nhúng
Bạn muốn giữ kho lưu trữ cục bộ của ứng dụng để khi điều chỉnh mã, bạn có thể đẩy các thay đổi
vào Bluemix. Để bắt đầu:
1. Đến trang chính của dự án trong DevOps Services và sao chép git URL:
2. Để sao chép dự án vào máy tính, hãy mở thiết bị cuối (nếu bạn sử dụng Windows, chúng tôi
đề xuất git bash), gõ git clone và sau đó dán liên kết mà bạn vừa sao chép (ví dụ, git clone
https://hub.jazz.net/project).
3. Quay lại tài khoản Bluemix, nhấp vào ứng dụng, sau đó mở VIEW QUICK START (Xem khởi
động nhanh). Cửa sổ này xuất hiện:
4. Trong thiết bị cuối, đến thư mục được sao chép và làm theo các bước một, haivà ba được liệt
kê tại đó.
Phân tích dữ liệu trò chơi của Oculus Rift bằng Bluemix
Trang 4 của 10
ibm.com/developerWorks/vn/
developerWorks®
Nhúng các thay đổi vào Bluemix
Bất cứ khi nào bạn muốn triển khai các điều chỉnh vào trong ứng dụng trong tài khoản Bluemix, bạn
cần nhúng điều chỉnh.
1. Mở thiết bị cuối mới.
2. Từ trong kho lưu trữ được sao chép, gõ cf push –c "node app.js".
Ứng dụng của bạn hiện đang chạy. Dấu chấm xanh lá xuất hiện bên cạnh Đang chạy.
Bước 3. Chuẩn bị DBaaS (Cloudant)
Trước hết, hãy tạo cơ sở dữ liệu Cloudant. Để bắt đầu:
1. Mở bảng điều khiển Bluemix, nhấp vào ứng dụng của bạn, và sau đó nhấp vào dịch vụ
Cloudant. Trang mới mở ra, hiển thị thông tin về dịch vụ và cách khởi động.
2. Nhấp vào LAUNCH để truy cập dịch vụ. Phải chắc chắn bạn ở trong phần Databases (Cơ sở dữ
liệu) (đánh dấu màu cam).
3. Phần này sẽ hiển thị tất cả cơ sở dữ liệu của bạn. Bạn muốn tạo cơ sở dữ liệu mới để sử dụng
trong ứng dụng, hãy nhấp vào Add New Database.
4. Trong cửa sổ pop-up, tại Tên cơ sở dữ liệu, gõ users để tạo cơ sở dữ liệu được gọi là users.
5. Tiếp theo, tạo cơ sỡ dữ liệu mới được gọi là riftbase. Làm theo các bước giống nhau: Nhấp vào
Add New Database và khi được nhắc, gõ riftbase.
Bước 4. Hiểu và lập cấu hình ứng dụng
Bạn vẫn cần phải cài đặt plug-in. Tuy nhên, trước hết, trước khi đi đến ứng dụng, bạn phải hiểu
những phần quan trọng nhất của mã.
Mã này nằm trong tập tin app.js:
var cloudantServiceName = 'cloudant';
Đây là nơi chương trình sẽ tìm kiếm dịch vụ Cloudant trong Bluemix. Nếu đã làm theo các bước
trước đó và đã tạo dịch vụ có tên cloudant, bạn không cần phải điều chỉnh. Tuy nhiên, nếu đã tạo
dịch vụ với tên khác, bạn chỉ cần thay đổi mã cho tên bạn chọn. Ngoài ra, bạn phải có hai cơ sở dữ
liệu, người dùng và riftbase được tạo trong Cloudant. Các cơ sở dữ liệu này sẽ được gọi ra trong hai
phần của mã:
var db = nano.db.use('riftbase');
Phân tích dữ liệu trò chơi của Oculus Rift bằng Bluemix
Trang 5 của 10
developerWorks®
ibm.com/developerWorks/vn/
và
var db = nano.db.use('users');
Nếu sử dụng các tên khác cho cơ sở dữ liệu, bạn phải điều chỉnh mã này.
Gửi dữ liệu đến Cloudant
Mã này, nằm trong app.js, tạo trình xử lý post nên nó có thể gửi thông tin sẽ được lưu trữ trong cơ
sở dữ liệu Cloudant:
app.post('/endpoint', function(req, res){
res.send(req.body);
db.insert({position:req.body},function(err, body, header) {
if (err) {
res.send("Error creating file");
return;
}
});
});
Yêu cầu post này được kích hoạt mỗi giây bởi hàm có tên là myTimer (bạn có thể tìm thấy myTimer
trong mã oculus.ejs, đây là mã raw_data.html được điều chỉnh nằm trong thư mục views ):
function myTimer() {
if(state.hmd.present){
var data = {};
data.x = state.hmd.rotation[0].toFixed(2);
data.y = state.hmd.rotation[1].toFixed(2);
data.z = state.hmd.rotation[2].toFixed(2);
data.w = state.hmd.rotation[3].toFixed(2);
data.seconds = (endTime - startTime)/1000;
data.seconds = (data.seconds).toFixed(0);
$.post("/endpoint", data, function(response){
console.log(data);
});
}
}
Mã này dành cho trang người dùng được đặt trong app.js. Nó hoạt động bằng cách gửi Name và Age
đến cơ sở dữ liệu người dùng trên Cloudant:
app.post('/insert',function(req,res){
var db = nano.db.use('users');
var name = req.body.name
var age = req.body.age
db.insert({name:name,age:age},function(err,body,header){
if(err){
console.log(err);
return res.status(500).send(err.message);
}
res.send("Contact was created successfully");
console.log("success");
});
});
Phân tích dữ liệu trò chơi của Oculus Rift bằng Bluemix
Trang 6 của 10
ibm.com/developerWorks/vn/
developerWorks®
Bước 5. Cài đặt plug-in vr.js
Plug-in vr.js cho phép Oculus Rift của bạn hoạt động khi sử dụng trình duyệt (Chrome hoặc Firefox).
Bạn cần cài đặt plug-in để mở trang chính của ứng dụng, nhưng bạn vẫn có thể mở trang người
dùng mà không có nó. (Trang chính và trang người dùng được bao gồm trong bước sau.)
Mã được sử dụng trong ứng dụng Oculus Rift này là sự điều chỉnh nhỏ về mã có thể được tìm thấy
trên GitHub.
Bây giờ, trong tập tin app.js , chúng ta có thể ghi phương thức get hoàn trả trang oculus, sử dụng
plug-in vr.js:
app.get('/', function (req, res){
res.render('oculus');
});
Bước 6. Chạy ứng dụng
Ứng dụng có hai trang: trang chính và trang người dùng.
Trang chính
Khi bạn mở trang chính của ứng dụng, bạn được đưa đến trang web hiển thị dữ liệu được thu thập
từ Oculus Rift kết nối với máy tính. Nếu Rift được kết nối, trang sẽ trông như vậy (phải chắc chắn
rằng trang này tải lên vị trí hệ toạ độ quaternion cho cơ sở dữ liệu riftbase trong Cloudant mỗi giây):
Phân tích dữ liệu trò chơi của Oculus Rift bằng Bluemix
Trang 7 của 10
developerWorks®
ibm.com/developerWorks/vn/
Oculus sử dụng hệ tọa độ quaternion, đây là bốn vectơ yếu tố cuối được hiển thị in đậm trong trang
này. Hệ tọa độ quaternion được sử dụng để mã hóa phép quay bất kỳ trong hệ tọa độ 3D.
Bạn có thể lưu trữ giá trị bất kỳ từ trang này. Trong ứng dụng của chúng ta, chỉ bốn yếu tố cuối (giá
trị quaternion) được lưu trữ. Bạn có thể kiểm tra hàm myTimer lần nữa để hiểu cách truy xuất các
giá trị này từ headset và gửi chúng cùng với phương thức post .
ĐỌC: Thêm hệ tọa độ quaternions
Trang người dùng
Nếu bạn không có Rift, hoặc điều gì đó không ổn và bạn muốn chắc chắn ứng dụng của bạn đang
hoạt động, bạn có thể truy cập trang người dùng bằng cách thêm "/users" vào cuối URL (ví dụ,
http://bluemix.net/users). Trang này chỉ là ví dụ để gửi một số dữ liệu đến Cloudant; không yêu cầu
Rift. Hãy điền vào ô và nhấp vào Upload to Cloudant. Sau đó, kiểm tra cơ sở dữ liệu Cloudant của
bạn để xem thông tin có được tải lên thành công không.
Bước 7. Xác thực thu thập dữ liệu và dữ liệu truy vấn được lưu trong
Cloudant
Việc cuối cùng là kiểm tra xem dữ liệu đã được tải lên cơ sở dữ liệu Cloudant hay chưa. Để hiển thị
tài liệu hoàn tất cho mỗi cơ sở dữ liệu, hãy truy cập liên kết về cơ sở dữ liệu Cloudant và thêm liên
kết vào URL: _all_docs?include_docs=true.
Phân tích dữ liệu trò chơi của Oculus Rift bằng Bluemix
Trang 8 của 10
ibm.com/developerWorks/vn/
developerWorks®
Tương tự, nếu bạn nhấp vào Edit doc:
dữ liệu tải vào trang:
Kết luận
Bằng cách tích hợp các công nghệ như Node.js, Cloudant, và Oculus Rift, bạn đã tạo ra hệ thống
VR linh hoạt có thể được mở rộng cho nhiều kiểu ứng dụng mới. Trong khi thiết bị VR cung cấp dữ
liệu về người chơi, Bluemix cung cấp nhiều công cụ để lưu trữ và phân tích dữ liệu. Hãy thử sử dụng
Bluemix cho các dịch vụ khác. Hãy sử dụng trí tưởng tượng của bạn và kết hợp các dịch vụ như Cơ
sở dữ liệu SQL, MySQL, Kho phân tích và nhiều hơn nữa.
Phân tích dữ liệu trò chơi của Oculus Rift bằng Bluemix
Trang 9 của 10
developerWorks®
ibm.com/developerWorks/vn/
Đôi nét về các tác giả
Eduardo Domene, Jr.
Sinh viên
Guilherme Borges Oliveira
Sinh viên
Jordan Boaz Rodrigues
Sinh viên
Bradley Steinfeld
Nhà phát triển phần mềm
© Copyright IBM Corporation 2015
(www.ibm.com/legal/copytrade.shtml)
Nhẫn hiệu đăng ký
(www.ibm.com/developerworks/vn/ibm/trademarks/)
Phân tích dữ liệu trò chơi của Oculus Rift bằng Bluemix
Trang 10 của 10