2

I recently switched from MX Google maps, to Google Maps for EE, and so far it's been pretty good. I do however just have a couple of issues that I hope I can fix up.

I have a map within a safecracker form, for users to plot a marker so I can capture location data within the entry.

I have applied some custom css to the map in order to get it to fit in with my site design, however, when the page is first loaded, the map does not show straight away, and the Geocoder form elements are un-styled. After a second or two it kicks in and looks fine.

goes from this...

map loading

until a few seconds later when it shows like this....

map shows

Now is there anything I can do to either prevent this happening, or at least mask it whilst it loads?

Secondly, if the user plots a marker, but tries to submit the form with other fields that still need filling in, the form reloads, shows the other errors, but the map fails to load.

Like this...

no map

Any ideas?

Improve this question

1 Answer 1

Reset to default
1

Unfortunately, I don't think there is anything you can do. The issue is EE is extremely inefficient at serving JavaScript. In fact, that's one of EE's weakest links is the poor JavaScript support across the board. Essentially each fieldtype loads its own JS, and it takes time to run all these requests.

Chris Imrie wrote a nice little library for RequireJS that auto-loads this stuff asynchronously. I have added support to Google Maps, but this is still somewhat experimental. Sometimes it works well for me, other times there are JS conflicts.

https://github.com/ckimrie/RequireJS-for-EE

Regarding the user submission with errors, that is new to me. Everything works fine on my end regarding that, but I will run some tests to make sure it's working locally on my end. One option would be to duplicate this error, and take a screenshot of your JavaScript error console in Chrome. If the map fails to load, it's almost always a JS error of some kind.

Improve this answer
2
  • Ok, thanks for that. It's not super essential, woudl just help make the form 100%. Wasn't sure if theres a way to maybe put a div or something over it, and have it hide after say 2 seconds? I'll take a look at the RequireJS, and try and provide some more feedback on the error console shortly.
    – shorn
    Feb 15, 2013 at 22:13
  • You can use the option "Defer loading map until user click?" in the fieldtype settings. This will make the map load a little more gracefully.
    – Justin Kimbrell
    Feb 16, 2013 at 6:21

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.