2D Rendering / 2D Viewport To World

Back to examples View in GitHub
This example is running in WebGL2 and should work in most browsers. You can check the WebGPU examples here.

//! This example demonstrates how to use the `Camera::viewport_to_world_2d` method.

use bevy::prelude::*;

fn main() {
        .add_systems(Startup, setup)
        .add_systems(Update, draw_cursor)

fn draw_cursor(
    camera_query: Query<(&Camera, &GlobalTransform)>,
    windows: Query<&Window>,
    mut gizmos: Gizmos,
) {
    let (camera, camera_transform) = camera_query.single();

    let Some(cursor_position) = windows.single().cursor_position() else {

    // Calculate a world position based on the cursor's position.
    let Some(point) = camera.viewport_to_world_2d(camera_transform, cursor_position) else {

    gizmos.circle_2d(point, 10., Color::WHITE);

fn setup(mut commands: Commands) {