Question

<script> 
function drawMap(){


    var balloon = new google.maps.InfoWindow();
        var mapOptions = {
            center: coords[0],
            zoom: 15,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };


        con = con.replace(/[,;]$/,'');   
        var mystring =con;
        var splits = mystring.split(",");

        type = type.replace(/[,;]$/,'');   
        var mystring1 =type;
        var splits1 = mystring1.split(",");

        var map = new google.maps.Map(document.getElementById("map_canvas"),  mapOptions);
        for(var i = 0; i < coords.length; ++i){
            var marker = new google.maps.Marker({map: map, position: coords[i], title:splits1[i]+'-'+splits[i], zIndex:i});   

              google.maps.event.addListener(marker, 'click', (function (marker, i) {
              return function () {
              var index = this.zIndex;
               balloon.setContent('<b>'+splits1[i]+'</b><br/>'+splits[i]);
                balloon.open(map, marker);
                }
              })(marker, i));

            markers.push(marker);

        }
    }
   geocodeClientSide();
    </script>

在上面的代码中，Split1 [i]输出返回为＆＃34; account＆＃34;或＆＃34;领导＆＃34; 。我想保留不同的设计图像，用于绘制帐户和主角。

目前我默认获得红色气球？

我该怎么做？

提前致谢

Answer 1

如google api中所述，在新的google.maps.Marker（）。

中

请查看此示例。这里我们使用两个图标，一个是黑色，另一个是棕色。

＆＃13;

var map;

var locations  = [{
	position: {
        lat: -25.363, 
    	lng: 131.044
    },
    icon: 'http://icons.iconarchive.com/icons/icons8/ios7/256/Maps-Location-icon.png',
}, {
	position: {
        lat: -28.363, 
    	lng: 135.044,
    },
    icon: 'http://icons.iconarchive.com/icons/graphicloads/100-flat/256/location-icon.png',
}];

function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: -34.397, lng: 150.644},
    zoom: 4,
    center: locations[0].position
  });
   
   for (var index in locations) {
       var image = new google.maps.MarkerImage(
     	locations[index]['icon'],
    	null, /* size is determined at runtime */
    	null, /* origin is 0,0 */
    	null, /* anchor is bottom center of the scaled image */
    	new google.maps.Size(20, 20));
       var marker = new google.maps.Marker({
    		position: locations[index].position,
    		map: map ,
           icon: image,
  		});
   }
}

$(document).ready(function() {
	initMap();
});

＆＃13;

#map {
    width: 300px;
    height: 300px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map"></div>

＆＃13;

在map.how上绘制两个对象地址，为两个对象设置两个不同的设计气球？

1 个答案: