Google지도에 이미지 추가

Question

Google지도가 포함 된 웹 사이트가 있습니다.지도의 특정 위치에 이미지를 고정해야합니다. 이 이미지를 프로그래밍 방식으로 맵에 추가 할 수 있습니다. 예를 들어 내 데이터베이스에 이미지 위치가 포함되어 있고 장소의 세부 정보를 추가하려는 경우. 내 데이터베이스의 모든 이미지를지도에 표시된 해당 위치에 추가해야합니다.

가능하면 Google API를 사용할 수 있습니다. 내 개발 환경은 램프입니다.

고마워, 도우미.

Answer 1

예. 그것들은 정보창이라고 불리며 마커에 붙어 있습니다. Google지도 API 참조는 매우 자세하고 코드가 포함 된 샘플로 가득합니다.

http://code.google.com/apis/maps/documentation/javascript/overlays.html#InfoWindows

귀하의 PHP 코드는 출력 (에코) 자바 스크립트는지도에 적절한 마커를 추가 할 것입니다.

Answer 2

먼저지도에 마커를 만들어야합니다. 마커는 푸시 핀으로 나타납니다 (그러나 다른 아이콘을 사용할 수 있음). 마커는 이벤트 수신기를 바인딩 할 수있는 click 이벤트를 노출합니다. 이벤트 리스너에서는 정보창을 사용하여 모든 HTML 컨텐트를 표시 할 수 있습니다. 아래 예 및 데모를 참조하십시오 :

<script type="text/javascript" src="http://maps.google.com/maps?file=api&v=2&key=YOUR--API--KEY--GOES--HERE"> 
<div id="mapContent" style="height: 400px;"></div> 
<script stye="text/javascript"> 
    // INITIALIZE MAP 
    var map = new GMap2(document.getElementById("mapContent")); 
    map.setCenter(new GLatLng(0, 0), 5); 
    map.addControl(new GLargeMapControl3D()); 
    map.addControl(new GMenuMapTypeControl()); 
    // INITIALIZE MARKER DATA 
    var markers = []; 
    // GENERATE THIS FRAGMENT VIA PHP { 
    markers.push({ 
    lat: parseFloat('1'), 
    lng: parseFloat('1'), 
    html: '<p><img src="http://farm5.static.flickr.com/4067/4337577836_71afd9a9e2_m.jpg"></p>' 
    }); 
    markers.push({ 
    lat: parseFloat('-1'), 
    lng: parseFloat('-1'), 
    html: '<p><img src="http://farm2.static.flickr.com/1039/1289471738_c8c7e329af_m.jpg"></p>' 
    }); 
    // } 
    // ADD MARKERS TO MAP 
    for (var i = 0; i < markers.length; i++) { 
    var marker = new GMarker(new GLatLng(markers[i].lat, markers[i].lng)); 
    map.addOverlay(marker); 
    GEvent.addListener(marker, "click", (function (j) { 
     return function() { 
     this.openInfoWindowHtml(markers[j].html); 
     }; 
    })(i)); 
    } 
</script> 

Demo here.

Answer 3

어쩌면 a ground overlay을 의미할까요?