Raycast Hitting Error

[HasnainX]

var MouseInput = pc.createScript('mouseInput');

MouseInput.prototype.initialize = function() {
    MouseInput.Instance=this;
    var app = this.app;
    var graphicsDevice = app.graphicsDevice;
    var canvas = graphicsDevice.canvas;
    MouseInput.Instance.isMouseDown = false;
    this.camera = this.entity.findByName('Camera');

    var mouseDown = function (e) {
        MouseInput.Instance.isMouseDown = true;
        doRaycastHit(e);
        if(ButtonMainManager.Instance.EVENTTYPE=="visitorLINK")
        {   
            console.log("this is calling");
            app.mouse.enablePointerLock();

        }

    };

    var mouseUp = function (e) {
        MouseInput.Instance.isMouseDown = false;
    };

    var mouseMove = function (e) {
        if (MouseInput.Instance.isMouseDown) {
           
            var movementX = e.movementX || e.webkitMovementX || e.mozMovementX || 0;
            var movementY = e.movementY || e.webkitMovementY || e.mozMovementY || 0;

            app.fire('firstperson:look', -movementX / 5, -movementY / 5);
        }
        else if(ButtonMainManager.Instance.EVENTTYPE=="visitorLINK")
        {   
            var movementX = e.movementX || e.webkitMovementX || e.mozMovementX || 0;
            var movementY = e.movementY || e.webkitMovementY || e.mozMovementY || 0;
            app.fire('firstperson:look', -movementX / 5, -movementY / 5);
        }
    };

    var doRaycastHit=function(e){

    // var from = MouseInput.Instance.camera.camera.screenToWorld(e.x, e.y, MouseInput.Instance.camera.camera.nearClip);
    // var to = MouseInput.Instance.camera.camera.screenToWorld(e.x, e.y, MouseInput.Instance.camera.camera.farClip);

    // var result = MouseInput.Instance.app.systems.rigidbody.raycastFirst(from, to);
        var canvas = MouseInput.Instance.app.graphicsDevice.canvas;
var canvasRect = canvas.getBoundingClientRect();

// Adjust mouse coordinates based on canvas size
var mouseX = (e.clientX - canvasRect.left) / canvasRect.width;
var mouseY = (e.clientY - canvasRect.top) / canvasRect.height;

// Convert normalized mouse coordinates to screen coordinates
var screenX = mouseX * canvas.width;
var screenY = mouseY * canvas.height;

var from = MouseInput.Instance.camera.camera.screenToWorld(screenX, screenY, MouseInput.Instance.camera.camera.nearClip);
var to = MouseInput.Instance.camera.camera.screenToWorld(screenX, screenY, MouseInput.Instance.camera.camera.farClip);

var result = MouseInput.Instance.app.systems.rigidbody.raycastFirst(from, to);



    if (result && ButtonMainManager.Instance.EVENTTYPE=='uploadART') {
        console.log(result.entity._parent._parent);
        if(result.entity.name=="insideFrame")
        {
            result.entity._children[0].name
            var entityName = result.entity._children[0].name;
            var splitName = entityName.split("image"); // Split by the string "image"
            var numberPart = splitName[1]; 
            if(FirstPersonView.Instance.previousContactGallryInstance._parent.name==numberPart)
            {
                ButtonMainManager.Instance.scriptToggle("Character Controller",false);
                Animate.Instance.animatePos(Animate.Instance.animateEntites[0],new pc.Vec3(-250, 0, 0),true,true,1);
                UiManager.Instance.changeCenterScreenState(false);   
            }
        }
    }

    };
    // Manage DOM event listeners
    var addEventListeners = function () {
        window.addEventListener('mousedown', mouseDown, false);
        window.addEventListener('mouseup', mouseUp, false);
        window.addEventListener('mousemove', mouseMove, false);
    };
    var removeEventListeners = function () {
        window.removeEventListener('mousedown', mouseDown, false);
        window.removeEventListener('mouseup', mouseUp, false);
        window.removeEventListener('mousemove', mouseMove, false);
    };

    this.on('enable', addEventListeners);
    this.on('disable', removeEventListeners);

    addEventListeners();
};

Hi, I need help with my mouse control code and some function calls, like Raycast hit. When I click on a specific point on the screen, it triggers actions at a different point, giving me incorrect results.

How can I fix this? Your feedback would be greatly appreciated. Thanks

[HasnainX]

Point:

ok so I’m using the Raycast code in another script but I’m getting an error is, it gives me the result like this . Your feedback would be very helpful for me thanks

Issue:

Code:

// More information: http://developer.playcanvas.com/en/api/pc.RigidBodyComponentSystem.html
var Raycast = pc.createScript('raycast');

// initialize code called once per entity
Raycast.prototype.initialize = function() {
    // Setup the different positions to move to
        this.camera = this.entity.findByName('Camera');


    // Add a mousedown event handler
    this.app.mouse.on(pc.EVENT_MOUSEDOWN, this.mouseDown, this);
    
    // Add touch event only if touch is available
    if (this.app.touch) {
        this.app.touch.on(pc.EVENT_TOUCHSTART, this.touchStart, this);
    }
    
    this.on('destroy', function() {
        this.app.mouse.off(pc.EVENT_MOUSEDOWN, this.mouseDown, this);

        // Add touch event only if touch is available
        if (this.app.touch) {
            this.app.touch.off(pc.EVENT_TOUCHSTART, this.touchStart, this);
        }   
    }, this);
};

Raycast.prototype.mouseDown = function (e) {
    this.doRaycast(e);
};

Raycast.prototype.touchStart = function (e) {
    // Only perform the raycast if there is one finger on the screen
    if (e.touches.length == 1) {
        this.doRaycast(e.touches[0]);
    }
    e.event.preventDefault();
};

Raycast.prototype.doRaycast = function (e) {
    // The pc.Vec3 to raycast from
    var from = this.camera.getPosition();
    // The pc.Vec3 to raycast to 
    var to = this.camera.camera.screenToWorld(e.x, e.y, this.camera.camera.farClip);

    // Raycast between the two points
    var result = this.app.systems.rigidbody.raycastFirst(from, to);
    
    // If there was a hit, store the entity
    if (result) {
       console.log("reuslt is here ",result.entity.name);
    }    
      
};