【发布时间】:2012-11-12 19:20:02
【问题描述】:
我花了几个小时研究这个问题,但找不到我想要的解决方案。我知道我遗漏了一些东西,但需要一点帮助。
本质上,我有一个带有记录集保存地址的经典 ASP 页面。 我想将这些地址拉到页面中(带有重复区域)。完成了这一点,并获得了 Google 期望的带有正确信息的字符串。
<script>var map_locations = [{"lat":52.954145,"lng":-4.101083,"title":"Nice House in Wales","street":"Prenteg, Porthmadog, LL49 9SR","price":"55,500"}]</script>
但是,我想用以下内容替换“lat”等:
<script>var map_locations = [{"address":"<%=(rsLocations.Fields.Item("locPostCode").Value)%>","title":"Nice house in Wales","street":"Prenteg, Porthmadog, LL49 9SR","price":"55,500"}]</script>
- 我不掌握地址的纬度/经度
- 我已经阅读了 Google 关于 GeoCoding 的 API 文档。找到了一些有用的东西,但无法弄清楚如何将我的“邮政编码”“绑定”到我的 JS 文件内的地址函数中。 (链接:https://developers.google.com/maps/documentation/javascript/geocoding)。
这是 Google 根据上面的链接建议我做的事情。 谷歌地理编码
var geocoder;
var map;
function initialize() {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(-34.397, 150.644);
var mapOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
}
function codeAddress() {
var address = document.getElementById("address").value;
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
<body onload="initialize()">
<div id="map_canvas" style="width: 320px; height: 480px;"></div>
<div>
<input id="address" type="textbox" value="Sydney, NSW">
<input type="button" value="Encode" onclick="codeAddress()">
</div>
</body>
现在,Google 的文档使用“地址”作为输入变量,因此您可以将其与以下内容一起使用:
var address = document.getElementById("address").value;
我的问题是,如何让记录集绑定成为地址? ASP 和 JS 文件不能很好地混合,并且不确定如何将其放入地址中以使地理编码正常工作。
如果我通过 Lat/Lngs 发送,我的 JS 文件 (global.js) 包含以下内容,它提供了样式精美的标记和信息框供用户交互。
处理编写 Google 地图内容的 JS 文件
var map;
function initializePropertiesMap() {
if($('#map_canvas').length == 0)
return;
var myLatlng = new google.maps.LatLng(52.954145,-4.101083);
var myOptions = {
zoom: 8,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var infowindow = new google.maps.InfoWindow();
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
$.each(map_locations, function(key, value) {
var marker = new google.maps.Marker({
position: new google.maps.LatLng(value['lat'], value['lng']),
map: map,
icon: 'css/images/marker.png',
scrollwheel: false,
streetViewControl:true,
title: value['title']
});
var link = "link";
google.maps.event.addListener( marker, 'click', function() {
// Setting the content of the InfoWindow
var content = '<div id="info" class="span5"><div class="row">' + '<div class="span2"><img src="css/images/houses/house_'+(key+1)+'.jpg" class="thumbnail" style="width:135px"/></div>' + '<div class="span3"><h3>' + value['title'] + '</h3><h6>' + value['street'] + '</h6>' + '<strong>£' + value['price'] + '</strong>' + '<p><a href="listing-detail.asp">Read More >></a></p>' + '</div></div></div>';
infowindow.setContent(content );
infowindow.open(map, marker);
});
});
}
对此进行了调整,我无法让它工作,想知道是否有人对我有任何建议?
谢谢 尼克
更新
只是想我会提到我已经尝试过这个:
var address = <%=rsLocations.Fields.Item("locPostcode").value%>;
这显然不会因为 JS 文件错误而起作用。
【问题讨论】:
-
建议:如果您有点的纬度和经度,请将其存储在数据库中并使用它来显示您的点。虽然您可以在页面加载时使用(异步)地理编码器对地址进行地理编码,但如果您有超过 10 个地址,您将遇到地理编码器配额/速率限制。这个article on geocoding strategies 可能会有所帮助。
-
正如我所说,我目前不存储 long/lats。该网站将要求用户上传他们的属性,我不想让他们给我这些参数......可以预见那里的问题,因为大多数用户无法弄清楚如何获取它们!大声笑
标签: javascript google-maps-api-3 asp-classic latitude-longitude