Evaluation Restaurants Paris

by Marc Malignan

HTML

<div id="map"></div>

CSS

html, body { 
  height: 100%;
  margin: 0;
}
#map {
  height: 100%;
}

JavaScript

$.getScript('https://maps.googleapis.com/maps/api/js?key=AIzaSyAd1xMYT1bt99qtFWQEzXiRBvORDWHgPtk&callback=initMap');

/* ---------- INIT MAP ---------- */
var map;
function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: 48.86, lng: 2.335},
    zoom: 12
  });
}

/* ---------- GET DATA ---------- */
function getData() {
  $.get('https://dl.dropboxusercontent.com/u/80418372/inspections-restaurants.json', function(data) {
    data = JSON.parse(data);
    for(var i=0, ie=data.length; i<ie; i++) {
    	var r = data[i];
      if(r.fields.libelle_commune !== 'AVIGNON') {
      	setMarker(r);
      }
    }
  });
}

/* ---------- SET MARKER ---------- */
function setMarker(r) {
	var pos = new google.maps.LatLng({
    lat: r.geometry.coordinates[1], 
    lng: r.geometry.coordinates[0]
  });
  
  var eval, icon;
 	switch(r.fields.evaluation) {
  	case '10': 
      eval = '<b class="a">Good</b>'; 
      icon = 'http://maps.google.com/mapfiles/ms/icons/green-dot.png';
      break;
    case '20': 
      eval = '<b class="b">Acceptable</b>'; 
      icon = 'http://maps.google.com/mapfiles/ms/icons/yellow-dot.png';
      break;
    case '30': 
      eval = '<b class="c">To improve</b>'; 
      icon = 'http://maps.google.com/mapfiles/ms/icons/red-dot.png';
      break;
  }
  
  var html = 
  	'<style>.a{color:green}.b{color:orange}.c{color:red}</style>'+
  	'<h2>'+r.fields.nom+'</h2>'+
    '<h3>'+r.fields.adresse+', '+r.fields.libelle_commune+'</h3>'+
    '<p>Hygiene level : '+eval+'</p>';

  var info = new google.maps.InfoWindow({
    content: html
  });

  var marker = new google.maps.Marker({
    position: pos,
    title: r.fields.nom,
    icon: icon
  });
  marker.addListener('click', function() {
    info.open(map, marker);
  });
  marker.setMap(map);
}

/* ---------- DOM READY ---------- */
$(document).ready(function() {
	getData();
});