How do I make a virtual joystick move my player

I followed a tutorial on youtube because none of the asset stores joysticks worked for me. So how would I move my player with this?

public class Joystick : MonoBehaviour, IDragHandler, IPointerUpHandler, IPointerDownHandler
{

    private Image bgImg;
    private Image joystickImg;

    public Vector3 InputDirection{ set; get; }

    private void Start()
    {
        bgImg = GetComponent<Image>();
        joystickImg = transform.GetChild(0).GetComponent<Image>();
        InputDirection = Vector3.zero;
    }

    public virtual void OnDrag(PointerEventData ped)
    {

        Vector2 pos = Vector2.zero;
        if (RectTransformUtility.ScreenPointToLocalPointInRectangle(bgImg.rectTransform, ped.position, ped.pressEventCamera, out pos))
        {
            pos.x = (pos.x / bgImg.rectTransform.sizeDelta.x);
            pos.y = (pos.y / bgImg.rectTransform.sizeDelta.y);

            float x = (bgImg.rectTransform.pivot.x == 1) ? pos.x * 2 + 1 : pos.x * 2 - 1;
            float y = (bgImg.rectTransform.pivot.y == 1) ? pos.y * 2 + 1 : pos.y * 2 - 1;

            InputDirection = new Vector3(x, 0, y);
            InputDirection = (InputDirection.magnitude > 1f) ? InputDirection.normalized : InputDirection;

            joystickImg.rectTransform.anchoredPosition = new Vector3(InputDirection.x * (bgImg.rectTransform.sizeDelta.x / 2.5f), InputDirection.z * (bgImg.rectTransform.sizeDelta.y / 2.5f));

        }

    }

    public virtual void OnPointerDown(PointerEventData ped)
    {
        OnDrag(ped);
    }

    public virtual void OnPointerUp(PointerEventData ped)
    {
        InputDirection = Vector3.zero;
        joystickImg.rectTransform.anchoredPosition = Vector3.zero;
    }

}

my players current movement script

public class Moving : MonoBehaviour
{

    public static float velX, velY, velZ, gravity, jumpSpeed;

    public Joystick joystick;
    public CharacterController player;

    // Start is called before the first frame update
    void Start()
    {
        velX = velZ = 0;
        velY = -1;
        gravity = 10;
        jumpSpeed = 5;
    }

    // Update is called once per frame
    void Update()
    {       

        if (Input.GetKeyDown("a"))
        {
            velX = -4;
            //Debug.Log("Moving Left");
        }
        else if (Input.GetKeyUp("a"))
        {
            velX = 0;
        }
        if (Input.GetKeyDown("d"))
        {
            velX = 4;
            //Debug.Log("Moving Right");
        }
        else if (Input.GetKeyUp("d"))
        {
            velX = 0;
        }
        if (Input.GetKeyDown("w"))
        {
            velZ = 4;
            //Debug.Log("Moving Forward");
        }
        else if (Input.GetKeyUp("w"))
        {
            velZ = 0;
        }
        if (Input.GetKeyDown("s"))
        {
            velZ = -4;
            //Debug.Log("Moving Backward");
        }
        else if (Input.GetKeyUp("s"))
        {
            velZ = 0;
        }

        if (player.isGrounded)
        {
            velY = -gravity * Time.deltaTime;
            if (Input.GetKeyDown(KeyCode.Space))
            {
                velY = jumpSpeed;
            }
        }
        else
        {
            velY -= gravity * Time.deltaTime;
        }

        Vector3 move = new Vector3(velX, velY, velZ);
        player.Move(move * Time.deltaTime);

    }

}

It looks like the Joystick class is storing a variable “InputDirection” that has the current direction of the virtual joystick. So in your Players Update function you can use that.

something like this where virtualMovementSpeedModifier can be a number or a variable that controls how fast you move from the virtual joystick:

     Vector3 move = new Vector3(velX, velY, velZ);
     player.Move(move * Time.deltaTime); 

     Vector3 virtualMove = joystick.InputDirection * virtualMovementSpeedModifier;
     player.Move(move * Time.deltaTime);