Ошибка при использовании переменной из другого файла javascript в файле HTML - PullRequest
Новая
       61

Ошибка при использовании переменной из другого файла javascript в файле HTML

0 голосов
/ 07 августа 2020

Я не уверен, почему я продолжаю получать неопределенную ошибку при использовании переменной, определенной во внешнем javascript файле. Я хочу получить доступ к переменной адресов из файла vvv javascript. js в моем html файле. Я получаю сообщение об ошибке - Uncaught ReferenceError: address is not defined ". Не уверен, что вызывает это. Коды ниже

External Javascript file (vvv javascript. js)` 

    var addresses = [
  [
    [43.674687, -79.430955],
    [43.668560, -79.394924]
  ],
  [
    [43.682191, -79.417886],
    [43.680790, -79.417379]
  ],
  [
    [43.640381, -79.394508],
    [43.640575, -79.394586]
  ]
];

Второй файл 

  function initMap() {
    var directionsRenderer = new google.maps.DirectionsRenderer();
    var directionsService = new google.maps.DirectionsService();
    var map = new google.maps.Map(document.getElementById("map"), {
      zoom: 7,
      center: {
        lat: 41.85,
        lng: -87.65
      }
    });
    directionsRenderer.setMap(map);
    directionsRenderer.setPanel(document.getElementById("right-panel"));
    

    var onChangeHandler = function() {
      calculateAndDisplayRoute(directionsService, directionsRenderer);
    };

    document.getElementById("submit").addEventListener("click", onChangeHandler);
  }
  
// calcRoute();


  function calculateAndDisplayRoute(directionsService, directionsRenderer) {
    var start_lat = document.getElementById("origin_lat").value;
    var start_lng = document.getElementById("origin_long").value;

    var end_lat = document.getElementById("destination_lat").value;
    var end_lng = document.getElementById("destination_long").value;

    var start = new google.maps.LatLng(start_lat, start_lng); 
    var end = new google.maps.LatLng(end_lat, end_lng); 

    directionsService.route(
      {
        origin: start,
        destination: end,
        travelMode: "DRIVING"
      },
      function(response, status) {
        if (status === "OK") {
          directionsRenderer.setDirections(response);
          
          var foundPoints = [];
      for (k = 0; k < addresses.length; k++) {
        if (google.maps.geometry.poly.isLocationOnEdge(addresses[k][0], response.routes[0], 1e-3) || google.maps.geometry.poly.isLocationOnEdge(addresses[k][1], response.routes[0], 1e-3)) {
            foundPoints.push(k);
          alert("route number " + k );
        } 
      }
          
        } else {
          window.alert("Directions request failed due to " + status);
        }
 
      }
       
    );
  }

HTML Второй файл 

<!DOCTYPE html>
<html>
  <head>
    <title>Displaying Text Directions With setPanel()</title>
    <script type="text/javascript" src="vvvjavascript.js"></script>

    <script
      src="https://maps.googleapis.com/maps/api/js?key=&callback=initMap" defer></script>
    <!-- jsFiddle will insert css and js -->
  </head>
  <body>
  
    <div id="right-panel"></div>
    <div id="map"></div>
  
<button type="button" id="submit">Submit</button>
  <label for="origin_lat">Origin latitude:</label>
  <input type="text" id="origin_lat" name="origin_lat" value=" "><br>
   <label for="origin_long">Origin longitude:</label>
  <input type="text" id="origin_long" name="origin_long" value=" "><br>
  <label for="destination_lat">Destination latitude:</label>
  <input type="text" id="destination_lat" name="destination_lat" value=" "><br>
  <label for="destination_long">Destination longitude:</label>
  <input type="text" id="destination_long" name="destination_long" value=" "><br><br><br><br>


  
  </body>
</html>

Ответы [ 2 ]

0 голосов
/ 07 августа 2020

Вам нужно импортировать первый javascript файл во второй. Если у вас есть доступ к первому, проще всего экспортировать оттуда переменную: export var addresses = [... и импортировать во вторую: import { addresses } from './vvvjavascript.js'.

0 голосов
/ 07 августа 2020

Где вы включаете второй файл? Мое первое предположение заключается в том, что ваш код из второго файла выполняется до загрузки vvv javascript. js. Вот почему он не может знать переменную. Вот несколько хороших примеров, как включить Как мне включить файл JavaScript в другой JavaScript файл?

...