Triangular collisions take a lot of math, so you could either use matter.js  or take a look at polygon collisions https://stackoverflow.com/questions/2778240/detection-of-triangle-collision-in-2d-space

There is a predefined function in Khan Academy called get. You pass two arguments to it, first x, and then y, and it returns the color of that pixel on the drawing canvas (as a single number). It would probably be useful in this case.

This may help: https://www.khanacademy.org/computer-programming/handbook-of-collisions-and-interiors/5567955982876672