使用 Laravel 自动完成 Google 地图

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/38321753/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-09-14 14:07:54  来源:igfitidea点击:

Google Map Autocomplete with Laravel

javascriptjquerygoogle-mapslaravelautocomplete

提问by tisuchi

Trying to add google autocomplete in Laravel. My code is like follows-

尝试在 Laravel 中添加谷歌自动完成功能。我的代码如下-

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"></script>
<script type="text/javascript">
    google.maps.event.addDomListener(window, 'load', function () {
        var places = new google.maps.places.Autocomplete(document.getElementById('txtPlaces'));
        google.maps.event.addListener(places, 'place_changed', function () {

        });
    });
</script>
<span>Location:</span>
<input type="text" id="txtPlaces" style="width: 250px" placeholder="Enter a location" />

Its absolutely works in HTML / PHP file. The output in html/php file is like that-

它绝对适用于 HTML/PHP 文件。html/php 文件中的输出是这样的-

enter image description here

在此处输入图片说明

However, when I wanna implement in Laravel, its not working at all. It shows the following error. enter image description here

但是,当我想在Laravel 中实现时,它根本不起作用。它显示以下错误。 在此处输入图片说明

Can you help me to fixed this one?

你能帮我修一下这个吗?

回答by Dhara Parmar

You need to add key in url, the reason of this error is that you haven't configured your Google Maps API keys yet.

您需要在 url 中添加密钥,此错误的原因是您尚未配置 Google Maps API 密钥。

Refer to see - How to create key: http://docs.gravityview.co/article/306-signing-up-for-a-google-maps-api-key

请参阅 - 如何创建密钥:http: //docs.gravityview.co/article/306-signing-up-for-a-google-maps-api-key

Add key to url:

将密钥添加到网址:

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR API KEY&libraries=places"></script>

or use this url:

或使用此网址:

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places"></script>