0

Estoy realizando una pagina en html, la cuestion que no me muestra el mapa de google. Anteriormente lo hacía pero ya no. Modifiqué todo pensando si tenina un error pero igue sin mostrarlo. Notas: Uso mi API de google

Contact Us!

    <!--Form-->
    <div class="row">
        <div class="col-md-6">
            <form class="form-horizontal" method="post" action="sendEmail.php">
                <div class="form-group">
                  <label for="name"><span><i class="fa fa-user"></i></span> Enter Name</label>
                  <input id="fname" name="name" type="text" placeholder="Name" class="form-control" required>
                </div>

                <div class="form-group">
                  <label for="email"><span><i class="fas fa-at"></i></span> Enter Email</label>
                  <input id="email" name="email" type="text" placeholder="Email Address" class="form-control" required>
                </div>

                <div class="form-group">
                  <label for="subject"><span><i class="far fa-comment-alt"></i></span> Subject</label>
                  <input id="subject" name="subject" type="text" placeholder="Subject" class="form-control" required>
                </div>

                <div class="form-group">
                  <label for="message"><span><i class="fas fa-edit"></i></span> Enter Message</label>
                  <textarea class="form-control" id="message" name="message" placeholder="Enter your message for us here." rows="4" required></textarea>
                </div>

                <div class="form-check mb-1">
                    <label class="form-check-label" for="checkAgree">
                      <input type="checkbox" name="checkAgree" id="checkAgree" class="form-check-input mr-2" required>I accept terms and conditions
                    </label>
                </div>
                <button type="submit" class="btn btn-primary btn-block">Send Email</button>
            </form>
        </div>  

          <!--Google map-->
        <div class="map col-md-6">
          <div class="map" id="map"></div>
        </div>
    </div>
  </div>
</section>
2
  • Pone cual es el error que te da, pero por si las dudas fijate cuando creaste el uso de api porque cambiaron las condiciones hace unos meses: "Los cambios entrarán en vigor el próximo 11 de junio: todos los que deseen utilizar las APIs de Google Maps deberán tener una llave válida actualizada y su perfil de Google Cloud Platform con los datos bancarios."
    – Juan
    Commented el 25 oct. 2018 a las 19:13
  • Hay veces que encerrar el div o donde muestras tu mapa no permite generarlo y te saldrá en blanco la zona donde debería estar. Intenta probar dejando el mapa fuera de todo, si lo muestra es lo que dije, si no pasa, debe ser algo de código que no me percate. Commented el 25 oct. 2018 a las 22:36

1 respuesta 1

0
<script>
    function myMap() {
    var mapProp= {
        center:new google.maps.LatLng(51.508742,-0.120850),
        zoom:5,
    };
    var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);
    }
    </script>

    <script src="https://maps.googleapis.com/maps/api/js?key=TU_LLAVEAPI&callback=myMap"></script>

<div class="row">
        <div class="col-md-6">
            <form class="form-horizontal" method="post" action="sendEmail.php">
                <div class="form-group">
                  <label for="name"><span><i class="fa fa-user"></i></span> Enter Name</label>
                  <input id="fname" name="name" type="text" placeholder="Name" class="form-control" required>
                </div>

                <div class="form-group">
                  <label for="email"><span><i class="fas fa-at"></i></span> Enter Email</label>
                  <input id="email" name="email" type="text" placeholder="Email Address" class="form-control" required>
                </div>

                <div class="form-group">
                  <label for="subject"><span><i class="far fa-comment-alt"></i></span> Subject</label>
                  <input id="subject" name="subject" type="text" placeholder="Subject" class="form-control" required>
                </div>

                <div class="form-group">
                  <label for="message"><span><i class="fas fa-edit"></i></span> Enter Message</label>
                  <textarea class="form-control" id="message" name="message" placeholder="Enter your message for us here." rows="4" required></textarea>
                </div>

                <div class="form-check mb-1">
                    <label class="form-check-label" for="checkAgree">
                      <input type="checkbox" name="checkAgree" id="checkAgree" class="form-check-input mr-2" required>I accept terms and conditions
                    </label>
                </div>
                <button type="submit" class="btn btn-primary btn-block">Send Email</button>
            </form>
        </div>  

          <!--Google map-->
        <div class="map col-md-6">
          <div id="googleMap" style="width:100%;height:400px;"></div>
        </div>
    </div>
  </div>
</section>

Prueba con lo siguiente, checa bien que tu script si lo estes llamando de la manera correcta en tu div.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.