Phóng to về phía chuột (ví dụ: các bản đồ của Google)

Question

Tôi đã viết một lớp view_port chế biến tại nhà cho một trò chơi chiến lược 2D. Các panning (với các phím mũi tên) và phóng to (với bánh xe chuột) hoạt động tốt, nhưng tôi muốn nhìn vào cũng nhà đối với bất cứ nơi nào con trỏ được đặt, như trong Google Maps or Supreme Commander

tôi sẽ tha cho bạn những chi tiết cụ thể về cách thu phóng được triển khai và thậm chí ngôn ngữ tôi đang sử dụng: tất cả điều này đều không liên quan. Điều quan trọng là chức năng zoom, điều chỉnh cấu trúc hình chữ nhật (x, y, w, h) đại diện cho khung nhìn. Cho đến nay các mã trông như thế này:

void zoom(float delta, float mouse_x, float mouse_y) 
{ 
    zoom += delta; 
    view.w = window.w/zoom; 
    view.h = window.h/zoom; 
    // view.x = ??? 
    // view.y = ??? 
} 

Trước khi ai đó gợi ý nó, sau đây sẽ không công việc:

view.x = mouse_x - view.w/2; 
view.y = mouse_y - view.h/2; 

bức tranh này minh họa tại sao, như tôi đã cố gắng để phóng to về phía khuôn mặt cười:

Như bạn có thể nhìn thấy khi các đối tượng bên dưới chuột được đặt trong t trung tâm của màn hình nó dừng lại dưới con chuột, vì vậy chúng tôi ngừng phóng to về phía nó!

Nếu bạn đã có một đầu cho toán học (bạn sẽ cần một) bất kỳ trợ giúp về điều này sẽ được đánh giá cao nhất!

Answer 1

Tôi đã cố gắng tìm ra giải pháp, nhờ có rất nhiều đầu trầy xước rất nhiều hình ảnh nhỏ: Tôi sẽ đăng thuật toán ở đây trong trường hợp bất kỳ ai khác cần đến nó.

Vect2f mouse_true(mouse_position.x/zoom + view.x, mouse_position.y/zoom + view.y); 
Vect2f mouse_relative(window_size.x/mouse_pos.x, window_size.y/mouse_pos.y); 
view.x = mouse_true.x - view.w/mouse_relative.x; 
view.y = mouse_true.y - view.h/mouse_relative.y; 

Điều này đảm bảo rằng các đối tượng được đặt dưới con chuột nằm dưới con chuột. Bạn có thể xem mã trên github và tôi cũng đã tạo bản trình diễn giới thiệu cho youtube.

Answer 2

Trong khái niệm của tôi có một máy ảnh và một màn hình. Máy ảnh là bộ phận chuyển động. Màn hình là phần có thể mở rộng.

Tôi đã tạo một tập lệnh mẫu bao gồm bản trình diễn trực tiếp. Sự cố chỉ được giảm xuống một kích thước để đơn giản. https://www.khanacademy.org/cs/cam-positioning/4772921545326592

var a = (mouse.x + camera.x)/zoom; 

// now increase the zoom e.g.: like that: 
zoom = zoom + 1; 

var newPosition = a * zoom - mouse.x; 

camera.setX(newPosition); 
screen.setWidth(originalWidth * zoom); 

Đối với một ví dụ 2D bạn chỉ có thể thêm mã tương tự cho chiều cao và vị trí y.