如何显示标记下的文本

Question

我在地图上显示标记时遇到了一个问题。我想在标记下方显示一些文字，但无论如何我都无法做到。这是我的示例代码中，我不知道我需要添加到其永久性地出现时标记显示

这是我的代码示例的一部分：

loop 
    htp.print('geocoder.getLatLng('); 
    htp.print(''''||r_klt.geoloc||''''||','); 
    htp.print('function(point) {'); 
    htp.print('var baseIcon = new GIcon(G_DEFAULT_ICON);'); 
    htp.print('baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png%22;'); 
    --htp.print('baseIcon.shadow = "/i/pdf.png";'); 
    htp.print('baseIcon.iconSize = new GSize(20, 34);'); 
    htp.print('baseIcon.shadowSize = new GSize(37, 34);'); 
    htp.print('baseIcon.iconAnchor = new GPoint(9, 34);'); 
    htp.print('baseIcon.infoWindowAnchor = new GPoint(9, 2);'); 
    htp.print('var letteredIcon = new GIcon(baseIcon);'); 
    l_address := r_klt.geoloc; 
    htp.print('letteredIcon.image = "http://www.google.com/mapfiles/marker'%7C%7Cchr(65+l_t)%7C%7C'.png%22;');  
    htp.print('markerOptions = { icon:letteredIcon'};'); 
    htp.print('var marker = new GMarker(point,markerOptions);'); 
    htp.print('var html = "<h1>'||r_klt.geoloc||'</h1>";'); 
    htp.print('GEvent.addListener(marker, "mouseover", function() { marker.openInfoWindowHtml(html); });'); 
    htp.print('map.addOverlay(marker);'); 
    htp.print('}'); 
    htp.print(');'); 
    l_t := l_t + 1; 
    end loop; 

Answer 1

的JavaScript代码我可以在您的示例中看到Google Maps JavaScript API的死亡版本2。版本2在2011年被弃用，并在一段时间之前完全从Google服务器中删除。您应该将代码迁移到Maps JavaScript API的当前版本3。

参考你的问题，你可以添加标签使用MarkerLabel对象标记和另外你可以使用自定义图标（Icon对象）

https://developers.google.com/maps/documentation/javascript/3.exp/reference#MarkerLabel

https://developers.google.com/maps/documentation/javascript/3.exp/reference#Icon

看一看定位标签在以下JavaScript示例中添加标签并将其放置在自定义标记下方

function initMap() { 
 
    var myLatLng = {lat: 47.363362, lng: 8.485823}; 
 

 
    var map = new google.maps.Map(document.getElementById('map'), { 
 
     zoom: 7, 
 
     center: myLatLng, 
 
     mapTypeId: google.maps.MapTypeId.SATELLITE 
 
    }); 
 

 
    var marker = new google.maps.Marker({ 
 
     position: myLatLng, 
 
     map: map, 
 
     title: 'Hello World!', 
 
     icon: { 
 
     labelOrigin: new google.maps.Point(16,64), 
 
     url: "https://drive.google.com/uc?id=0B3RD6FDNxXbdVXRhZHFnV2xaS1E" 
 
     }, 
 
     label: { 
 
     text: "Hello world!", 
 
     color: "white", 
 
     fontWeight: "bold", 
 
     fontSize: "16px" 
 
     } 
 
    }); 
 
}

/* Always set the map height explicitly to define the size of the div 
 
     * element that contains the map. */ 
 
#map { 
 
    height: 100%; 
 
} 
 
/* Optional: Makes the sample page fill the window. */ 
 
html, body { 
 
    height: 100%; 
 
    margin: 0; 
 
    padding: 0; 
 
}

<div id="map"></div> 
 
<script async defer 
 
    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDztlrk_3CnzGHo7CFvLFqE_2bUKEq1JEU&callback=initMap"> 
 
    </script>

我希望这有助于！