Animated car.png作为PolyLine上的标记位置

时间:2014-05-21 09:17:14

标签: javascript html google-maps animation google-maps-api-3

我想在谷歌地图上为汽车制作动画。

这是用于为圆圈设置动画的JavaScript代码。 而不是这个圈我想要为汽车制作动画。 请帮忙!

 var lineSymbol = {
    path: google.maps.SymbolPath.CIRCLE,
    scale: 8,
    strokeColor: '#393'
  };

  // Create the polyline and add the symbol to it via the 'icons' property.
  line = new google.maps.Polyline({
    path: lineCoordinates,
    icons: [{
      icon: lineSymbol,
      offset: '100%'
    }],
    map: map
  });

  animateCircle();
}

1 个答案:

答案 0 :(得分:1)

使用SVG path notation创建自定义符号标记(在您的情况下为汽车图标),例如使用Adobe Illustrator或Inkscape并使用它。

Gold Star-sample from developers.google.com

  var goldStar = {
    path: 'M 125,5 155,90 245,90 175,145 200,230 125,180 50,230 75,145 5,90 95,90 z',
    fillColor: 'yellow',
    fillOpacity: 0.8,
    scale: 1,
    strokeColor: 'gold',
    strokeWeight: 14
  };

  var marker = new google.maps.Marker({
    position: map.getCenter(),
    icon: goldStar,
    map: map
  });