Since my last post, I was able to successfully put the image I selected onto the map. The controls below my canvas are still in progress. The bright colors are part of me testing where the button is located while I try to move it.
I have decided to move onto a different aspect of my project: drawing on my canvas with my finger. So far I have found this image filter library, but I’ve been having troubles figuring how to implement it so the filter is only applied to where I touch. I’ve been searching for a library that supports just simply drawing plain colors on a canvas, but all of the ones I’ve found have been outdated. My thought was to take a sketch library, like this one, save what your finger drew as a transparent image, and mask it with the original image using this image mask library. Sadly, that particular library hasn’t been updated in three years, so it is way outdated. Once I have the masked image, I wanted to see if I could just layer all the images using this layered image library. Unfortunately this layered image library isn’t quite what I was looking for, but it showed me that layering images might be possible in React Native.
Update: I’m currently looking at this svg library to see if it could work at creating the shape of what the user drew.
