Hello DaniWeb Community,

I have a question about changing the symbol of my tracker.

I am using google.maps.SymbolPath.CIRCLE

Can I change this to a image of mine? jpeg / png file

If yes, How I can do it?

Thank you and God Bless


Hello Sir stultuske,

currently I'm using .FORWARD_CLOSED_ARROW as my ICON

<!DOCTYPE html>


var track;
var stepDisplay

var myCenter=new google.maps.LatLng(this is my coordinates);

function initialize()
var mapProp = {

var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);

var trackCoordinates = [
    {lat:7.0 , lng:129.0},
    {lat:8.0 , lng:123.0},
    {lat:8.5 , lng:118.0},
    {lat:7.0 , lng:109.0},


stepDisplay = new google.maps.InfoWindow();

var lineSymbol = {
    path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW,
    scale: 10,
    strokeColor: '#2162a3'

    trackPath = new google.maps.Polyline({
    path: trackCoordinates,
    icons: [{
      icon: lineSymbol,
      offset: '100%'
    strokeColor: '#FF0000',
    strokeOpacity: 1.0,


function animateCircle() {
    var count = 0;
    window.setInterval(function() {
      count = (count + 1) % 200;

      var icons = trackPath.get('icons');
      icons[0].offset = (count / 2) + '%';
      trackPath.set('icons', icons);
      radius: Math.trackPath * 200
  }, 30);

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

<div id="googleMap" style="width:1000px;height:650px;"></div>

maybe a marker will be cool, so it will be look like a active GPS.

but if it can be an image file that would be awesome.

This article has been dead for over six months. Start a new discussion instead.