0

I'm trying to implement spiderfier into my code but I'm having some difficulty converting a string address into (lat lon) coordinates.

Demo: http://jawj.github.com/OverlappingMarkerSpiderfier/demo.html

Documentation: https://github.com/jawj/OverlappingMarkerSpiderfier

this is how I get my addresses from my database which I now need to convert to (Lat, Lon) format

<?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); ?>;

Ok, so now I have my addresses in an array. The example for spiderfier generates random locations (close enough to overlap) using the following

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;

here's the code that spiderfier uses to plots the data array. This is the part I'm having trouble producing the data array it uses

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);

Assuming I have an array that I can feed into a geocode, how can I turn an address (Dallas Texas for example) into a (lat lon) format that I can use with spiderfier? Remember, there is more than one address in this array so I'll have to loop through and push each one into the data array somehow. This is mostly where I'm getting confused.

Thanks!

edit - I tried to make some code that loops through my cityArray and geocodes each one, then inserts it into an array called data, but unfortunately it didn't work

Here's the code. When I use document.write(data) nothing is displayed. I'm not getting any errors either, so I'm not sure what I'm doing wrong.

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);
            }   
        });  
}
4

1 に答える 1

1

あなたの質問は、Google マップで使用するために住所を地理座標 (緯度と経度) に変換する方法です。

住所を座標に変換するプロセスは、ジオコーディングと呼ばれます。

Google Maps API v3 には、ユーザーが住所を入力するときに使用するクライアント側のジオコーダーが含まれています。

サーバーで使用するジオコーディング Web サービスもあります。

どちらもクォータとレート制限の対象となります。

それらの使用方法の説明と、それぞれが適切な場合についての議論については、ドキュメントのこの記事を参照してください。

データベースがある場合、最も望ましいオプションは、住所をデータベースに入力するときに住所をジオコーディングし、データベースからの座標を使用してマーカーを「その場で」ジオコーディングするのではなく配置することです。

于 2012-08-13T23:12:37.227 に答える