Monaca Onsen UI Discord Chat Github Repo

Problem with Google Maps

  • Onsen UI

    It looks fine in Firefox 47 and 48.0.2… and even in Internet Explorer and Microsoft Edge :sweat_smile:

    Do you have addons that modify the view or anything like that?

  • This also happens with Firefox (48.0 and 48.0.2) started in safe mode (no addons) on different Ubuntu versions and Windows VirtualBox.
    But I downloaded Firefox beta (49.0b7) and now the problem is gone!
    I didn’t explain the bug, don’t know what it was, but the good news is that I can continue to work with Onsen :-)
    Thanks for your help.

  • @Rork For what it’s worth, we are also using Onsen 2 with Google Maps and targeting both mobile and desktop browsers. The experience has been nothing short of great. It just basically works. Nearly all of the problems we have found have been self inflicted.

    The one area that didn’t work well was using the Popover object with the map. We switched to rendering Onsen React components inside a Google Maps InfoWindow and all the problems went away.

    We are also using a splitter, but haven’t seen the problems you’re describing. Wish I could be of more help.

  • @sherscher It’s good to know! Is your app already available somewhere?

  • @Rork I know @Leonardo-Augusto has an app out with Google maps and splitters. I think it was posted in the showcase

  • @Rork Beta version of it will be released this week. The product is Presto (, which is enterprise software that facilitates use of mobile devices in corporate and campus networks. We wrote (native) apps for iOS, Android and Chrome in the current shipping version and it was super painful. We are releasing a web experience for our stuff that was built using Onsen. Next step is to retool our native apps to use Cordova and the code we just built with Onsen.

    All of us here have been super pleased with how Onsen feels. We almost think it’s better than the native version of our apps! We’re believers.

  • @sherscher @munsterlander Thanks for sharing!

  • @sherscher How exactly did you correct the infowindow issue? I am experiencing the same problems, links and close button do not function properly and I am searching for a solution.

  • @jmuriel Can you post your map code and any JS related to it as well as the Onsen code wrapping the map? Also, it would best to open a new thread about it.

  • @jmuriel Our code looks something like this:

    	if ( this.state.showInfoWindow )
    		return (
    				onCloseclick={ () =>
    						showInfoWindow: false,
    						showCluster: null,
    					} );
    				<div style={styles.serviceList}>
    						onSelect={ ( service ) =>
    								showInfoWindow: false,
    								showCluster: null
    							} );
    						} }
    		return null;

    Basically, we render an Onsen list inside the InfoWindow component. We are using react-google-maps as the React wrapper for Google Maps.

    Let me know if you’re still having problems after looking at that code snippet.

    Take care,