Comment ajouter un marqueur dans la carte php

Question

Je suis très nouveau dans l'API Google Maps et je ne le comprends pas très bien. Je n'ai pas d'idée sur la façon dont je peux ajouter un marqueur. Comment puis-je ajouter un marqueur dans les coordonnées (ORDER_MODAL_COORDINATES)? Je voudrais faire ce qui suit: si mes coordonnées sont 14.62543878154436, 121.06582376249607 et correspondent à l'emplacement de ABC puis quand je clique sur le modal je voudrais avoir une carte avec le marqueur ABC à cet endroit. Alors, comment puis-je ajouter un marqueur dans ces coordonnées?

Ci-dessous vous pouvez trouver mon code actuel

<!-- Modal --> 
    <div class="modal fade" id="myCoordinatesModal" role="dialog" style="z-index: 1600;"> 
    <div class="modal-dialog"> 

    <!-- Modal content--> 
    <div class="modal-content"> 
    <form action="" method="post" class="form-horizontal"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal"><center>&times;</button> 
     <h4 class="modal-title" id="titleCoordinates"></h4> 
    </div> 
    <div class="modal-body"> 
    <?php 
$sql = "SELECT coordinates FROM order_tbl WHERE coordinates='14.62543878154436, 121.06582376249607'"; 
?> 
<div id="googleMap" style="width:100%;height:400px;"></div> 

<script> 


var mapCanvas = document.getElementById("googleMap"); 
var mapOptions = {center: cafemariajerica, zoom: 20}; 
var map = new google.maps.Map(mapCanvas, mapOptions); 

    var pt = new google.maps.LatLng(14.62543878154436, 121.06582376249607); 
       marker_customer = new google.maps.Marker({ 
          position: pt, 
          icon: 'https://i.imgur.com/W9PWfO9.png', 
          map: map 
         }); 


    function myMap() { 
    var mapProp= { 
     center: new google.maps.LatLng(14.614388, 121.061072), 
     zoom:20, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    var map=new google.maps.Map(document.getElementById("googleMap"),mapProp); 
    } 
</script> 

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

<div class="form-group"> 
<label for="order_id" class="col-sm-2 control-label" style ="width:20%;">Coordinates</label> 
<input type="text" input style ="width:75%;" class="form-control" name="ORDER_MODAL_COORDINATES" id="ORDER_MODAL_COORDINATES" placeholder="" value="" required="required" readonly> 
</div> 


</div> 
</form> 
</div> 
</div> 
</div> 

S'il vous plaît me aider les gars avec mon problème, me donner des idées ou tout ce que vous pouvez suggérer, je l'apprécie vraiment les gars. Merci!

Answer 1

je ne suis pas 100% sûr de ce que votre question est, mais je trouve cet article sur les cartes gogle docs: https://developers.google.com/maps/documentation/javascript/custom-markers

ressemble à un bon endroit pour commencer à mettre en place des marqueurs personnalisés à des emplacements personnalisés, alors je vous inquiétez à propos du modal.