どうやら、フリーのフォントをブラウザ上で自由に使用できるようになる、 「Google Font API」が発足したみたいです。 現在は日本語フォントが無いようだけど、出てきたら楽しくなりそうだなぁ。 あと、「Google Font API」で使用できるフォント一覧、さらに実装するソースは、 「Google Font Directory」で参照できます。
2010年5月25日火曜日
Google Font API が出たみたい
2010年1月4日月曜日
WebのAPIがマッシュアップされる「WAFL」が気になる
ワッフル/WAFL｜みんなで作るWeb API&マッシュアップ情報一覧サービスサイト というサイトがあるようです。 前から何かの縁で見付けてはいたのですが、忙しいやら課題があるやらで手を付けられず。 形式としては、「WebAPIを使って下さい」と提供する側と、 「使ってこんなウェブアプリ作りましたよ」と使えるサイトを紹介する側に分かれるようです。 中にはGoogleのAPIも含まれていますし、他の会社のAPIが多種多様に入り交じっています。 個人としては高速.jpが気になりました。 うちの車はカーナビが付いてないので、高速をどこからどこまで乗ればいいかなんて分からないですし。 しかもその情報をiPhoneで見られたらすごいいいなー、とは思います。 思いますが。 正直Webアプリ苦手なのに加え、「作ってもそんなに高速使わないし」という考えもあり、 更に、iPhoneならPCサイトが見られるので特化して作る必要もないわけですね。 代用できるサイトを見付けておけばいいわけで。 うーん、でも作りたいっていう欲望はあります。 どうせ仕事でJava使うんだし、いっそのことJavaを使って・・・かなぁ。 出来るんだろうけどなぁ。
2009年11月16日月曜日
Analytics Data Export API を使用してデータ表示
Googleの認証サーバが返答しないようですでも書いていたので、 事後報告のようなカタチになりましたが、 ひとまず最低限したいことが出来たのでまとめます。 「Analytics Data Export API」とは、Google Code Labsの一つで、 Google AnalyticsというWeb解析サービスから、 自分のサイトの解析情報を引っ張ってくることが出来ます。 「Analytics Data Export API」を利用して、 実際に作成したページはこちら。 Analytics Data Export API でデータ表示 そもそも、Analyticsを利用していない人には関係のないページです。ページを開くとこんな感じ。 まずは、Googleのアカウントへログインし、 「このページにGoogleアカウントの情報を渡しても良い」というような、 「認証」が必要になります。 そのまま「Google Analyticsへ認証する」を選択。
ログインが済んでいない場合は、ログイン画面が表示されます。 その後に、先ほどの「認証」が表示され、「アクセスを許可」します。
「認証」が終わると、元のページへ戻ります。 Analyticsから情報を取得するには、そのサイトの「テーブルID」が必要です。 色々と表示されますが、「アカウントデータ取得」をクリックし、 Analyticsに登録しているサイトの一覧を表示します。 ここでエラーが発生する場合は、Analyticsからサイト一覧が取得出来ない、 すなわちAnalyticsを利用していないアカウントです。 サイト一覧を取得出来た場合は、テーブルIDをクリックすることで、 上の欄にテーブルIDがコピーされます。
あとは、それぞれの「レポートデータ取得」をクリックすることで、 説明にあるデータを一覧で表示します。 本当は、 「Visualization API」のTableも組み合わせて表示しようと思ったのですが、 Firefoxで表示出来て、それ以外のブラウザではエラーが発生するという、 不思議な現象に陥ったので、一度ロールバックしました。 また、「Visualization API」の色々なチャートを利用すれば、 見やすく表示出来そうなので、触ってみたいですね。 ちなみに、 Data Feed Query Explorer - Google Analytics というモノが存在します。 認証した後、表示したい対象とテーブルIDを入れると、 同じようにデータを表示することが出来ます。 それじゃ、作る意味なくなっちゃうなぁ。
2009年11月12日木曜日
Googleの認証サーバが返答しないようです
※追記：2009/11/13の朝10時の時点で復活していました。 昨日から「Google Analytics Data Export API」を利用して、 サイトの解析情報を取得しようとしています。 Analytics Data Export API でデータ表示 今日の昼頃も認証を済ませてデータ表示出来ていたのですが、 ついさっき実行してみると、正常に動きませんでした。 ひとまずよく分からないので、Firefoxの「Firebug」を利用して、 接続情報を覗いて見ると、以下のようなエラーが発生していました。 「Could not sign in, invalid response from server. Please try again.」 エラー元はこの行。 「Ye[t].Ps=function(a,d,e) {if(!e||!e[Za]||...][Ja](d,""),h=a[Ja](d,"");return e==h};\n」 エラーを読む分には、どうやらサーバからの返答が無いみたいです。 さっきまでは動いていたのですから、本当にサーバ側の問題だと思いたいですね。
2009年11月10日火曜日
Google Code Labsは発展途上だったんですね
今日初めて知りました。 Googleってどこまで成長したら尽きるんだろうと思います。 Google Code Labs - Google Code というか、使用していたBloggerAPIはLabsの一員なので、 まだまだ成長する可能性を残しているってことなのかー。 って、クーポンフィードってなんなの？ デベロッパー ガイド - Google AJAX API - Google Code 「Google.load()」時のオプションが書かれていますね。 なるほど、まとめてロードも出来るみたい。 サイト ディレクトリ - Google Code ここでも一覧で見ることが出来ます。
2009年10月21日水曜日
Googleの「Table」を使ったブログ投稿一覧
※補足：文章にまとめる能力が枯渇しているため、非常に読みづらいです。 「Google Visualization API」がすごいと聞いたので、 せっかくだからと投稿一覧を表示してみることにしました。 実際に使用したのは、「Google Visualization API」のTableです。 以下を参考にしました。まずは、できあがったものですね。 ほるメモいんぶろ - 投稿一覧 ブラウザ内に文字が大量に表示されるので、 文字羅列アレルギーの方は注意して下さい。 内容としては、先日iPhone用の一覧を作成した時にまとめた、 【まずはBloggerAPIで投稿一覧表示】 【iPhone Blogger投稿一覧に更新日表示】 を、バージョンアップしたような感じになります。 忘れそうになるので、「Blogger API」から取得出来るデータをまとめます。 基本的には、Google GData APIの「google.gdata.blogger」にあるものは、 全て取得出来るはずです。 ただ、試してみた時に取得出来ないもの(カテゴリなど)もありました。 それに関しては、ただ単に僕が把握しきれていない上、 記述ミスの可能性もあるので、一概にそうとは言い切れません。 今回取得出来たデータは以下の様なものです。上の項目で取得出来る更新日時について。 iPhone用一覧を作成した時に、更新日時を日本風に書き換えましたが、 IEではうまく処理されずに、 「23:52:20/09/30(水) UTC+0900」のような不思議なカタチになります。 それは、ブラウザごとの更新日時の取得内容が異なるためです。 iPhone,Safali,Firefoxなどの、 「Tridentエンジン」を使用していないブラウザの場合は、 「Sat Oct 17 2009 22:34:27 GMT+0900」と取得し、 IEでは「Sat Oct 17 22:34:27 UTC+0900 2009」というように、 項目を取得する順番が入れ替わってしまいます。 対処は・・・どうしようかなぁ。 するなら、ブラウザ判別して処理を分けるぐらいしか思いつかないです。 取得した投稿内容について。 iPhoneのあれの時には使用していませんでしたが、 実はリファレンスをちゃんと読めば載っていたんですね。 ひとまず引っ張ってくることには成功しましたが、問題点が。 HTMLで戻ってくるのは嬉しいのですが、 <pre></pre>で囲って投稿を書いているおかげで、 各行に改行が挿入されないのです。 その結果、改行要素が含まれるタグ以外では改行されずに、 横に長々と文章が表示されるようになります。 ページ内で表示する際には、途中で折り返す処理が必須になります。 「Table」の初期ソートについて。 参考元サンプルをそのまま使うだけでは、 初期表示の際にどの列もソートされていない状態です。 初期表示の際にソートする場合には、 テーブル領域にデータを反映する際にパラメータを渡すことで行えます。
- getUpdated().getValue().getDate(); ：更新日時
- getTitle().getText(); ：投稿タイトル
- getHtmlLink().getHref(); ：投稿アドレス
- getContent().getText(); ：投稿内容
visualization.draw(data, {showRowNumber: true , sortColumn:0 , sortAscending:false , cssClassNames: { tableCell: 'myVtd', headerCell: 'myVhtd' } });これに関しては、以下のドキュメントに詳しく書かれています(英語)。 Visualization: Table - Google Visualization API - Google Code
2009年9月7日月曜日
iPhone Blogger投稿一覧に更新日表示
以前この投稿で作成した、 Blogger投稿表示一覧に更新日を付加して更新しました。 以下がそのページです。 ほるめすメモ帳inBlogger - 投稿一覧 iPhone、PCSafari、Firefoxでどうぞ。(IE6,7不可、IE8はリスト表示のみ)
更新日も記事の情報として、APIで取得できます。 var blogUpdated = post.getUpdated().getValue().getDate(); 実際には、以下のように出力されるので、少しいじる必要があります。 Sat Sep 05 2009 20:39:09 GMT+0900 上の「blogUpdated」はDate型なので、「toString()」で型変換し、 それを更に「.split(' ');」によって分割しています。 更に更に、曜日と月が英語のままではわかりづらいので、 Switch文でこつこつと日本語に入れ替えてあげ、 それを欲しい順番に連結して完成です。 <li class="group"></li> これで出来た日付を、 上のタグに入れそのまま使うと、全投稿に表示されるので、 「ループ初回or前投稿と日付が違う」場合に表示するようにしました。なお、あくまでも更新日なので、 下の記事が上の記事よりも新しい日付が出ますが、 そもそもFeedに作成日時が無いようなので、対応のしようがありません。 少し気持ち悪いですが、仕方ないです。 投稿にも、投稿された順番があるので、並べ替えずにこのままで良いです。 以下が今回のソースです。 <body>以下のソースが前回の投稿にあるので、それと照らし合わせて使用します。 ▼続きを読む/たたむ
2009年8月28日金曜日
iPhone BloggerAPI+iUIでBlogger投稿一覧表示
ひとまず表示は出来たのでメモ。 ほるめすメモ帳inBlogger - 投稿一覧 今回はiPhone、PCSafari、Firefoxで表示しました。 IE等はただリストで表示されるだけです。iPhoneで表示した場合です。 上バータイトルがすり切れているのは、ただ単に長すぎるからです。 実際の処理としては、BloggerAPIとiUIを混ぜ合わせただけなのですが、 色々と困ったことがあったのでまとめます。
document.createElementから、 必要なタグを生成して差し込もうとしましたが、 <ul>を差し込む場合、selected="true"が追加されませんでした。 objul:ulタグとすると、objul.selected="true";では処理がされなかったワケです。 原因はおそらく、ulタグにselectedが標準でない(iUI用に勝手に作成した)ためです。 仕方がないので<ul selected="true"></ul>とだけ元から作成しておき、 document.getElementsByTagName("ul").item(0)で呼び出しました。これはPCSafariで表示した図。 なぜか上バータイトルが表示されません。
これはFirefox。 下の方に表示されているのは「Firebug」と言われるデバッグツールですね。 今回JSで処理したので、実際に処理が通っているのか、 表示がきちんとされているのかをチェックするために使用しました。 投稿の一覧表示自体は出来ましたが、これを今度各投稿を表示しないといけないですね。 以前に試してみましたが、途中でエラーが発生してそのまま停止してました。 諸々起こりそうな問題としては、かなりロードに時間がかかるかもしれないこと。 当然今回と同じようにJSで投稿を「同htm内」にロードしないといけないので、 今回表示する際(iPhoneでは10秒ほど)以上に時間がかかります。 さらに僕はiPhone3Gなので、メモリを大量消費した際の他の動作も気になります。 と言うような感じで、実は思ったよりiPhoneへの負担の大きいページが完成しそうです。 以下が今回の<body>以下のソースです。 ▼続きを読む/たたむ
2009年8月15日土曜日
まずはBloggerAPIで投稿一覧表示
とりあえずは、元々のソースをほぼ全部コピーで、記事一覧を表示してみました。 ほるめすメモ帳inBlogger - 投稿一覧 レンタルサーバで大々的に広告が表示されていますが、ある程度カタチが出来たらサーバでも借りようかと思っています。 今は練習段階です。 BloggerAPIの使い方は、前のメモにあるリンクに書いてある通りです。<head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <title>ほるめすメモ帳inBlogger - 投稿一覧</title> <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript"> google.load("gdata", "1.s"); </script> </head> <body> <div id="content"></div>4行目でGoogleがホスティングしているファイルを参照し、5～7行目で実際に呼び出しています。 11行目に、JavaScriptで生成したタグを入れるための領域「content」を用意しています。<script type="text/javascript"> var content = document.getElementById('content'); var bloggerService = new google.gdata.blogger.BloggerService('GoogleInc-jsguide-1.0'); var feedUri = 'http://holmes21.blogspot.com/feeds/posts/default'; var handleBlogPostFeed = function(postsFeedRoot) { var posts = postsFeedRoot.feed.getEntries(); var html = ''; html += '<dl>' + '<dt><strong>Blog:</strong> ' + '<a href="' + postsFeedRoot.feed.getLink('alternate').getHref() + '">' + postsFeedRoot.feed.getTitle().getText() + '</a></dt>'; html += '<dd><ul>'; for (var i = 0, post; post = posts[i]; i++) { var postTitle = post.getTitle().getText(); var postURL = post.getHtmlLink().getHref(); html += '<li><a href="' + postURL + '" target="_blank">' + postTitle + '</a></li>'; } html += '</ul></dd>'; content.innerHTML = html; }; var handleError = function(error) { content.innerHTML = '<pre>' + error + '</pre>'; }; bloggerService.getBlogPostFeed(feedUri, handleBlogPostFeed, handleError); </script>ここもほぼ元ソースそのまま。 一覧取得用のサービスを用意して、読みに行っています。 ここで一段落。 ちなみに、iPhoneっぽいページ表示をするためには、「iUI」というのが便利そうです。 iui - Project Hosting on Google Code iPhone 3G用のWebページを作る3 - ［JavaScript］All About それ以前に、iPhoneの解像度や特有の設定などがあるようなので、それを調べないといけないのですが。
BloggerAPIメモ
参考にするべきであろうリンク等々まとめますね。 Developer's Guide: JavaScript - Blogger APIs - Google Code リファレンス google.gdata.blogger
GoogleAPI試用ページ AJAX APIs Playground
前の記事の後に少し検索してみると、こんな記事を発見。 ASCII.jp：Google APIがブラウザーで試し放題！ なんとも、Google自身がAPIを試用するためのページを作っているというのです。 AJAX APIs Playground 少しだけ試してみました。ページを開いて左上「Pick Sample」の中の「Blogger API」を選択。 さらにその内部「Blogs / List Blogs」で、Bloggerの記事一覧サンプルを開きます。 ページ下「Output」、右上「Edit Code」の内容が切り替わるので、実際に書き換えてみます。
「Edit Code」内17行目に、Bloggerのフィードのアドレスの変数が定義されているようなので、このブログのフィードである「http://holmes21.blogspot.com/feeds/posts/default」と入れ替えて「Output」右の「RunCode」で実行します。
すると、「Output」でこのブログの記事一覧が表示されます。 これを活用すれば何とはなしに出来る気がしてきました。 流石Google、いい仕事してますね。
Blogger用APIがあるらしい
iPhoneにBlogPressというBlogger用アプリがあることから、薄々は感づいてはいたのですが、本当にあったんですね。 Blogger Data API - Google Code GoogleCodeの一環にあるものですが、日本語でのサンプルやリファレンスが作られていないので、使うには至難の業かも。 そもそも探してみた理由は、iPhone用のこのブログのページを作りたいため。 iPhoneで表示すると、記事一覧が表示され閲覧できる、そんなページが作りたいのです。 iPhoneから覗く時に、JS処理が多い記事(SyntaxHighlighter表示)や画像が大量にある記事などは、CPU処理が追いつかず、仕舞いにはSafariがダウンするのです。 どうせiPhoneを使っているのだから、iPhone使用者に還元されることをしてみたいものです。
投稿
