React-google-maps: Blank Page google maps

Created on 16 Mar 2018  路  3Comments  路  Source: tomchentw/react-google-maps

I reaad the documentation and applied the source code in sand box

i have this code:

import React from "react";
import ReactDOM from "react-dom";
import { compose, withProps } from "recompose";
import {
  withScriptjs,
  withGoogleMap,
  GoogleMap,
  Marker
} from "react-google-maps";

const GoogleMaps = compose(
  withProps({
    /**
     * Note: create and replace your own key in the Google console.
     * https://console.developers.google.com/apis/dashboard
     * The key "AIzaSyBkNaAGLEVq0YLQMi-PYEMabFeREadYe1Q" can be ONLY used in this sandbox (no forked).
     */
    googleMapURL:
      "https://maps.googleapis.com/maps/api/js?key=AIzaSyAaB9ETxhqyx2lKpPT1VJ0iYbhbvC-Xs08&v=3.exp&libraries=geometry,drawing,places",
    loadingElement: <div style={{ height: `100%` }} />,
    containerElement: <div style={{ height: `300px` }} />,
    mapElement: <div style={{ height: `100%` }} />
  }),
  withScriptjs,
  withGoogleMap
)(props => (
  <GoogleMap defaultZoom={8} defaultCenter={{ lat: 38.736946, lng: -9.142685 }}>
    {props.isMarkerShown && (
      <Marker position={{ lat: 38.736946, lng: -9.142685 }} />
    )}
  </GoogleMap>
));

export { GoogleMaps };

and in other file the call

import { GoogleMaps } from '../../components/maps/googlemap';

<GoogleMaps isMarkerShown />

i hav eno error in console or webpack
but an empty balck page on place of gogole maps appears....

can you help me on this

many thanks
Carlos Vieira

All 3 comments

alread solved the issue

@ShintaroNippon What was the issue?

Was this page helpful?
0 / 5 - 0 ratings

Related issues

madbean picture madbean  路  3Comments

bansalvks picture bansalvks  路  3Comments

timkraut picture timkraut  路  3Comments

farhan687 picture farhan687  路  3Comments

MrSaints picture MrSaints  路  3Comments