2012-08-13 87 views
0

我试图将spiderfier放入我的代码中,但我在将字符串地址转换为(纬度)坐标时遇到了一些困难。转换/地理编码地址为纬度长坐标 - 谷歌地图蜘蛛

演示:http://jawj.github.com/OverlappingMarkerSpiderfier/demo.html

文档:https://github.com/jawj/OverlappingMarkerSpiderfier

这是我从我的数据库我的地址,我现在需要转换为(纬度,经度)格式

<?php 
    $locations = new locations; 
    $userid = '1'; 
    $cityArray = $locations->pastLocations($userid); 
    $title = $locations->pastTitles($userid); 
    $length = count($cityArray); 
?> 

//now that I have the cityArray acquired from php, I encode them for javascript 
<script> 
var cityArray= <?php echo json_encode($cityArray); ?>; 
var title = <?php echo json_encode($title); ?>; 

好吧,现在我有我的地址在一个数组中。为spiderfier的示例生成使用以下

var baseJitter = 2.5; 
var clusterJitterMax = 0.1; 
var rnd = Math.random; 
var data = []; 
var clusterSizes = [1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 2,2, 3, 3, 4, 5, 6, 7, 8, 9, 12, 18, 24]; 
for (var i = 0; i < clusterSizes.length; i++) { 
GClientGeocoder.getLatLng() 
var baseLon = -1 - baseJitter/2 + rnd() * baseJitter; 
var baseLat = 52 - baseJitter/2 + rnd() * baseJitter; 
var clusterJitter = clusterJitterMax * rnd(); 
for (var j = 0; j < clusterSizes[i]; j ++) data.push({ 
    lon: baseLon - clusterJitter + rnd() * clusterJitter, 
    lat: baseLat - clusterJitter + rnd() * clusterJitter, 
    h: new Date(1E12 + rnd() * 1E11).toString(), //this is the title 
    d: Math.round(rnd() * 100) + '% happy' 
}); 
} 
window.mapData = data; 

随机位置(足够接近重叠)下面是spiderfier用来绘制所述数据阵列的代码。这是我在生产它使用

var bounds = new gm.LatLngBounds(); 

    for (var i = 0; i < window.mapData.length; i ++) { 
    var datum = window.mapData[i]; 
    var loc = new gm.LatLng(datum.lat, datum.lon); 
    bounds.extend(loc); 
    var marker = new gm.Marker({ 
     position: loc, 
     title: datum.h, 
     map: map, 
     icon: iconWithColor(usualColor), 
     shadow: shadow 
    }); 
    marker.desc = datum.d; 
    oms.addMarker(marker); 
    } 
    map.fitBounds(bounds); 

假设我有一个数组,我可以馈入的地理编码数据阵列麻烦部分,我怎样才能把一个地址(德克萨斯州达拉斯例如)成(纬度)格式,我可以使用蜘蛛?请记住,该数组中有多个地址,所以我必须循环并以某种方式将每个地址推入数据数组中。这主要是我感到困惑的地方。

谢谢!

编辑 - 我试图让一些代码,通过我的cityArray循环和地址解析每一个,然后将其插入到被称为数据的数组,但遗憾的是它没有工作

下面的代码。当我使用document.write(data)时,不显示任何内容。我也没有得到任何错误,所以我不知道我做错了什么。

var data = []; 
for (var i = 0; i < cityArray.length; i++) { 
    //document.write(cityArray[i]); 
    geocoder.geocode({ 'address': cityArray[i] }, function(results, status) { //use latlang to enter city instead of coordinates 
     if (status == google.maps.GeocoderStatus.OK) { 
      data.push({ 
       position:results[0].geometry.location, 
       h: 'test', 
       d: 'test' 
      }); 
      } 
      else { 
      alert("Geocode was not successful for the following reason: " + status); 
      } 
     }); 
} 

回答

1

你的问题是如何将地址转换为地图坐标(纬度和经度)用于谷歌地图。

将地址转换为坐标的过程称为地理编码。

Google Maps API v3包含一个client side geocoder供用户输入地址时使用。

还有一个供服务器使用的geocoding web service

两者都受到配额和费率限制。

看到这个article from the documentation了解他们的使用和讨论什么时候每个可能是适当的。

如果您有数据库,最合适的选择是在数据库中输入地址时对地址进行地理编码,然后使用数据库中的坐标放置标记,而不是“即时”对它们进行地理编码。

+0

我编辑了我的帖子,以显示地理编码所做的更改。介意看看? – user1406951 2012-08-14 00:14:10

+0

document.write当在渲染页面上使用时,会覆盖现有页面,而不是调试的好方法。查看[这个问题]的答案(http://stackoverflow.com/questions/11792916/over-query-limit-in-google-maps-api-v3-how-do-i-pause-delay-in-javascript如果您拥有“即时”地理编码(如果您的标记数超过10个,它将减慢您的页面加载),至于为什么您需要使用地理编码器来获取结果地理编码调用不起作用,你可以提供一个链接或jsfiddle来展示问题吗? – geocodezip 2012-08-14 03:07:40

+0

我也看到了您编码地理编码函数的方式问题,地理编码器异步返回其结果,因此输入顺序和输出顺序可能不同,看起来像您认为它们是相同的。 – geocodezip 2012-08-14 03:08:28