勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

Google map APIでマーカー(アイコン)を好きな画像に変える

   2024/04/18  Google Maps API Google

Googleマップでユーザーにマーカー画像をアップロードさせて、それをマップ表示時に出したいというケースがあった。以下にソースコードをメモ。

 

ソースコード

function makeMarker( addressArray ){
    var marker = new google.maps.Marker({
        position : new google.maps.LatLng(addressArray.x,addressArray.y), 
        map: map
        <?php if( $accocuntData['icon'] != '' && file_exists(ICON_PATH . $accocuntData['icon']) ){?>,icon: '<?=ICON_URL . $accocuntData["icon"]?>'<?php } ?>//ここでアイコン指定
    });
    var addressArray;

    var infoWindow = new google.maps.InfoWindow();
    google.maps.event.addListener(marker, 'click', function() {
        if (currentWindow) {
            currentWindow.close();
        }
        infoWindow.setContent('<a href="detail.php?e='+addressArray.id+'&f=<?=$jsQuery?>">'+addressArray.name+'</a>');
        infoWindow.open(map,marker);
        currentWindow = infoWindow;
    });
}

 - Google Maps API Google

  関連記事

Google Maps APIでマーカーが全て表示されるように自動ズームする方法

Google Maps APIでマーカーを複数設置した場合にズームの値や、マーカ ...

GoogleMapAPIでジオコーディングできない場合の対応方法

住所から経度緯度を取得するジオコーディングをGoogleMapAPIを用いて行お ...

androidでgeolocationを使うとtimeoutになる

Geolocation APIを用いて現在地をGoogleMapに表示させるとい ...

Google Maps APIで都道府県の中心地と県庁所在地にマーカーを立てる方法

Google Maps APIで都道府県の中心地もしくは県庁所在地にマーカーを立 ...

Google Maps APIで半径●メートル範囲を円で表示する方法

Google Maps APIでマーカーを立てて、そこから範囲●mもしくは●km ...