jmapping

Oggi ti suggerisco un metodo davvero comodo per integrare le Google Maps in una pagina web: jMapping

jMapping è un plugin di jQuery che ti permetterà di integrare comodamente e velocemente una mappa in una pagina web, vediamo come. jMapping dipende dai plugin jQuery.metadata, MarkerManager e MapIconMaker, trovi i link a questi plugin nella home page di jMapping; scarica i plugin e includili nella tua pagina web insieme alle librerie jQuery e, ovviamente, jMapping:

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps?file=api&v=2&key=API_KEY"></script>
<script type="text/javascript" src="jquery.jmapping.js"></script>
<script type="text/javascript" src="jquery.metadata.js"></script>
<script type="text/javascript" src="mapiconmaker.js"></script>
<script type="text/javascript" src="markermanager.js"></script>

Ovviamente sostituisci il parametro API_KEY con la tua API Key. Ora posiziona i seguenti div nella tua pagina web:

<div id="map" style="width:600px;height:400px;"></div>
<div id="map-side-bar">
<div class="map-location" data="{id: 1, point: {lng: 12.49248, lat: 41.89028}, category: 'market'}">
</div></div>

A questo punto richiama jMapping specificando l’ID univoco che in questo caso è “map”:

<script type="text/javascript">
$(document).ready(function(){
  $('#map').jMapping();
});
</script>

Nella pagina usage trovi tutte le opzioni disponibili per configurare opportunamente le tue mappe 😉

NO SPAM. Non fornirò la tua email a terzi e riceverai solo contenuti che ti interessano sugli argomenti che tratto e potrai cancellarti quando vuoi con un link che trovi in tutte le email.