Google地图上的不同颜色标记

时间:2012-04-13 11:02:37

标签: google-maps-api-3 google-maps-markers

我正在尝试将图片与Google地图上的15个不同的团队标记相关联,我尝试这样做,但是在我的地图上无法正常工作,任何建议都将受到赞赏。我的想法是关联:if(location.nombreequipo == AST1){icon:imagen}但我​​对这个想法有很多怀疑。

function displayLocation(location){
    var content = '<strong><p>Equipo: ' +location.nombreequipo + '</strong>'
        +'</strong></p><strong><p>Hora móvil: ' + location.fecha_movil 
        + '</strong></p><strong><p>Longitud: ' +location.longitud +'</strong></p>'
        + '</strong></p><strong><p>Latitud: ' +location.latitud +'</strong></p>';
    var latLng = new google.maps.LatLng(parseFloat(location.latitud), parseFloat(location.longitud));
    var imagen ='img/blue_MarkerA.png';
    var marker = new google.maps.Marker({
        position: latLng,
        draggable: false,
        map: map,
        draggable: true,
        visible: true,
        title: location.nombreequipo
    });
    arrayMarcadores.push(marker);
    google.maps.event.addListener(marker, 'click', function(){
        infowindow.setContent(content);
        infowindow.open(map, marker);
    });
    return marker;
}

提前致谢。

2 个答案:

答案 0 :(得分:1)

您可以尝试在.imagen添加location媒体资源吗?

例如,指定location.imagen = img/blue.png,然后指定

            var marker = new google.maps.Marker({
                position: latLng,
                draggable: false,
                ...
                icon: location.imagen
            });

顺便说一句,你有两个draggable,第一个是假的,然后是真的。

答案 1 :(得分:0)

我最终采用的解决方案是:

if(location.nombreequipo=="TEAMNAME"){
    var image='img/blueMarker.png';
}
if(location.nombreequipo=="TEAMNAME2"){
    var image='img/redMarker.png';
}
function displayLocation(location){
            var content = '<strong><p>Equipo: ' +location.nombreequipo + '</strong>'
                +'</strong></p><strong><p>Hora móvil: ' + location.fecha_movil 
                + '</strong></p><strong><p>Longitud: ' +location.longitud +'</strong></p>'
                + '</strong></p><strong><p>Latitud: ' +location.latitud +'</strong></p>';
            var latLng = new google.maps.LatLng(parseFloat(location.latitud), parseFloat(location.longitud));
            var marker = new google.maps.Marker({
                position: latLng,
                map: map,
                draggable: true,
                visible: true,
                title: location.nombreequipo,
                icon: image
            });
            arrayMarcadores.push(marker);
            /*Content window asociated to created markers*/
            google.maps.event.addListener(marker, 'click', function(){
                infowindow.setContent(content);
                infowindow.open(map, marker);
            });
            return marker;
        }

感谢。