claimoar
claimoar

Reputation: 1

Tags + Clusters - Google maps (gmap3)

Good day.

I use Gmap3 jQuery plugin for Google Maps and I'm trying to get the markers to work with tags, however every time I add markers, the tags (the filtering from the example tags) do not work. Here's my code from the website I am working on (using Wordpress):

    $(function(){
    var data = [], 
        tmp = {}, 
        r, k,
        pubtypes = [],
        $dpts = $("#pubtype"),
    icons = {"Certifikované provozovny":'provozovna',"Tankovny":'tankovna'};

    $.each(villes, function(i, ville){
        data.push({
            lat: ville.lat,
            lng: ville.lng,
            tag: ville.pubtype,
            data: ville,

options: { icon: new google.maps.MarkerImage('<?php bloginfo( 'template_directory' ); ?>/gfx/pin-'+icons[ville.pubtype]+'.png')
                            }
        });
        tmp[ ville.pubtype ] = true;
    });

    for(r in tmp){
        pubtypes.push(r);
    }
    pubtypes = pubtypes.sort();

    for(k in pubtypes){
        $dpts.append('<input id="chk'+k+'" type="checkbox" checked><label for="chk'+k+'">'+pubtypes[k]+'</label><br />');
    }

    $('input', $dpts).change(function(){
        var pubtype = $('label[for='+$(this).attr('id')+']', $dpts).html(),
            checked = $(this).is(':checked'),
            map = $('#test1').gmap3('get'),
            markers;

        markers = $('#test1').gmap3({
            action:'get',
            name:'marker',
            all: true,
            tag:pubtype
        });

        $.each(markers, function(i, marker){
            marker.setMap( checked ? map : null);
        });

    });

    $('#test1').gmap3(
    { action:'init',
        options:{
          center:[49.743341,15.336227],
            zoom: 7,
            streetViewControl: false,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
      },{
        action:'addMarkers',
        radius:100,
        markers: data,
        maxZoom:13,
        radius:40,
        clusters:{
            // This style will be used for clusters with more than 0 markers
            0: {
                content: '<div class="cluster cluster-1">CLUSTER_COUNT</div>',
                width: 53,
                height: 52
            },
            // This style will be used for clusters with more than 20 markers
            20: {
                content: '<div class="cluster cluster-2">CLUSTER_COUNT</div>',
                width: 56,
                height: 55
            },
            // This style will be used for clusters with more than 50 markers
            50: {
                content: '<div class="cluster cluster-3">CLUSTER_COUNT</div>',
                width: 66,
                height: 65
            }
        },
        marker: {

            options: {
                //icon: new google.maps.MarkerImage('<?php bloginfo( 'template_directory' ); ?>/gfx/beer.png')
                //icon: new google.maps.MarkerImage('<?php bloginfo( 'template_directory' ); ?>/gfx/'+marker+'.png') 
            },            
            events:{  
                click: function(marker, event, data) { infoWindowOpen($this, marker, data) }
            }
        }
    });

});

Thank you for every small piece of help and advice.

Upvotes: 0

Views: 867

Answers (1)

sjnien
sjnien

Reputation: 1

I'm having the same problem. I don't think it's possible to combine tags and clusters (for now..) I found this on the gmap3 forum:

"No, you can't play with individual markers generated by the clustering feature" http://gmap3.net/forum/viewtopic.php?id=71

Upvotes: 0

Related Questions