Отображать номер на маркере для карт Google - PullRequest
Новая
       4

Отображать номер на маркере для карт Google

5 голосов
/ 23 февраля 2012

Все, у меня есть следующий код для отображения моих маркеров на моих картах: 

    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script  type="text/javascript">
function addLoadEvent(func) { 
var oldonload = window.onload; 
if (typeof window.onload != 'function'){ 
    window.onload = func
} else { 
    window.onload = function() {
        oldonload();
        func();
    }
}
}

var map,
    infowin=new google.maps.InfoWindow({content:'moin'});
function loadMap() 
{
  map = new google.maps.Map(
    document.getElementById('map'),
    {   
      zoom: 12,
      mapTypeId:google.maps.MapTypeId.ROADMAP,
      center:new google.maps.LatLng(<?php echo $_SESSION['pav_event_latitude']; ?>, 
                                    <?php echo $_SESSION['pav_event_longitude']; ?>)
    });

  addPoints(myStores);
}

function addPoints( points )
{  
  var bounds=new google.maps.LatLngBounds();
  for ( var p = 0; p < points.length; ++p )
  {
    var pointData = points[p];
    if ( pointData == null ) {map.fitBounds(bounds);return; }
    var point = new google.maps.LatLng( pointData.latitude, pointData.longitude );
    bounds.union(new google.maps.LatLngBounds(point));
    createMarker( point,  pointData.html );
  }
  map.fitBounds(bounds);

}

function createMarker(point,  popuphtml) 
{
  var popuphtml = "<div id=\"popup\">" + popuphtml + "<\/div>";
  var marker = new google.maps.Marker(
    {
      position:point,
      map:map
    }
  );
  google.maps.event.addListener(marker, 'click', function() {
      infowin.setContent(popuphtml)
      infowin.open(map,marker);
    });

}
function Store( lat, long, text )
{
    this.latitude = lat;
    this.longitude = long;
    this.html = text;
}

var myStores = [<?php echo $jsData;?>, null];
addLoadEvent(loadMap);
</script>

Это прекрасно работает.Однако я пытаюсь сказать, добавьте число над маркером, чтобы люди могли связать число на моем сайте с маркером в Картах Google.Как я могу создать число поверх моих маркеров (поверх реального значка, а не в информационном пузыре)?

Любая помощь будет очень признателен!Заранее спасибо!

Ответы [ 2 ]

7 голосов
/ 23 февраля 2012

РЕДАКТИРОВАТЬ : этот API устарел, и я больше не могу рекомендовать этот ответ.

Вы можете использовать Google Charts API для генерации пин-изображения.

См .: http://code.google.com/apis/chart/infographics/docs/dynamic_icons.html#pins

Он создаст и вернет изображение маркера из указанных вами параметров.Пример использования: https://chart.googleapis.com/chart?chst=d_map_pin_letter&chld=2|FF776B|000000

Чтобы внедрить его в вашу карту Google, его можно добавить в новый код маркера (): 

var number = 2; // or whatever you want to do here
var marker = new google.maps.Marker(
    {
        position:point,
        map:map,
        icon:'https://chart.googleapis.com/chart?chst=d_map_pin_letter&chld='+number+'|FF776B|000000',
        shadow:'https://chart.googleapis.com/chart?chst=d_map_pin_shadow'
    }
);
1 голос
/ 03 марта 2014

Здесь - услуга, аналогичная описанной Риком, но все еще активная, и вы можете загрузить свое собственное изображение маркера.

...