• ベストアンサー

初心者です jsonをhtml表示させる方法

Google+APIのhttps://www.googleapis.com/plus/v1/people/108189587050871927619/activities/public?key=yourAPIKey で投稿のjsonを取得して投稿に付いているフルサイズの画像を表示させたいのですが 3階層あるのでどのようにjsを使って表示させれば良いのか分かりません教えてください。

質問者が選んだベストアンサー

  • ベストアンサー
回答No.1

カテゴリ違いでしょうか。 ただ、うちは今このapikeyを持っていませんので、jsonを見れないので何ともいえませんが、 JSONの表示関係は、うちが既にTwitterクライアントとして組み込んでみましたので 参考にしてみてください #ただし、自動更新の所で、手抜きがはいってます。 http://sourceforge.jp/cvs/view/pyukiwiki/PyukiWiki-Devel/skin/twitter.js.src?view=log jsonの簡単な解析方法は そのjsonをダウンロードして、正規表現等を利用して , を ,+改行に置換します。 そうすると、名前:値, のような感じになりますので 名前を取得したい値としてみます。 data.JSONNAME 等のように また、これも、配列があります。 data.JSONNAME1.JSONNAME2[0] data.JSONNAME1[0].JSONNAME2.JSONNAME3 ※もともt、jquery上で動くものをpure jsに修正していますので、コメントでガチになっているところがあります。汗

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • JSON をスクレイピングするときに

    参考アドレス http://api.ce.nicovideo.jp/liveapi/v1/video.info?__format=json&v=lv262629172 http://api.ce.nicovideo.jp/liveapi/v1/video.info?__format=json&v=lv262502077 http://api.ce.nicovideo.jp/liveapi/v1/video.info?__format=json&v=lv260993313 スクレイピングでタグを取得するときに category は必須で、locked と free が両方あったり、片方無かったり、両方無かったりする場合にすべてのタグをうまく取得するにはどのようなコードを書けばよいですか。

    • ベストアンサー
    • PHP
  • JSON形式で取得できない、RSS内の要素

    Google AJAX Feed APIを用いてウェブサイトの新着情報欄に 他のブログ記事(Word Press)を読み込ませたいと思っております。 その中の、画像を取得する要素は、 <thumbnail>画像のアドレス.jpg</thumbnail>となっており、 JSON形式に変換したところ、表示されませんでした。 これは、Google AJAX Feed APIで取得できないということでしょうか? どうすれば取得できるのでしょうか。 別の参考になるjavascriptを、探すのが良いのでしょうか? プログラミングには詳しくありません。 良い案があれば、お知恵をお借りできればと思います。 どうぞ、よろしくお願いいたします。

  • Google Map APIのエラーについて

    6月20日以降にドメイン取得したサイトで、Google Mapの埋め込み表示が、添付画像のようなエラーになります。 調べてみて、 Google Map API キーが必要とありましたので、その手順でキーを取得しました。Google Mapを表示させるHTMLの<head>内の最下部に、Google Map API キーを以下のように書いてあります。 <script src="https://maps.googleapis.com/maps/api/js?key=(キー部)" type="text/javascript"></script> エラーの原因が、わかりません。 教えてください。 【関連情報】 ローカルPCでは、以下のソースできちんと表示されています。 <script type='text/javascript' src='http://maps.google.com/maps/api/js?sensor=false'></script> ・DOCTYPE 宣言文は、関係しますか? ・サイトはブロックされていません、 <meta name="ROBOTS" content="INDEX,FOLLOW">を記載。 ・1HTMLに2個の地図があります。複数のマーカーを立てています。 過去のサイトでは、エラーはありませんでした。 以上、エラ回避方法を教えてください!!!!!!

  • JSON形式のデータを表示したい

    はてなブックマークエントリー情報取得API(http://d.hatena.ne.jp/keyword/%A4%CF%A4%C6%A4%CA%A5%D6%A5%C3%A5%AF%A5%DE%A1%BC%A5%AF%A5%A8%A5%F3%A5%C8%A5%EA%A1%BC%BE%F0%CA%F3%BC%E8%C6%C0API?kid=184075) で取得したJSON形式のデータをページに表示したいのですが、どの様にすれば良いのでしょうか。 例えば http://b.hatena.ne.jp/entry/json/http://okwave.jp/ のブックマークコメントを抜き出したり、ということを想定しているのですが、可能でしょうか。 よろしくお願いします。

    • ベストアンサー
    • PHP
  • kimonoで取得したjsonファイルの出力

    kimonoで取得したjsonファイルの出力 以下のサイトを使用してスクレイピングしたjsonファイルをphpで表示させようとしたのですが、何も表示されません。助言をお願いします。 http://www.kimonolabs.com/ //jsonファイル { "name": "kokunai", "results": { "collection1": [ { "info": "【運航概況】\n本日4日および明日5日の運航状況は、以下のとおりです。" } ] } } //php記述 <?php $request = "http://www.kimonolabs.com/api/kimonoユーザID?apikey=APIキー"//URLの中身は上記jsonファイルと同一 $response = file_get_contents($request); $results = json_decode($response, TRUE); echo $results['results']['collection1'][info]; ?>

    • ベストアンサー
    • PHP
  • Googlemapb api 複数のマーカー表示に

    基礎的なことかもしれませんが、結構調べたりしても分からなかったので、教えてほしいです。 Googlemap api を使った複数のマーカー表示を$getJSON(jQuery)を使用しようして表示させたいのですが、表示できません。 どこがおかしいか教えてください。 【HTML】 1.<!DOCTYPE html> 2.<html> 3.<head> 4.<meta charset="UTF-8"> 5.<title>map</title> 6.<style type="text/css"> 7.html,body,#map { 8.height: 100%; 9.} 10.</style> 11.</head> 12.<body> 13.<div id="map"></div> 14.<script type="text/javascript" src="map.js"></script> 15.<script type="text/javascript" src="jquery-3.6.0.min.js"></script> 16.<script async defer 17.src="https://maps.googleapis.com/maps/api/js?key=【APIキー】&callback=initMap"> 18.</script> 19.</body> 20.</html> 【JavaScript】 1.var map; 2.var marker = []; 3.var data = []; 4.var center = {lat: 36.72073,lng: 137.27112}; 5.function initMap() {//地図の作成 6.map = new google.maps.Map(document.getElementById('map'), { // #mapに地図を埋め込む 7. center: center,// 地図の中心を指定 8. zoom: 15 // 地図のズームを指定 9. }); 10. $.getJSON("aaaaa.json", function(json){ 11. for (var i = 0; i <= json.length-1; i++) { 12. data.push( 13. { 14. 'name': json[i].name, 15. 'lat': json[i].lat, 16. 'lng': json[i].lng 17 }); 18 }; 19. for (var i = 0; i < data.length; i++) { 20. markerLatLng = {lat: data[i]['lat'], lng: data[i]['lng']}; 21. marker[i] = new google.maps.Marker({ //マーカーの追加 22. position: markerLatLng,//マーカーを立てる位置を指定 23. map: map//マーカーをたてる地図を指定 24. }); 25. } 26 });//jsonの閉じ 27.} 【JSON】 [ { "name": "名古屋駅", "lat": 35.170897, "lng": 136.881558 }, { "name": "大名古屋ビルヂング", "lat": 35.172311, "lng": 136.884568 }, { "name": "国際センター駅", "lat": 35.172038, "lng": 136.887701 } ]

  • google apiの使用方法

    jQueryとgoogleマップのapiを同時に使用する方法を教えていただきたいと思います。 両方を使用するとカスタマイズしたgoogleマップは表示されますが、jQueryに不具合が起きます。 同時に使用する方法はないでしょうか。 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script type='text/javascript' charset='utf-8' src='http://maps.googleapis.com/maps/api/js?&sensor=false'></script> 他に必要なことがあれば提示しますのでよろしくお願いします。

    • 締切済み
    • CSS
  • GoogleMapsAPI Key取得ができない

    HPを変更しました。 google maps を入れたいのです。 しかし、下記コメントが出てます。 このウエブサイトには 別のgoogle maps apiキーが必要です。新しいキーは http://code.google.com/apis/maps/documentation/javascript/v2/introduction.html#Obtaining_Key で作成できます。 ここを調べて見ても、apiキーが取得できません。 Google Maps APIを使うための API Key の取得が、V3では不要になりました。 と書いてありますが、現状api keyを取得しないと、使えません。 いろいろ調べたのですが、v2の取得方法は書いてありますが、現状では役に立ちません。 http://code.google.com/intl/ja/apis/maps/signup.html で登録できないから、質問しています。 具体的なやり方を教えてください。

  • C#をAPIで取得したいです

    こんにちは。 APIの取得プログラムを書くのは初めてです bootstrapを使っているAPIで スレッド型のサイトです スクロールさせると、新しい投稿が追加されるサイトで、 bootstrap-scrollspy.jsやbootstrap-dropdown.jsを使っているようです 1スレッドずつ取得したいのですが、初めの1ページだけしか取得できていません 環境は Windows 7 Pro i7 mem 24GB VS 2012 Express C# 現在はNewtonsoft.Jsonを使って試しています 回答よろしくお願いします

  • JQueryを用いたJsonとの非同期通信について

    下のソース //画面構築完了後 $(function() { //ボタンのクリックイベントで $("#btn_1").click(function(){ //data/sample.jsonのデータを取得し、jsonというオブジェクトに入れる $.getJSON("fdas.json", function(json){ var rows = ""; //テーブルとして表示するため、htmlを構築 //for (i = 0; i < json.length; i++) { rows += "<tr>"; rows += "<td>"; for (var kaey in json) { rows += (json[kaey]); } rows += "</td>"; rows += "</tr>"; //} //テーブルに作成したhtmlを追加する $("#tbl").append(rows); }); }); }); このソースに <input id="btn_1" type="button" value="データ取得" /> を使ってボタンを押しているのですが、FirefoxだとJsonのデータを更新してから押してもデータが変更されず、ChromeだとF5とかを幼くても更新されます。 ブラウザによって挙動が違うのはソースが間違っているからですか? それともJsにもHTML5やCSS3のように、対応ブラウザなどがあるのでしょうか??? また自分はまだよくわかっていないのですが、prototype.jsを用いた場合のほうが簡単だということがありましたらそちらも教えていただけると幸いです 教えてください!!!