0

这就是我所拥有的。当我取消注释 setMarkers 函数时，它根本不起作用。我有 75 个标记要添加不同的标题和位置，所以我需要一种有效的方法来做到这一点。此外，每个标记都是可点击的并播放音频文件：

<html>
<head>
<title>BIKE BOX ARCHIVE</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="http://mm1.ellieirons.com/sm2.js"></script>// javascript to play audio
<script>
var map;
var brooklyn = new google.maps.LatLng( 40.710431,-73.968432); //pos. map centers to

function initialize() {
 //



  var stylez = [
   // styling the google map

  {
    featureType: "water",
    stylers: [
      { visibility: "on" },
      { saturation: 89 },
      { hue: "#00c3ff" },
      {lightness: -50}
    ]
  },

  {
    featureType: "administrative.neighborhood",
    elementType: "labels",
    stylers: [
      { visibility: "off" }
    ]
  },

  {
    featureType: "road.highway",
    stylers: [
      { visibility: "on" },
      { hue: "#00b2ff" }
    ]
  },

    {
    featureType: "road.arterial",
    stylers: [
      { visibility: "on" },
      { hue: "#00b2ff" },
      { saturation: 62 },
      {lightness: 30}


    ]
  },

  {
    featureType: "road.local",
    stylers: [
      { visibility: "on" },
      { hue: "#00b2ff" },
      { saturation: 62 },
      {lightness: -10}


    ]
  },
    {
    featureType: "poi",
    stylers: [
     { visibility: "on" },
      { hue: "#00fff7" },
      {lightness: 50}


    ]
  },



    {
    featureType: "poi.park",
    stylers: [
     { visibility: "on" },
      { hue: "#00fff7" },
      {lightness: 0}


    ]
  },

    {
      featureType: "landscape",
      elementType: "geometry",
      stylers: [
       { visibility: "on" },
      { saturation: 59 },
      { hue: "#00cbff" }
      ]
    }
  ];



  var mapOptions = {
    zoom:14,
    center: brooklyn,
    mapTypeControlOptions: {
       mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'bestfromgoogle']
    },
    panControl: false,
    zoomControl: true,
    zoomControlOptions: {
      style: google.maps.ZoomControlStyle.SMALL
    }
     };

  map = new google.maps.Map(document.getElementById("map_canvas"),
      mapOptions);



      var bikeLayer = new google.maps.BicyclingLayer();
bikeLayer.setMap(map);// adds a layer for the bike routes

  var styledMapOptions = {
      name: "Bike Box"
  }

  var jayzMapType = new google.maps.StyledMapType(
      stylez, styledMapOptions);

  map.mapTypes.set('bestfromgoogle', jayzMapType);
  map.setMapTypeId('bestfromgoogle');




setMarkers(map, bikers);

  var bikers = [
        ['Devotion Gallery', 40.710431,-73.948432, 4],

        ];


function setMarkers(map, locations) {   
 var newimage = 'biker_click.png';
//var image = 'biker.png';

  var image = new google.maps.MarkerImage('biker.png');


for (var i = 0; i < locations.length; i++) {
         var marker = new google.maps.Marker({
            icon: image,
             position: new google.maps.LatLng(biker[i][1], biker[i][2]),
            title: biker[i][0],
            zIndex: biker[i][3]
         });

}
google.maps.event.addListener(marker[i], 'click', function() {
 marker(i).setIcon(newimage),
  sm2.play('http://mm1.ellieirons.com/wp-content/uploads/2012/03/beeps_bubbles.mp3');
});

google.maps.event.addListener(marker[i], 'mouseout', function() {
 marker1.setIcon(image)
});
*/
 google.maps.event.addListener(map, 'center_changed', function() {
          // 3 seconds after the center of the map has changed, pan back to the
          // marker.
          window.setTimeout(function() {
            map.panTo(brooklyn);
          }, 2000);
        });


}

</script>
<link href="BIKEMAP.css" rel="stylesheet" type="text/css">
<style type="text/css">
#bodyContent {
    font-size: 10px;
    font-weight: normal;
    color: #000;
}
</style>
</head>
<body onLoad="initialize()">
 <div id="map_canvas" style="width: 1000px; height: 600px;"> </div>
</body>
</html>
4

1 回答 1

0

你到处都有 JavaScript 错误。下面列出：

  • 剩下的评论片段*/（第 170 行）
  • initialize()功能未正确关闭（第 181 行）
  • bikers在第 138 行调用 setMarkers 后声明数组（在调用 setMarkers 之前移动数组）
  • setMarkers 函数，你参考biker，这应该是locations

建议您修复所有基本的 JS 错误，并在再次发布之前使用 Chrome 开发工具进行故障排除。

于 2012-06-12T00:46:25.720 回答