[Cerco Gratuito] Tip per implementazione Google map (show/hide markers)

otta

[Cerco Gratuito] Tip per implementazione Google map (show/hide markers)

Salve a tutti,
utilizzo il seguente plug-in all'interno di wordpress: welancers.com/jquery-map-marker-plugin
Creo i Markers dinamicamente richiamando lat, lang, ed una serie di informazioni di ciascuna scheda per ottenere una mappa con markers di diverso colore in base alla categoria.
Attualmente ho quindi una mappa con n markers di 5 colori differenti e vorrei un checkbox per mostrare all'inizio tutti i markers di tutte le categorie (come è attualmente) ma altri 5 checkbox o select per poter nascondere una categoria per volta ... Chissà se mi sono fatto capire!

Qualcuno conosce questo plug in e sa come potrei procedere?

Grazie in anticipo.

ultima

In linea teorica non è difficilissimo da realizzare anche non conoscendo il plugin.
Io quando devo creare dei markers come quel plugin mi appoggio ad un tool in .js.
Cmq, se hai un po' di dimestichezza della sintassi di wordpress ( back-end non front-end ), ti basterà entrare nel plugin e creare un paio di regole in più per aggiungerle al resto del set delle opzioni del plugin.
Ma ripeto, bisogna avere un po' di conoscenza degli hook di wordpress

otta

Salve Ultima e grazie per la risposta.
Forse ho creato un po di confusione parlando di plug in perchè in realtà si tratta di un file .js
Io ho creato i markers attraverso l'utlizzo di questo js al quale passo le variabili lat, lang, etc etc
Sarebbe da implementare il file mapmarker.jquery.js oppure il seguente codice:

//set up markers
var myMarkers = {"markers": [
{"latitude": "31.42866311735861", "longitude":"-98.61328125", "icon": "img/ house.png", "baloon_text": 'This is <strong>Texas</strong>'},
{"latitude": "35.101934057246055", "longitude":"-96.6796875", "icon": "img/ castle.png", "baloon_text": 'This is <strong>Oklahoma</strong>'},
{"latitude": "38.61687046392973", "longitude":"-98.876953125", "icon": "img/ house.png", "baloon_text": 'This is <strong>Kansas</strong>'}
]
};

//set up map options
$("#map").mapmarker({
zoom : 5,
center : 'United States',
markers : myMarkers
});

});
// ]]></script>

ultima

Ok. Cosi su due piedi ( con lo smartphone ) non so dirti. Magari domani mi leggo il codice e vediamo che ne esce.
cmq esiste un plugin js chiamato gmaps.js che ha tutto cio che cerchi. La documentazione è ottima e di facile implementazione.
Cercalo con google.
fammi sapere

otta

Ho visto, interessante ma preferirei non dover buttare tutto il lavoro che ho già fatto ed implementare il plug in che uso, mapmarker che comunque funziona molto bene per quello che dovevo fare all'inizio poi mi è saltato in mente che in effetti per non avere una mappa stracolma di markers e per poter fare una selezione dei punti di interesse sarebbe stato utile un sistema di filtri ...

ultima

Ora che ho letto meglio il codice...
Il concetto è molto semplice da realizzare.
In jQuery ( meglio se in puro javascript ), una volta creati i filtri con le select o con le checkbox, crei una nuova variabile in base alla richiesta del client recuperando latitudine e longitudine.
Un esempio banale può essere mettendo i dati nel value di un option di una select


<select class="change">
  <option value="latitudine,longitudine">Punto 1</option>
  <option value="latitudine,longitudine">Punto 2</option>
  <option value="latitudine,longitudine">Punto 3</option>
  <option value="latitudine,longitudine">Punto 4</option>
</select>

A questo punto il codice js (l'ho fatto in jQuery non avevo voglia di scrivere in javascript ; ) sarà una roba tipo questa:


// JavaScript Document
jQuery(document).ready(function($) {
    $('.change').change(function() {
        var composto = $(this).val();
        var array = composto.split(',')
        var latitude = array[0];
        var longitude = array[1];
        // creo il marker
        var myMarkers = {"markers": [
{"latitude": latitude, "longitude": longitude, "icon": "img/ house.png", "baloon_text": 'This is <strong>Texas</strong>'} ] }
        $("#map").mapmarker({
            zoom : 5,
            center : 'United States',
            markers : myMarkers
        });
    })
})

Dovrebbe funzionare.
Ovviamente con qualche if ed else del caso, puoi tranquillamente completare l'opera rimettendo tutti i punti sulla cartina

otta

Ciao Ultima,
ci ho provato ma nisba, in effetti senza vedere il codice mi rendo conto che non sia affatto semplice.
La questione è che io non voglio mostrare/nascondere punto per punto ma gruppi di markers legati ad una specifica categoria.
Comunque ora il sito è ancora in lavorazione off line, appena lo pubblico magari ti giro il link.
Per ora comunque ti ringrazio per il tuo preziosissimo aiuto.

ultima

Era ovvio, che non funzionasse, quello è un esempio sulla quale dovresti muoverti.
Se mastichi un po' di js da quello che ho fatto, implementarlo è cosa semplice. tutta via, può non essere compatibile con jQuery ed andare in conflitto. Se così fosse si può cmq risolvere con delle chiamate AJAX esterne.
Comunque, se non riesci posso vedere di darti una mano direttamente sul codice stesso

otta

Esatto, credo che si crei qualche conflitto con Jquery, comunque grazie infinite per la tua disponibilità, magari quando pubblico ti contatto nuovamente.

otta

Ciao Ultima,
ho pubblicato il sito, se hai un attimo puoi dare uno sguardo su islamujeres.it
Grazie in anticipo.