MarkerWithLabel

by nicolas tenorio

HTML

<script src="https://maps.google.com/maps/api/js?v=3&amp;sensor=false&amp;.js"></script>
<script src="https://cdn.rawgit.com/googlemaps/v3-utility-library/master/markerwithlabel/src/markerwithlabel.js"></script>
<div id="map-canvas"></div>

CSS

html,
body,
#map-canvas {
  height: 100%;
  margin: 0px;
  padding: 0px
}



.wifi {
  background-image: url(https://servicios.siur.com.co/buscarutas/img/invalidos.svg);
  background-repeat: no-repeat;
  width: 20px;
  height: 60px;
  margin-top:10px;
  background-position:0px 0px;
padding-top:28px;
  
}

JavaScript

var map;
var marker;
var latlng = new google.maps.LatLng(-25.282197, -57.6351);
var latlng_alt = new google.maps.LatLng(40.747688, -74.004142);

function initialize() {
  var mapOptions = {
    zoom: 14,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  map = new google.maps.Map(document.getElementById('map-canvas'),
    mapOptions);

  var busar = {
    url: "https://servicios.siur.com.co/buscarutas/img/busp.svg",
    scaledSize: new google.maps.Size(28, 26)
  };
  var trans = {
    url: "https://servicios.siur.com.co/buscarutas/img/trans.gif",
    //scaledSize: new google.maps.Size(28, 26)
  };


  var ma = new MarkerWithLabel({
    position: latlng,
    map: map,
    labelContent: "A01",
    labelAnchor: new google.maps.Point(10, 50),
    labelClass: "wifi",
  
  });
 

  ma.setIcon(busar)
  


  setInterval(function() {
    var position = (ma.getPosition() === latlng) ? latlng_alt : latlng;
    ma.setPosition(position);
    map.setCenter(position);
  }, 5 * 1000); // 10 secs


}

google.maps.event.addDomListener(window, 'load', initialize);