Skip to content

Instantly share code, notes, and snippets.

@JeanAbbiateci

JeanAbbiateci/carte

Created October 15, 2013 07:23
Show Gist options
  • Save JeanAbbiateci/6987796 to your computer and use it in GitHub Desktop.
Save JeanAbbiateci/6987796 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
carte
<!DOCTYPE html>
<html>
<head>
<style>
#map-canvas {
width:650px;
height:700px;
}
#legend {
background: #FFF;
padding: 10px;
z-index:10000000000000000;
margin: 5px;
margin-bottom!0px;
font-size: 10px;
font-family: Arial, sans-serif;
}
hr {
border-top: 0.8px dashed #666;
}
.color {
border: 1px solid;
height: 12px;
width: 12px;
z-index:10000000000000000;
margin-right: 3px;
float: left;
}
.red {
background: #C00;
}
.yellow {
background: #FF3;
}
.green {
background: #6F0;
}
.blue {
background: #06C;
}
.purple {
background: #63C;
}
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">
var map;
var layerl0;
var styles = [{
stylers: [{
saturation: -100
}, {
lightness: 10
}]
}, {
featureType: "administrative.locality",
elementType: "all",
stylers: [{
visibility: "on"
}]
}, {
featureType: "poi",
elementType: "all",
stylers: [{
visibility: "off"
}]
}, {
featureType: "transit",
elementType: "labels",
stylers: [{
visibility: "off"
}
]
}, {
featureType: "transit.station.bus",
stylers: [{
visibility: "off"
}
]
},
{
featureType: "water",
elementType: "all",
stylers: [{
lightness: -15
}]
}
];
function initialize() {
map = new google.maps.Map(document.getElementById('map-canvas'), {
center: new google.maps.LatLng(46.65329327389552, 1.832841499999995),
zoom: 6,
styles: styles,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
layerl0 = new google.maps.FusionTablesLayer({
query: {
select: "col0",
from: "1IYSXPgLB358R9Ss8fkIXd87_r8JH5Kn76bDbR74"
},
map: map,
styleId: 2,
templateId: 2
});
// Create the legend and display on the map
var legend = document.createElement('div');
legend.id = 'legend';
var content = [];
content.push('<h3><big>LÉGENDE</big></h3><hr>');
content.push('<img src="http://maps.google.com/mapfiles/ms/micons/green-dot.png" /> <big>2013<br /><hr>');
content.push('<img src="http://maps.google.com/mapfiles/ms/micons/red-dot.png" /> 2014</big><br /><hr>');
content.push('<img src="http://maps.google.com/mapfiles/ms/micons/yellow-dot.png" /> <big>PAS <br>PRONONCÉ<hr>');
content.push('<p><small><b>CRÉDIT :</b> <a href="http://www.jeanabbiateci.fr" target="_blank">JEAN ABBIATECI</small></></p><hr>');
content.push('<p><small><b>SOURCE :</b></small><br><img src="http://www.lagazettedescommunes.com/wp-content/themes/gazette_v2.8/clubs/images/logo_lagazette.png" height="30"/></p>');
http: //www.lagazettedescommunes.com/wp-content/themes/gazette_v2.8/clubs/images/logo_lagazette.png
legend.innerHTML = content.join('');
legend.index = 1;
map.controls[google.maps.ControlPosition.LEFT_BOTTOM].push(legend);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment