まめわざのプログラムのほとんどは、弊社で自作をしています。
オープンソフトのプログラムを組み合わせることで、最小限の知識と手間で、ある程度のものが作れる便利な時代ですが、ホームページ作成システムの提供元として、使い勝手の向上やお客様のご要望の反映ができるように、可能な限り自社開発にこだわっています。
このたび提供を開始したツールのページでは、自社開発したプログラムの一部を、まめわざを使用しなくてもご利用いただけ形で、継続的に提供してまいります。
ツールの提供開始にあたり、一番最初に作成したのは天気予報のjQueryプラグインです。
このプラグインは、LivedoorのWeather Hacksで提供されているデータを、Google Feed APIを経由して取得し、整形して出力をしています。
出力時にWeather Hacksで提供されている画像ではなく、自社作成のウェブフォントを使用することで、デザインのバリエーションを増やしています。
以下では、プログラム内で実行している処理について解説いたします。
GoogleのAPIはhttps://www.google.com/jsapiからgoogleオブジェクトを読み込み、google.load()関数でAPIを読み込むスタイルで、Feed APIに限らずGoogle Maps APIなども読み込みができます。
表示ページ内に
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
とコードを設置しても構わないのですが、プラグインのインストール時のコードを最小限にするために、下記のように後読みにしています。
$.ajax( {
"url": "https://www.google.com/jsapi",
"dataType": "script",
"success": function(){},
"error": function(){}
} );
googleオブジェクト読み込み→google.load実行→Feed APIを利用した処理、という流れを実現するために、次のようにしています。
var init = function() {
//googleオブジェクトがない場合
if(typeof(google) == "undefined" || typeof(google.load) == "undefined") {
$.ajax( {
"url": "https://www.google.com/jsapi",
"dataType": "script",
"success": init
} );
return "";
//google.feedsオブジェクトがない場合
} else if(typeof(google.feeds) == "undefined") {
google.load("feeds", "1", {
"callback": init
} );
return "";
}
//google.feedsを使った処理
};
という流れです。
Weather Hacksのデータは、XML形式とjson形式に対応しているものの、クロスドメインで取得できるjsonp形式には対応していません。jsonp未対応のデータを、外部サービスを使って取得する選択肢としては、
の2つが考えられましたが、今回は2を採用しました。1でも問題ないと思われます。
Weather Hacksの地域別RSSのURLを
new google.feeds.Feed(url)
としてリクエストし、取得したデータを展開すれば表示ができます。
本プラグインのプログラムおよびウェブフォント部分は無料でご利用いただけます（GPLライセンス）。
Weather HacksとFeed APIを利用しておりますので、それぞれの利用規約に則ってご利用くださいますようお願いいたします。