Home > Mobile >  Can I use custom styling for loading message on @react-google-maps/api
Can I use custom styling for loading message on @react-google-maps/api

Time:11-13

I'm using @react-google-maps/api for my app and it works well so far, however, while the map is loading there is a very ugly text that says 'Loading...' displayed instead of a map and I was wondering if I can replace it with a proper loader or at least style the text?

Screenshot

CodePudding user response:

Pass a ReactNode into the loadingElement prop.

const Loading = <div /> // change to whatever

<LoadScript
  googleMapsApiKey={googleMapsApiKey}
  ...
  loadingElement={Loading}
>...</LoadScript>

Example

  • Related