ComponentOne Information

ComponentOne Studio/Wijmo/Xuniの最新情報を公開中

Wijmoを使ってリオオリンピックを楽しもう!

f:id:ComponentOne_JP:20160809145547p:plain

 世界中が熱狂し、暑い夏をさらに熱くするリオ五輪。日本との時差はまるっと12時間ですが、皆さん見ていますか?

開会式の入場時には、スマホを使わない日本選手団のマナーの良さが話題となりましたね。

 

水泳、柔道、ウェイトリフティング、体操など、各競技で日本選手のメダルラッシュが続いています。銅メダルを獲得した選手が「悔しい」と言っている姿を見ると、『いやいや、3位ってスゴイことだよ!』『素晴らしい結果だよ!』『感動をありがとう!』とテレビに向かって念を送ってしまいますが、銅メダルで満足しないその向上心が強さの証なのだろうなぁと納得もします。

 

ところで、現時点で日本がメダルをいくつ獲得したか、分かりますか?
また、メダル獲得数の国別ランキングなんて、知りたくありませんか?

 

JavaScriptコントロール「Wijmo(ウィジモ)」では、メダル獲得数をリアルタイムで表示するサンプル(「オリンピックトラッカー」)を公開しています。

 

このサンプルは、AngularJSとWijmoで作成されており、マテリアルデザインも採用しています。WijmoのFlexGridとFlexChartで国別のメダル数を表示しています。

 

1. Wijmo - FlexGrid

f:id:ComponentOne_JP:20160809151014p:plain

2. Wijmo - FlexChart

f:id:ComponentOne_JP:20160809151018p:plain

 

メダル数のデータの取得は、AngularJSの$httpによりJSONデータを読み込み、WijmoのデータレイヤーであるCollectionViewと連結します。

CollectionViewは、ページング/検索/フィルタリング/ソート等のモデルのレコード管理機能を持っており、FlexGridと連結することでこれらの機能を自動的にグリッド上で実現できるようになります。また、FlexChartにも連結可能なため、同一データを異なった見た目(チャート)で表現することも簡単です。

 

まだまだオリンピックは序盤。今後も日本選手の活躍が期待されますので、皆さんで応援しましょう!

その応援の中で、ちょっとでもWijmoのことを思い出していただければ幸いです。

頑張れ、ニッポン!!

 

ComponentOne