Prevent a Zoomable IFrame from Scrolling Parent Page when Mouse Over

I have an embedded MC Map (Bluemap) that I have access to, embedded in my main site using an IFrame. Scrolling to zoom when mouse is over the map zooms the map, but ALSO scrolls the parent page simultaneously, which I obviously want to prevent. I have used Dynmap (another MC map plugin) from an external site which worked and only zoomed on mouse over.

Here is my Iframe:

<iframe src="https://bluemap.aternix.com/" title="Bluemap" id="bluemapframe"></iframe>

Here is my live site to demonstrate the current Bluemap Iframe: https://aternix.com/mc-server

I have tried overflow-behavior: contain and numerous JS scroll and focus targeting scripts to prevent parent document from scrolling when mouse is over the frame but neither of these have worked. I was hoping some simple CSS targeting of the Iframe or even eleme开发者_如何学运维nts within the Iframe (which I have access to as its self hosted) would do the trick but nothing has worked thus far. I currently run vanilla JS.