2011-02-01 13 views
0

私は$ .getJSONを使ってtwitterのapiサンプルコードからjson配列を調べ、jqueryを使ってこれらの値をそれぞれ表示しようとしていましたか?しかし、それは事前に..私はGoogleマップでLAT &長い各つぶやきのユーザーを表示したい任意の例/ヘルプは jqueryを使用してjson配列を表示するにはどうすればよいですか?

をいただければ幸いです

おかげで何も表示波平

このJSON配列はhttp://dev.twitter.com/doc/get/geo/search

からです
{ 
    "result": { 
    "places": [ 
     { 
     "name": "Twitter HQ", 
     "country": "The United States of America", 
     "country_code": "US", 
     "attributes": { 
      "street_address": "795 Folsom St" 
     }, 
     "url": "http://api.twitter.com/1/geo/id/247f43d441defc03.json", 
     "id": "247f43d441defc03", 
     "bounding_box": { 
      "coordinates": [ 
      [ 
       [ 
       -122.400612831116, 
       37.7821120598956 
       ], 
       [ 
       -122.400612831116, 
       37.7821120598956 
       ], 
       [ 
       -122.400612831116, 
       37.7821120598956 
       ], 
       [ 
       -122.400612831116, 
       37.7821120598956 
       ] 
      ] 
      ], 
      "type": "Polygon" 
     }, 
     "contained_within": [ 
      { 
      "name": "San Francisco", 
      "country": "The United States of America", 
      "country_code": "US", 
      "attributes": { 

      }, 
      "url": "http://api.twitter.com/1/geo/id/5a110d312052166f.json", 
      "id": "5a110d312052166f", 
      "bounding_box": { 
       "coordinates": [ 
       [ 
        [ 
        -122.51368188, 
        37.70813196 
        ], 
        [ 
        -122.35845384, 
        37.70813196 
        ], 
        [ 
        -122.35845384, 
        37.83245301 
        ], 
        [ 
        -122.51368188, 
        37.83245301 
        ] 
       ] 
       ], 
       "type": "Polygon" 
      }, 
      "full_name": "San Francisco, CA", 
      "place_type": "city" 
      } 
     ], 
     "full_name": "Twitter HQ, San Francisco", 
     "place_type": "poi" 
     } 
    ] 
    }, 
    "query": { 
    "url": "http://api.twitter.com/1/geo/search.json?query=Twitter+HQ&accuracy=0&autocomplete=false&granularity=neighborhood", 
    "type": "search", 
    "params": { 
     "granularity": "neighborhood", 
     "accuracy": 0, 
     "autocomplete": false, 
     "query": "Twitter HQ" 
    } 
    } 
} 



<!---- CODE ---> 
<!DOCTYPE html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>jQuery-TwitterAPI json</title> 
<script type="text/javascript"   src="jquery.js"> 
</script> 
<script type="text/javascript"> 
$(document).ready(function() { 
    $('#letter-b a').click(function() { 
    $.getJSON('geo.json', function(data) { 
     $('#tweetstuff').empty(); 
     $.each(data.results, function(entryIndex, entry) { 
     var html = '<div class="entry">'; 
     html += 'places' + entry.places + '</br>'; 
     html += 'name' + entry.places.name + '</br>'; 
     html += 'country' + entry.places.country + '</br>'; 
     html += 'attributes' + entry.places.attributes + '</br>'; 
     html += 'url' + entry.places.url + '</br>'; 
     html += 'id' + entry.places.id + '</br>'; 
     html += 'places' + entry.places.bounding_box + '</br>'; 
     html += 'coordinates' + entry.places.coordinates + '</br>'; 
     html += '</div>'; 
     $('#dictionary').append(html); 
     }); 
    }); 
    return false; 
    }); 
}); 



</script> 
</head> 
<body> 

<h1>jQuery-Twitter API Example</h1> 

json 

     <div class="letters"> 
     <div class="letter" id="letter-a"> 
      <h3><a href="#">A</a></h3> 
     </div> 

     </div> 
     <div id="tweetstuff"> 
     </div> 

</body> 
</html> 
+0

:ここ

は、作業コードのですか?何を試しましたか? –

+0

多分 '$ .each(data.results.places、...' –

+0

私はあなたにdidntの仕事を提案したようにしました。 – user244394

答えて

3

コードには一連のエラーがあります。それは "結果"ではなく "結果"であり、配列ではなくオブジェクトであるため、data.result.placesを使用しています。これはJavaScriptエディタが役立つところです。また、あなたのページにid "dictionary"という要素がありません。そして、</br>ではなく、<br/>です。働いていなかった何

<!DOCTYPE html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>jQuery-TwitterAPI json</title> 
<script type="text/javascript" src="jquery.js"> 
</script> 
<script type="text/javascript"> 
var data = { 
    "result": { 
    "places": [ 
     { 
     "name": "Twitter HQ", 
     "country": "The United States of America", 
     "country_code": "US", 
     "attributes": { 
      "street_address": "795 Folsom St" 
     }, 
     "url": "http://api.twitter.com/1/geo/id/247f43d441defc03.json", 
     "id": "247f43d441defc03", 
     "bounding_box": { 
      "coordinates": [ 
      [ 
       [ 
       -122.400612831116, 
       37.7821120598956 
       ], 
       [ 
       -122.400612831116, 
       37.7821120598956 
       ], 
       [ 
       -122.400612831116, 
       37.7821120598956 
       ], 
       [ 
       -122.400612831116, 
       37.7821120598956 
       ] 
      ] 
      ], 
      "type": "Polygon" 
     }, 
     "contained_within": [ 
      { 
      "name": "San Francisco", 
      "country": "The United States of America", 
      "country_code": "US", 
      "attributes": { 

      }, 
      "url": "http://api.twitter.com/1/geo/id/5a110d312052166f.json", 
      "id": "5a110d312052166f", 
      "bounding_box": { 
       "coordinates": [ 
       [ 
        [ 
        -122.51368188, 
        37.70813196 
        ], 
        [ 
        -122.35845384, 
        37.70813196 
        ], 
        [ 
        -122.35845384, 
        37.83245301 
        ], 
        [ 
        -122.51368188, 
        37.83245301 
        ] 
       ] 
       ], 
       "type": "Polygon" 
      }, 
      "full_name": "San Francisco, CA", 
      "place_type": "city" 
      } 
     ], 
     "full_name": "Twitter HQ, San Francisco", 
     "place_type": "poi" 
     } 
    ] 
    }, 
    "query": { 
    "url": "http://api.twitter.com/1/geo/search.json?query=Twitter+HQ&accuracy=0&autocomplete=false&granularity=neighborhood", 
    "type": "search", 
    "params": { 
     "granularity": "neighborhood", 
     "accuracy": 0, 
     "autocomplete": false, 
     "query": "Twitter HQ" 
    } 
    } 
}; 


$(document).ready(function() { 
    $('#letterA A').click(function() { 
    //$.getJSON('geo.json', function() { 
     //$('#tweetstuff').empty(); 
     $.each(data.result.places, function(entryIndex, entry) { 
     var html = '<div class="entry">'; 
     html += 'place ' + entryIndex + '<br/>'; 
     html += 'name: ' + entry.name + '<br/>'; 
     html += 'country: ' + entry.country + '<br/>'; 
     html += 'attributes: ' + entry.attributes + '<br/>'; 
     html += 'url: ' + entry.url + '<br/>'; 
     html += 'id: ' + entry.id + '<br/>'; 
     html += 'places: ' + entry.bounding_box.coordinates + '<br/>'; 
     //html += 'coordinates' + entry.coordinates + '<br/>'; 
     html += '</div>'; 
     $('#dictionary').append($(html)); 
     }); 
    //}); 
    return false; 
    }); 
}); 



</script> 
</head> 
<body> 

<h1>jQuery-Twitter API Example</h1> 

json 

     <div class="letters"> 
     <div class="letter" id="letterA"> 
      <h3><a href="#">A</a></h3> 
     </div> 

     </div> 
     <div id="dictionary"> 
     </div> 

</body> 
</html> 
+0

ありがとう – user244394

関連する問題