Question

我正在使用预定义的谷歌标记（圆形）。我想在此标记上放置数字但我无法这样做

我已检查此链接http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=1|FE6256|000000但它会在固定标记上显示数字。有什么方法可以将我的圆形标记传递给谷歌图表api

以下是我的标记

的代码

var markerIcon = {
    path: google.maps.SymbolPath.CIRCLE,
    fillColor: '#000',
    fillOpacity: .9,
    scale: 10,
    strokeColor: '#000',
    strokeWeight: 1
  };

 var marker = new google.maps.Marker({
        icon: markerIcon,
        position: new google.maps.LatLng(latitude,longitude),
        map: map,
    });

FIDDLE

修改

小提琴链接已更新

Answer 1

从v3.21开始（目前是'实验'版本，v = 3.exp），labelled markers are supported natively by the Google Maps Javascript API v3。

updated fiddle

代码段

 $(document).ready(function() {
   var params = {
     'lat': $('#map_canvas').data('lat'),
     'long': $('#map_canvas').data('long')
   };
   google.maps.event.addDomListener(window, 'load', initialize(params));

 });


 function initialize(coordinates) {
   var mapOptions = {
     center: new google.maps.LatLng(coordinates.lat, coordinates.long),
     zoom: 15,
     mapTypeId: google.maps.MapTypeId.ROADMAP,
   };

   var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

   var markerIcon = {
     path: google.maps.SymbolPath.CIRCLE,
     fillColor: '#000',
     fillOpacity: .9,
     scale: 10,
     strokeColor: '#000',
     strokeWeight: 1
   };


   var marker = new google.maps.Marker({
     icon: markerIcon,
     position: new google.maps.LatLng(coordinates.lat, coordinates.long),
     map: map,
     label: {
       color: 'white',
       text: '1'
     }
   });

   marker.setMap(map);
 }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas" style="width:600px;height:300px" data-lat='40.8152' data-long='-73.0455'></div>

将号码放在谷歌地图上的预定义标记形状上

1 个答案: