如何从autocomplete.getPlace()获取google place api结果

时间:2015-01-24 23:56:31

标签: javascript asp.net-mvc google-maps google-maps-api-3 google-places-api

我想将google的经度/纬度结果传递给我的MVC应用程序操作路由值。我不知道如何获取我的路线值或如何将javascript返回到html值。现在

var result = autocomplete.getPlace();

返回未定义的值。因此,即使地方的自动完成工作正常,它看起来也不像它的工作。

var input = document.getElementById('location');
var options = {
types: ['(cities)'],
componentRestrictions: { country: "us" }
};
var autocomplete = new google.maps.places.Autocomplete(input, options);
var t = 2;
var result = autocomplete.getPlace(); //result is undefined
var i = 1;
//var lat = result.geometry.location.lat;
//var lon = result.geometry.location.lon;

这是我的表单,其中包含找到位置的输入框和脚本标记。我正在尝试将lon / lat值设为路径值5,6

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

@{
    var routeValues = new RouteValueDictionary();
    routeValues.Add("Longitude", "5");
    routeValues.Add("Latitude", "6");
}

@using (Html.BeginForm("Results", "Home", routeValues, FormMethod.Post))
{
    <p>
        <input type="text" name="location" id="location" placeholder="Search For A Studio" />
    </p>
    <p>
        <input class="btn btn-primary btn-lg" value='Submit' type="submit"/>
    </p>
}

这是我在控制器中的动作

public ActionResult Results(string longitude, string latitude)
    {
        var repo = new YogaSpaceRepository();

            /// 1000 Ocean Ave
            DbGeography myLocation = DbGeography.FromText("POINT(-122.453164 37.723057)");
            IQueryable<YogaSpace> spaces = repo.AllWithinDistance(myLocation);


        return View(spaces);
    }

*更新 - 我可以获得autocomplete.getPlace()来返回数据。我必须将它放在我的提交按钮的onclick事件的javascript函数中。希望这是最好的方法! 但我似乎无法从中获取位置(经度/纬度)数据。 这是我所拥有的,但是lat / lon似乎没有我正在寻找的东西,或者我不知道如何从这两个变量中提取坐标。

var input = document.getElementById('location');
var options = {
   types: ['(cities)'],
   componentRestrictions: { country: "us" }
};
var autocomplete = new google.maps.places.Autocomplete(input, options);

function getGeometry() {
   var place = autocomplete.getPlace();

   var lat = place.geometry.location.lat;
   var lon = place.geometry.location.lon;
}

2 个答案:

答案 0 :(得分:5)

您可以通过

从geometry.location对象获取lat和lang
place.geometry.location.lat()
place.geometry.location.lng()

答案 1 :(得分:1)

我知道这是一个老问题,但对其他人应该有用。

要获取几何属性,您需要为自动完成对象设置“字段”,如下所示:

autocomplete.setFields(['address_component', 'geometry']);

获取address_component和几何体详细信息。

这对限制您获取的数据数量非常重要,并且您将通过Google API付费。

阅读:

https://developers.google.com/maps/documentation/javascript/places-autocomplete?hl=ja#get_place_information

对于getPlace()结果,这是

https://developers.google.com/maps/documentation/javascript/reference/places-service?hl=ja#PlaceResult