Как отследить нажатие мыши на рисунок в canvas?

В общем, делаю рпг игру на js, и когда решил добавить квест гивера столкнулся с проблемой взятия квеста. Чтобы взять квест нужно подойти к нему на определённое расстояние и кликнуть на него левой кнопкой мыши. Только непонятно одно: как отследить этот клик? Квест гивер отрисовывается на канвасе при помощи следующей функции:

let texture = new Image();
texture.src = this.img;
context.drawImage(texture,
         0, 0, 123, 175,
         this.spawn_x, this.spawn_y, 31, 44);

И теперь проблема заключается в том, чтобы отследить нажатие мыши на эту картинку. Иными словами: я добавил на канвас изображение при помощи метода drawImage(), и задача заключается в том, чтобы единично выполнить какую-то функцию при клике левой кнопкой мыши на добавленное изображение. Вот отрывок кода из самого проекта:

const canvas = document.getElementById('canvas');
canvas.width = 1536;
canvas.height = 704;
const context = canvas.getContext('2d');

class quest_giver {
    constructor(img, spawn_x, spawn_y) {
        this.img = img;
        this.spawn_x = spawn_x;
        this.spawn_y = spawn_y;
    }

    spawn() {
        let texture = new Image();
        texture.src = this.img;
        context.drawImage(texture,
             0, 0, 123, 175,
             this.spawn_x, this.spawn_y, 31, 44);
    }

    talk() {
        //Здесь нужно реализовать разговор с квест гивером по нажатию на его фрейм
    }
}

//Вот один из объектов, т.е. уже созданный квест гивер
let helper = new quest_giver('pictures/quest_giver.png', 100, 100);
helper.spawn(); //Спавн квест гивера, т.е. добавление его изображения на канвас