Question

我想在googlemap上制作一个“car.png”符号，但我不能。这是我的代码

var line;

function initialize() {
var mapOptions = {
center: new google.maps.LatLng(20.291, 153.027),
zoom: 6,
mapTypeId: google.maps.MapTypeId.TERRAIN
};

var map = new google.maps.Map(document.getElementById('map-canvas'),
  mapOptions);

var lineCoordinates = [
new google.maps.LatLng(22.291, 153.027),
new google.maps.LatLng(18.291, 153.027)
];

// Define the symbol, using one of the predefined paths ('CIRCLE')
// supplied by the Google Maps JavaScript API.
var lineSymbol = {
path: 'images/car.png',
scale: 8,
strokeColor: '#393'
};
line = new google.maps.Polyline({
path: lineCoordinates,
icons: [{
  icon: lineSymbol,
  offset: '100%'
}],
map: map
 });

animateCircle();
}

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

  var icons = line.get('icons');
  icons[0].offset = (count / 2) + '%';
  line.set('icons', icons);
 }, 20);
}

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

我应该改变什么工作？我希望汽车符号移动，地图中心随之改变，每次都显示符号。

Answer 1

您使用的代码需要SVG symbol，您正在使用图片（car.png）

// Define the symbol
var lineSymbol = {
path: "M-20,0a20,20 0 1,0 40,0a20,20 0 1,0 -40,0",
fillColor: '#FF0000',
fillOpacity: .6,
anchor: new google.maps.Point(0,0),
scale: .8,
strokeColor: '#393'
};

http://jsfiddle.net/gnqcattp/1/

动画符号未显示在谷歌地图上

1 个答案: