8

私は自分自身を平均的な PHP コーダーだと思っていますが、自分の Web サイトに必要な JavaScript コードの一部をほとんど編集することはできません。PHP 変数に住所があり、その住所を使用して簡単な地図を Web ページに表示したいと考えています。私はインターネットでいくつかの調査を行いましたが、Google API が理解できる場所に住所を変換する多くの op ジオコーディングを見つけましたが、完全に失われました。変数を埋め込むことができる単純なコードはありませんか?

4

7 に答える 7

29

iframe を使用して、アドレスを URL パラメーターとして渡すことができます。

<iframe width="640" height="480" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.it/maps?q=<?php echo $yourAddress; ?>&output=embed"></iframe>
于 2012-08-25T16:23:37.343 に答える
3

Geocoder APIを使用する必要があります。

どうぞ（オリジナルはここにあります）：

<head>
...
<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script>
  var geocoder;
  var map;
  function initialize() {
    geocoder = new google.maps.Geocoder();

    var mapOptions = {
      zoom: 12, //Change the Zoom level to suit your needs
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    //map_canvas is just a <div> on the page with the id="map_canvas"
    map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);

    //Your Variable Containing The Address
    var address = "<?php echo $AddressVariable; ?>"; 
    geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        map.setCenter(results[0].geometry.location);
        //places a marker on every location
        var marker = new google.maps.Marker({
            map: map,
            position: results[0].geometry.location
        });
      } else {
        alert('Geocode was not successful for the following reason: ' + status);
      }
    });

  }

</script>
...
</head>

これをページの開始bodyタグに追加して、マップを初期化します。

<body onload="initialize()">

そして、これがクラスのドキュメントです。Geocoder

于 2012-08-25T21:18:09.827 に答える
0

Gmap の埋め込み

Google マップのさまざまなタイプのモード: https://developers.google.com/maps/documentation/embed/embedding-map ここ

マップ モードの選択

リクエスト URL で使用する次のマップ モードのいずれかを指定できます。

  1. place : 特定の場所または住所 (ランドマーク、お店、地理的特徴、町など) にマップ ピンを表示します。

  2. view : マーカーや方向のない地図を返します。

  3. 方向: 地図上の 2 つ以上の指定されたポイント間の経路、距離、移動時間を表示します。

  4. streetview : 指定された場所からのインタラクティブなパノラマ ビューを表示します。

  5. search : 表示可能なマップ領域全体の検索結果を表示します。

     <div id="maps"></div>

     $(document).ready(function() {   
        var key = 'xxxxxxxxxxxxxxxxxxxxxxxxxx';
        var lat = '54.320889726653014';
        var lon = '-130.30591155093268';
        var addr = '<?php echo sanitize($restaurant_details['address']); ?>';  
        var width = 350;
        var height = 350;    

        var embed= "<iframe width='"+width+"' height='"+height+"' frameborder='0' scrolling='no' marginheight='0' marginwidth='0'src='https://www.google.com/maps/embed/v1/view?key="+key+"&zoom=18&center="+lat+","+lon+"'></iframe>";

    $('#maps').html(embed);
});
于 2021-01-31T10:59:27.830 に答える
-1

これらのリンクは完全に使用されています..正確なリンクではありませんが、完全に使用されています:) tc ..

1) Google マップ iframe からアドレス バブルを削除

2)グーグルマップ

于 2013-06-11T08:04:35.930 に答える