title: JSON passed through Laravel view only accessible through listener function in JS script
body: <p>I'm having an issue accessing a json file from a js script in a Laravel project. </p>
  
  <p>I am using the Google maps API to add markers to a map, which are all currently hard-coded because I can only seem to access the json from within a listener function.</p>
  
  <p>I am fully able to access my json through the placeMarker click listener, but when i try to make the "otherPlace" using json values, the values cannot be found. Not sure what's going on here. </p>
  
  <p>Sorry for the likely noob question but I am stumped and couldn't find any similar questions.</p>
  
  <p>Map script Example:</p>
  
  <pre><code>function myMap() {
      var mapProp= {
          center:new google.maps.LatLng(44.5458062,-83.54936229999996),
          zoom:8,
      };
      var map = new google.maps.Map(document.getElementById("googleMap"),mapProp);
  
      var place = new google.maps.LatLng(44.453,-83.45773609999998);
      var placeMarker = new google.maps.Marker({position: place});
  
      var otherPlace = new google.maps.LatLng(json.locations[4].lat,json.locations[4].lng);
      var otherPlaceMarker = new google.maps.Marker({position: otherPlace});
  
      placeMarker.setMap(map);
      otherPlaceMarker.setMap(map);
  
      placeMarker.addListener('click', function() {
          map.setZoom(13);
          map.setCenter(placeMarker.getPosition());
          console.log(json.locations[5].address);
          var infowindow = new google.maps.InfoWindow({
              //content: json.locations[5].name + "\r\nAddress: " + json.locations[5].address
          });
  
          infowindow.setContent(
              "&lt;p&gt;" + json.locations[5].name + "&lt;br /&gt;" + json.locations[5].address + "&lt;br/&gt; &lt;a href='#'&gt;Get Directions&lt;/a&gt; &lt;/p&gt;"
          );
          infowindow.open(map,placeMarker);
      }); 
  }
  </code></pre>
  
  <p>In my controller I grab the json file and pass it to the view</p>
  
  <pre><code>public function locations() {
          $path = storage_path() . "/json/locations.json"; 
          $json = json_decode(file_get_contents($path), true); 
          return view('home/locations', compact('json'));
  }
  </code></pre>
  
  <p>In my locations.blade.php I add the map script and pass the json to javascript</p>
  
  <pre><code>@section('scripts')
  &lt;script src="/js/locationsMap.js"&gt;&lt;/script&gt;
  &lt;script src="https://maps.googleapis.com/maps/api/js?key={{ env('APP_GOOGLE_MAPS') }}&amp;callback=myMap"&gt;&lt;/script&gt;
  &lt;script&gt; 
      var json = {!! json_encode($json) !!};
  &lt;/script&gt;
  @endsection
  </code></pre>