var mapArea = document.getElementById("map");
var isGeo = true; //端末が現在地取得に対応しているか
var map;
var lat = 35.709984, lng = 139.810703;
var markers = [];
var circle;
if(!navigator.geolocation) {
  alert("あなたの端末では、現在地の取得が出来ません。");
  isGeo = false;
}

/**
* 現在地が取得された時
*/
function successFunc(position) {
  lat = position.coords.latitude;
  lng = position.coords.longitude;
  initMap();
};

/**
* 現在地の取得に失敗した時
*/
function errorFunc() {
  alert("現在地の取得に失敗...");
}

/**
* 現在地を取得する
*/
function getLocation() {
  if(!isGeo) return;
  navigator.geolocation.getCurrentPosition(successFunc, errorFunc);
}


function updateLocation() {
  if(!isGeo) return;
  navigator.geolocation.getCurrentPosition(function(position) {
    var lat = position.coords.latitude;
    var lng = position.coords.longitude;
    console.log(lat, lng);
    circle.setMap(null);
    circle = new google.maps.Circle({
    strokeColor: '#1e90ff',
    strokeOpacity: 0.8,
    strokeWeight: 2,
    fillColor: '#1e90ff',
    fillOpacity: 0.35,
    map: map,
    center: {lat:lat, lng:lng},
    radius: 30
  });

  }, function() {
    console.log("現在地の取得に失敗...")
  });
}

/**
* データ取得
*/
function getData(url) {
  return $.ajax({
    url: url,
    type: "get"
  });
}

function grepTags(url, tags) {
  return $.ajax({
    url: url + "?tags=" + window.checkTags,
    type: "get"
  });
}

/**
* マーカー作成
*/
function makeMarker(title, position, message, good) {
  return new google.maps.Marker({
    map: map,
    title: title,
    position: position,
    message: message,
    good: good,
    animation: google.maps.Animation.DROP
  });
}

/**
* マーカーを取得する
*/
function getMarker() {
  getData("/sumari/").then(function(data) {
    for(var i = 0; i < data.length; i++) {
      console.log(data[i]);
      var name = data[i]["name"];
      var lat = data[i]["position"]["lat"];
      var lng = data[i]["position"]["lng"];
      var message = data[i]["message"];
      var good = data[i]["good"];
      markers[i] = makeMarker(name, {lat: lat,lng: lng}, message, good);
      markers[i].addListener('click', function() {
        infoWindow = new google.maps.InfoWindow({
          content: "<b>" + this.title + "</b><br><p>" + this.message + "</br><button>👍" + this.good + "</button>"
        });
        infoWindow.open(map, this);
      });
    }
  });
};

/**
* マーカーを全て削除する
*/
function removeMarkers() {
  for(var i = 0; i < markers.length; i++) {
    markers[i].setMap(null);
  }
  markers.length = 0;
}

/**
* 現在地を反映する
*/
function initMap() {
  var opts = {
    zoom: 15,
    center: new google.maps.LatLng(lat, lng),
    mapTypeControl: false,
    streetViewControl: false,
    zoomControl: false,
    gestureHandling: 'greedy'
  };
  map = new google.maps.Map(mapArea, opts);
  $.getJSON("/static/smap/mapStyles.json", function(mapStyles) {
    map.setOptions({styles:mapStyles});
  });
  circle = new google.maps.Circle({
    strokeColor: '#1e90ff',
    strokeOpacity: 0.8,
    strokeWeight: 2,
    fillColor: '#1e90ff',
    fillOpacity: 0.35,
    map: map,
    center: {lat:lat, lng:lng},
    radius: 30
  });

  setInterval(updateLocation, 3000);

  getMarker();
}

/**
* タグを全件取得
*/
function getTags() {
  getData("/tag").then(function(data) {
    var tagsArea = $("#findtags");
    for(var i = 0; i < data.length; i++) {
      console.log(data[i]);
      tagsArea.append("<input type='checkbox' name='tags' value='" + data[i] + "'>" + data[i] + "<br>");
    }
  });
}

@@ -1399,16 +1399,20 @@
 ge, good
+, id
 ) %7B%0A  re
@@ -1535,16 +1535,28 @@
 : good,%0A
+    id: id,%0A
     anim
@@ -1947,24 +1947,54 @@
 i%5D%5B%22good%22%5D;%0A
+      var id = data%5Bi%5D%5B%22id%22%5D;%0A
       marker
@@ -2051,16 +2051,20 @@
 ge, good
+, id
 );%0A     
@@ -2243,16 +2243,48 @@
 %3E%3Cbutton
+ onclick='good(%22 + this.id + %22)'
 %3E%F0%9F%91%8D%22 + th
@@ -2375,24 +2375,80 @@
 %7D%0A  %7D);%0A%7D;%0A%0A
+/**%0A* good%0A*/%0Afunction good(id) %7B%0A  console.log(id);%0A%7D%0A%0A
 /**%0A* %E3%83%9E%E3%83%BC%E3%82%AB%E3%83%BC%E3%82%92%E5%85%A8

Add good function