Mootools + Google Maps V3 conflict issue causing google streetview not working.

[dholuamit86]

Hello there,
I have an issue in Joomla3 site, loading Google Maps V3 and mootools 1.4.5 in a same page causing google steetview not working.
Here is jsfiddle code http://jsfiddle.net/5b4hys7w/4/ In this code when you comment out mootool library javascript, google streetview working fine, you can pan, drag map using mouse. But with mootool + maps v3 you can't pan, drag the streetview.
Hope anybody can fix this bug.
Thank You.

[schaferdave]

A simpler jsFiddle shows it's still a problem w/1.6.0:
https://jsfiddle.net/johnnyruin/q94gpLj1/

Described on StackOverflow
https://stackoverflow.com/questions/57084724/mootools-breaks-google-maps-streetview-black-screen?noredirect=1#comment100701437_57084724

[sebastianbarria]

I'm having the same issue using Mootools 1.6.0 and Google Maps v3.38.

I ask the guys from Google and they reply me with this (maybe this helps to fix the problem):
Many customers in this issue tracker are talking about "es6-shim", though I believe Mootools likely has a similar root cause. It may be that Mootools uses a Symbol Polyfill, which interferes with Symbol Polyfills that Google Maps uses.

The solution for this was to include the parameters v=3.36 when calling the Google Maps library.
That works, but they're about deprecate (and delete) that version of Google Maps very soon.

[DimitarChristoff]

Don't use mootools in compatibility mode

[Add-787]

I have an issue with my project that uses google maps api, where markers are not visible on the maps screen. Our project uses moo tools v1.2.x and is there a way we can resolve the issue without updating the version as that would break quite a few dependencies we have on it.

[getupkid]

Experiencing the same issue as @Add-787. Using MooTools v1.3.1.
We also cannot update the version without breaking a lot dependencies.

[Add-787]

Hi @getupkid,
So, I found this solution while searching on the net:
https://gist.github.com/filipbech/8331336
where they implement their own custom marker instead of using the standard marker provided by google maps api. So, if you just attach your images to the div and use this custom marker inplace of the regular one. You will be able to display your images on the map.

[getupkid]

Thanks @Add-787
Can u please give me an example how you implemented this solution? Cheers.

[getupkid]

@Add-787 so, we worked out that in the old version of MooTools that we're using (1.3.1), it is actually deleting the native javascript prototype bind method.
delete Function.prototype.bind; 🤦
We noticed that in later versions of MooTools this had actually been removed, so it seems they realised it was a bad idea to keep it in there. We just removed it all together and all works fine now.

[dimov-cz]

+1000000 @getupkid
MT 1.6 with compatibility mode is also including this. So just get rid of comp-mode, or remove out "delete Function.prototype.bind;"

[CheesyTech]

Hi. Is there any reliable solution to this problem?