通过Laravel视图传递的JSON只能通过JS脚本

时间:2018-02-13 22:22:13

标签: javascript json laravel-5 google-maps-api-3

我在从Laravel项目的js脚本访问json文件时遇到问题。

我正在使用Google maps API向地图添加标记,这些标记目前都是硬编码的,因为我似乎只能从侦听器函数中访问json。

我完全能够通过placeMarker点击监听器访问我的json,但是当我尝试制作" otherPlace"使用json值,无法找到值。不确定这里发生了什么。

对于可能的noob问题感到抱歉,但我很难过,也找不到任何类似的问题。

地图脚本示例:

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(
            "<p>" + json.locations[5].name + "<br />" + json.locations[5].address + "<br/> <a href='#'>Get Directions</a> </p>"
        );
        infowindow.open(map,placeMarker);
    }); 
}

在我的控制器中,我抓住了json文件并将其传递给视图

public function locations() {
        $path = storage_path() . "/json/locations.json"; 
        $json = json_decode(file_get_contents($path), true); 
        return view('home/locations', compact('json'));
}

在我的locations.blade.php中,我添加地图脚本并将json传递给javascript

@section('scripts')
<script src="/js/locationsMap.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key={{ env('APP_GOOGLE_MAPS') }}&callback=myMap"></script>
<script> 
    var json = {!! json_encode($json) !!};
</script>
@endsection

1 个答案:

答案 0 :(得分:1)

尝试从var移除var json如果不起作用,请将您的功能置于json = {!! json_encode($json) !!};以下,然后尝试