Question

我正在尝试创建一个Meetup优化器应用程序，到目前为止，它已经可以从我的数据库中执行GET请求并绘制一条路线。我希望按钮更改我从另一组经纬仪绘制的线条，但我无法用代码确定问题所在。

每当我按下按钮时，路线似乎都会“刷新”，但该路线与我设法显示的第一条路线相同。

请帮助!!!!!!!!!!!!

这是我的JAVASCRIPT

const xhr = new XMLHttpRequest();
const url = 'http://127.0.0.1:5000/session/123456/results';
xhr.open("GET", url);
xhr.send();
xhr.onreadystatechange = (e) => {
  result = xhr.responseText
  if (xhr.readyState == 4) {
    result = JSON.parse(result)
    var y;
    var list_of_restaurant_names = result['possible_locations']
    for (y in list_of_restaurant_names) {
      var btn = document.createElement("BUTTON");
      btn.innerHTML = String(list_of_restaurant_names[y]);
      btn.id = "location_modifier" + String(list_of_restaurant_names[y])
      document.body.appendChild(btn)
      document.getElementById("location_modifier" + String(list_of_restaurant_names[y])).addEventListener("click", function() {
       }, location_modifier(String(list_of_restaurant_names[y])), false);

  function location_modifier() { 


    path_arr = []
    Object.entries((result[String(btn.innerHTML)])).forEach(([key, value]) => {
      var path = [];
      for (var i = 0; i < value['latitude'].length; i++) {
        path.push(new google.maps.LatLng(value['latitude'][i], value['longtitude'][i]));
      }
      path_arr.push(path)
    })

    var map;

    function initialize() {
      var map = new google.maps.Map(document.getElementById("map"), {
        zoom: 12,
        center: path_arr[0][0]
      })

      mapTypeId: google.maps.MapTypeId.ROADMAP

      color = ["#FF0000", "#0000FF"]

      console.log(path_arr)

      var i = 0;
      for (x of path_arr) {
        console.log(x)
        var line = new google.maps.Polyline({
          path: x,
          strokeColor: color[i],
          strokeOpacity: 1.0,
          strokeWeight: 3,
          geodesic: true,
          map: map

        })

        i++;
      };

    };
    initialize()
  }
  }
  }}

为什么我的按钮不能更改我在地图上的输出位置？

0 个答案: