Question

任何人给我解决方法如何将$ location变量放到jscript上以获取Google Map上的位置。什么应该是位置的价值（位置名称或邮政编码）。 这是代码：

<?php 
$location=$_GET["clocation"]; //fetched clocation from database in previous page
?>

<div id="map" style="width:100%;height:500px"></div>
<script>
function myMap() {
var myCenter = new google.maps.LatLng(23.6943,90.3444); //Here i want to put my location value to get location on google map
  var mapCanvas = document.getElementById("map");

  var mapOptions = {center: myCenter, zoom: 7, panControl: true,
    zoomControl: true,
    mapTypeControl: true,
    scaleControl: true,
    streetViewControl: true,
    overviewMapControl: true,
    rotateControl: true };
  var map = new google.maps.Map(mapCanvas, mapOptions);
  var marker = new google.maps.Marker({position:myCenter});
  marker.setMap(map);

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

Answer 1

假设您的位置格式正确（lat，lng），
您可以在脚本中执行此操作：

<?php 
$location=$_GET["clocation"]; //fetched clocation from database in previous page
?>
…
var myCenter = new google.maps.LatLng(<?php echo $location ?>); //Here we simply echo the $location
…

编辑：我看到你用“（位置名称或邮政编码）”编辑了你的帖子。

Google Maps API提供了一种地理编码服务，可用于将您的地址转换为lat，lng格式。

以下是地理编码文档的链接：
https://developers.google.com/maps/documentation/javascript/geocoding

并且，这里回答了类似的问题：
Using Address Instead Of Longitude And Latitude With Google Maps API

Answer 2

假设clocation的值是一个城市（感谢您添加该详细信息），您需要使用GeoCoder服务将地址转换为latLng，然后您可以使用该地址添加标记在那个地方就像这样。

<?php 
    $location=isset( $_GET["clocation"] ) ? $_GET["clocation"] : 'London';
?>
<html>
  <head>
    <script>
        function myMap() {
        <?php
            echo "
            var address='$location';
            ";
        ?>


            var geocoder = new google.maps.Geocoder();
            var infoWindow = new google.maps.InfoWindow();

            var myCenter = new google.maps.LatLng( 23.6943, 90.3444 );
            var mapCanvas = document.getElementById("map");

            var mapOptions = {
                center: myCenter, 
                zoom: 7, 
                panControl: true,
                zoomControl: true,
                mapTypeControl: true,
                scaleControl: true,
                streetViewControl: true,
                overviewMapControl: true,
                rotateControl: true
            };
            var map = new google.maps.Map( mapCanvas, mapOptions );
            var marker = new google.maps.Marker( { position:myCenter } );
                marker.setMap( map );


            /* a callback function to process the response from geocoding */
            var evtcallback=function(results, status){
                if( status == google.maps.GeocoderStatus.OK ){

                    var _address=results[0].formatted_address;
                    var _location=results[0].geometry.location;
                    var _lat=_location.lat();
                    var _lng=_location.lng();

                    console.info( 'Geocoding succeeded for %s and found address %s [ %s,%s ]', address, _address, _lat, _lng );

                    latlng=new google.maps.LatLng( _lat, _lng );
                    marker.setPosition( latlng );
                    marker.setTitle( _address );

                    google.maps.event.addListener( marker, 'click', function(event){
                        infoWindow.setContent( this.title );
                        infoWindow.open( map, this );
                        infoWindow.setPosition( this.position );
                    }.bind( marker ) );

                    map.setCenter( latlng );
                    map.setZoom(15);
                } else {
                    console.info('geocoding %s failed with status %d', address, status);
                }
            }
            /* invoke the geocoder service with your location to geocode */
            geocoder.geocode({ 'address':address }, evtcallback );
        }
    </script>
    <script async defer src="//maps.google.com/maps/api/js?key=<APIKEY>&callback=myMap"></script>
    <style type="text/css">
        #map {
            width: 100%;
            height: 80vh;
            margin-top: 10px;
        }
    </style>
    </head>
<body>
    <div id="map"></div>
</body>
</html>

将php变量（地名）传递给谷歌地图（javascript）以标记位置

2 个答案: