function setupMapData(array){                           //input:  [float latitude, float longitude, description]
  var data = [{

    'type': "scattermapbox",
    'mode': "markers",
    'marker': {"size": 5, "color": "rgb(255,0,0)"},

  }];

  var lat = [];
  var lon = [];
  var text = [];
  //assigns keys to lists
  data['lat'] = lat;
  data['lon'] = lon;
  data['text'] = text;
  //loops throught the input array and pushes the indexed number to list
  for (var location of array){
    for (var value of location){
        if (value == location[0]){
          lat.push(value);
        } else if (value == location[1]){
            lon.push(value);
        } else {
            text.push(value);
        }
      }
    }
  //returns dictionary for function
  return data;
}


// console.log(setupMapData([[35.6763257, 139.6993177, "Meiji Shrine"],[35.7101456, 139.8105814, "Skytree"],[35.6950532, 139.7017945, "Godzilla Head"]]))


function findCenter(array){
  var lat = 0;
  var latCount = 0;
  var lon = 0;
  var lonCount = 0;

  for (var location of array){
    for (var value of location){
        if (value == location[0]){
          latCount += 1;
          lat += value;
        } else if (value == location[1]){
            lonCount += 1
            lon += value
        }
      }
    }
    return [(lat / latCount), (lon / lonCount)];
  }


  // console.log(findCenter([[35.6763257, 139.6993177, "Meiji Shrine"],[35.7101456, 139.8105814, "Skytree"],[35.6950532, 139.7017945, "Godzilla Head"]]))


  function setupMapLayout(array){
    center = findCenter(array)
    var layout = {
      "mapbox": [{
          "style": "satellite-streets",
          "zoom": 11,
          "center": center
      }]
    }
    return layout
  }


  // console.log(setupMapLayout([[35.6763257, 139.6993177, "Meiji Shrine"],[35.7101456, 139.8105814, "Skytree"],[35.6950532, 139.7017945, "Godzilla Head"]]))


  function getMapParams(jsonString){
    var array = JSON.parse(jsonString)
    input = {"data": setupMapData(array), "layout": setupMapLayout(array)}
    return input
  }


  function loadMap(){
    Plotly.setPlotConfig({ mapboxAccessToken: 'pk.eyJ1IjoibW5zaGlzaGsiLCJhIjoiY2puZHM4aXp6MHN3eTNxbzA5c202N2M4aSJ9.nn2izwz93v_Qroy0D-_ZOA' });
    var mapParams = getMapParams(JSON.stringify([[35.6763257, 139.6993177, "Meiji Shrine"],[35.7101456, 139.8105814, "Skytree"],[35.6950532, 139.7017945, "Godzilla Head"]]));
    Plotly.plot('map', mapParams.data, mapParams.layout);
  }