google map

by Alex Azuero

HTML

<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="http://devcorner.researchonblogs.de/gmaps.js"></script>
<div id="map-canvas"></div>
<button type="button" class="toggle-route-btn active" role="button" name="ggt-1">ggt 1</button>

CSS

#map-canvas {
     height: 560px;
     width: 100%
 }

JavaScript

map = new GMaps({
     el: '#map-canvas',
     lat: -12.043333,
     lng: -77.028333,
     zoomControl: true,
     zoomControlOpt: {
         style: 'SMALL',
         position: 'TOP_LEFT'
     },
     panControl: false,
     streetViewControl: false,
     mapTypeControl: false,
     overviewMapControl: false
 });
 var layer = map.loadFromKML({
     url: 'https://dl.dropboxusercontent.com/u/491093/test.kml'
     preserveViewport: false //center map to route
 });
 $('.toggle-route-btn').click(function (e) {
     var sName = $(this).attr('name');
     var sLayer = layer;
     var myMap = sLayer.getMap();
     toggleLayer(sLayer, map);
 });

 function toggleLayer(layer, map) {
     layer.setMap(layer.getMap() ? null : map);
 }