ブラウザにグラフを表示するライブラリD3.jsを使ってみました。
データを放り込めばグラフが出来るというお手軽なものではなく、グレフのレイアウトやアクションは一つ一つ手でコードを書く必要があるという硬派なライブラリです。
あまりの難しさに投げ出しそうでしたが、要はSVGの要素を追加していくだけと気づいてからはスイスイ。
ようやく構想通りのデザインを仕上げることができたのでした。
しかし、一難去ってまた一難。
このブログで使っている「ワードプレス」は内部構造が独特で、追加ライブラリや自作Javascriptを埋め込むことは基本的にできません。
せっかく作ったのにどうしようと思っていたら、ワードプレスでD3を使うためのプラグインがありました。
こちらも独特な記述が必要ですが、何とかクリア。
出来上がったものがこちらです。起動時のアニメーションとか、マウスオーバーで値を表示してくれます。
体重計を買いました。
型番は秘密ですが、WiFi接続ができるタイプです。
体重計に乗っただけでスイッチオン。予め登録しておいたユーザー（複数登録可）を識別して体脂肪率などを計算。計測後は自動的に記録をアップロードしてからスイッチオフというもの。
ウェブブラウザを使うと過去半年分のグラフが表示されます。
要するにユーザーは体重計に乗るだけで、勝手にアレコレ記録してくれて、ネットで履歴が見られるのです。
便利機能として体重の引き算が可能です。
手荷物を持った状態と下ろした状態で2回測ると、その差分を表示してくれます。
登山リュックの様に体重計に乗せにくいものでも、この方法なら簡単に測れますね。
この手の通信機能付き健康器具はかなりのシェアになってきている様です。
体重計の他に血圧計や心拍計、睡眠監視というものまでありました。
知らない間に世の中進んでますね。
西暦2015年10月21日、午後4時29分。
映画ファンなら誰もが知ってる「その日」がやってきました。
映画「バック・トゥ・ザ・フューチャー２」(BTTF2)で主人公がタイムマシンで訪れる未来の世界が今日なのです。
去年の暮れから「来年はBTTFの年だ」と話題になり、映画と現実の違いを考察するサイトが作られるという盛り上がり。
・空飛ぶ車→ベンチャー起業が作ったが流通せず
・ホバーボード→実現せず。セグウェイは近いか？
・ネクタイ2本締め→流行らなかった
・ポケット裏返し→流行らなかった（マーティJrはポッケを外に出していたわけではなく、ズボン自体を裏返しに履いている。ドクの勘違い？）
・ジョーズ19→映画サイトでジョーク予告編だけ作られた
・自動乾燥服→ファン付き作業服を採用した工場はある
・自動ヒモ結びシューズ→限定販売
・ペプシ・パーフェクト→限定販売
・音声操作テレビ→アップルＴＶ（2015)
さて、その時間に僕が何をしていたかと言うと、
日本時間の10/21,16:29は職場にいたので腕時計とiPhoneで記念撮影。
米西海岸時間のその時（日本時間10/22.08:29）は自宅でBTTF2のビデオを見ながら「2015年だって？ 未来に来た！」というマーティのセリフを感慨深げに聞いていました。
ネクタイ2本締めで出勤するわけにいかないので普通の格好。
帰宅してからは普通のペプシを飲みながらBTTF3を鑑賞するのでした。
これにて儀式は終わり…と思っていたら西海岸からサプライズ。
トークショーにマイケル・J・フォックスとクリストファー・ロイドが、ドクとマーティとして出演したとのこと。しかもデロリアンに乗ってやってきたという小芝居付きです。
10分弱の短い出演でしたが、間違いなく彼らを迎え入れることができたのですね。
当サイトのギャラリーを一新しました。
以前のギャラリーはリンクが小さくて押しにくかったので、思い切ってリンク面積を広くしてアイキャッチ画像もつけてみました。
更に「自転車」「旅行」などのカテゴリ別表示も実装。
前より探しやすくなったと思います。
技術的な話をメモメモ。
以前のギャラリーはJavaScriptによる動的なリンクを使っていました。
HTML自体にリンクは書かれていなくて、ページを読み込んだブラウザ側にリンク集を生成させるものです。
このやり方だと検索エンジンのクロールに引っ掛からないので、不特定多数に記事を探してもらうには不利でした。
新しいギャラリーも動的生成ですが、Phpを使ってサーバー側で生成するので、検索エンジンにかかりやすくなるはず。
もう一つ、アイキャッチの表示にも工夫してみました。
ギャラリー毎に画像ファイル名を指定するのはちょっと大変。そこで、次のようなアイコン適用ルールを考えてみました。
ページの下の方は気力が尽きたので個別画像を指定していませんが、それっぽいデフォルト画像が表示されています。
見た感じはよくあるブログなので「だから何？」と言われてしまいそうですが、流通品でピッタリなものがなかったんですよね。
まるっきり車輪の再発明ですが、phpの勉強も兼ねてるので良しとしましょう。
このページで使っている画像ポップアップを少し変更しました。画像をクリックすると中央に大きく表示される機能の事です。
以前使っていたLightboxはiPhoneでは画像がはみ出してしまう問題があったので、流行のレスポンシブルデザイン版を探し回り、“Image Lightbox”を使う事にしました。
そのままでは互換性に問題があったのでコードを少し変更。
僕のサイト内のＨＴＭＬはそのままで、ライブラリだけを入れ替えて動くようになりました。
せっかくなので詳細をメモしておきました。ご参考まで。