2011-08-18 27 views
12

Tôi đang chơi với canvas HTML5 và thử nghiệm đầu tiên của tôi, tôi quyết định thử tạo một hình động ô tô đơn giản với đầu vào cơ bản của người dùng. Tôi nghĩ rằng tôi là hầu hết các cách có đầu vào cơ bản và phong trào, nhưng tôi chỉ muốn xem nếu tôi có thể mất nó thêm một chút.Tạo một trò chơi ô tô đơn giản với canvas HTML5

Demo: http://jsfiddle.net/mpxML/20/ (sử dụng các phím mũi tên)

Tôi có một tải hình ảnh, bạn cũng có thể thấy một hình vuông màu đen trong đó di chuyển, đó là điểm dịch, hoặc trong trường hợp xe được chỉ đạo từ. Tôi muốn bằng cách nào đó tạo ra một hiệu ứng trôi dạt có thể đạt được ở tốc độ cao hơn vv Nó cũng có thể biến khi nó không di chuyển, điều đó không đúng.

Dù sao, tôi chỉ không biết tôi cần những gì logic để làm cho chiếc xe cảm thấy bán thực tế hơn.

Cảm ơn

+3

Không t một bình luận hữu ích nhưng chỉ muốn nói công việc tốt đẹp! Tôi lái chiếc xe ra khỏi khung và bây giờ tôi đã mất nó lol !! –

+0

Xin cảm ơn haha.Tôi cần phải có một số ranh giới làm việc thực sự! – Henryz

Trả lời

6

Để khắc phục, bạn phải làm điều gì đó như thế này:

car.angle = car.angle - (car.handeling * car.speed/car.topSpeed); 

này sẽ ngăn chặn từ biến khi tốc độ là 0 và sẽ sửa chữa điều ngược lại quay

để có được hiệu ứng mà bạn nên di chuyển trung tâm chuyển động quay của xe phía trước và cho phép chiếc xe để xoay qua nó tự trôi dạt mà không thực sự quay

+0

Điều đó làm việc thực sự tốt! Bây giờ khi tôi không di chuyển, tôi không thể quay lại, khi tôi đang di chuyển, tôi có thể có một vòng tròn quay chặt. Nhưng khi tôi đi nhanh, tôi muốn hiệu quả xử lý thấp hơn. Tôi đã nghĩ đến việc làm (xử lý/tốc độ). Tôi muốn tôi giỏi hơn trong việc tìm ra nó .. Vấn đề với điều đó là, một khi bạn đi ngược lại, việc xử lý lộn xộn lên vv. < – Henryz

+0

Nếu bạn định phát triển một đường đua tĩnh (không panning) thì trôi dạt là thực sự khó khăn. Tôi đã rối tung xung quanh cuộc đua 2d một vài năm trước và tôi không thể quản lý trôi dạt rất tốt. Nó hoặc là rất tinh tế mà bạn khó có thể nhận thấy nó hoặc nó đã được đáng chú ý và thực hiện xử lý cực kỳ khó khăn. – JSantos

4

Trình diễn tuyệt vời, hãy yêu thích! Tôi không lái xe, đây là những ý tưởng của tôi. Tôi khuyên bạn nên thử nghiệm, bạn không để đi cho chủ nghĩa hiện thực - hãy nhớ bạn đang làm cho một trò chơi, bạn muốn đi cho vui :)

Đảo ngược

tôi sẽ làm cho công việc ngược lại đúng cách, khi bạn đảo ngược nó không quay theo hướng tôi mong đợi từ phong trào xe truyền thống.

Drifting

này sẽ được kích hoạt khi tốc độ/góc xoay là một số tiền nhất định. Một khi các điều kiện đã được đáp ứng bạn có thể làm một cái gì đó như ngăn chặn bất kỳ chuyển tiếp (bằng cách khóa hướng hiện tại) và góc xe ~ 30o từ hướng cho đến khi phím tăng tốc là unpressed

Quay

tôi m không phải là tài xế, nhưng tôi nghĩ góc quay của bạn sẽ chặt hơn khi bạn ở tốc độ chậm hơn, có lẽ tạo ra một công thức đơn giản cho điều này, một số mối quan hệ giữa tốc độ và số lượng rẽ.

Shameless plug

tôi phải tiết lộ Tôi làm việc cho Scirra.com và chúng tôi có một số phần mềm Construct 2 (Download), đó là một trò chơi của Windows Chương trình xây dựng cho các trò chơi HTML5, nó có thể là giá trị một cái nhìn cho bạn (tùy thuộc vào mục tiêu của bạn)! Nó có thể mở rộng với JavaScript, vì vậy bạn có thể viết hành vi di chuyển của riêng bạn và sử dụng những người khác, làm cho trò chơi ô tô trở nên trực quan hơn và dễ dàng hơn (theo ý kiến ​​của chúng tôi!)

+0

Hey, cảm ơn vì phản hồi :) Cảm nhận tốt về việc trôi dạt, tôi sẽ cố gắng làm việc đó! Tôi đang làm việc trên vòng tròn quay và tôi cũng sẽ kiểm tra Construct 2 :) – Henryz

Các vấn đề liên quan