はてなグラフってなに?

はてなグラフとは、毎日数値を入力していくだけで、簡易なグラフをいくつも作成することができるサービスです。毎日の体重測定や、起床時刻の記録など、単純なデータ管理にお使いいただけます。

折れ線グラフや棒グラフ表示に対応しています。

作成したグラフデータは、はてなダイアリー、はてなグループなどに簡単に表示させることができます。(他のブログなどにもイメージタグを使えば画像を貼り付けられます。)

他にも他のユーザーの公開グラフと比較をしたり、タグでつながる機能などが用意されています。使い始めるにははてなグラフの使い方をご覧ください。

はてなグラフの使い方

グラフデータを作成する

  1. 編集画面キャプチャ02まず、「データ」画面から「グラフを追加」をクリックしてグラフ名を入力してください。たとえば、「体重」という名前のグラフを作ってみましょう。
  2. 編集画面キャプチャ01次に、「日付を追加」をクリックして、データを入力したい日付を入力してください。当日のデータが存在しない場合、今日の日付が入力されます。
  3. あとは毎日続けてデータを入力していくだけで、どんどんグラフが更新されていきます。過去の日付にさかのぼってデータを入力することもできますので、うっかり記録をつけ忘れたりしても大丈夫です。

はてなのサービスと連携する

グラフ画面に、あなたの公開グラフ一覧が表示されています。グラフをクリックすると、より詳細なグラフ画面へと移動します。

はてな記法、はてなモジュールを使うことで、お使いのはてなダイアリーはてなグループにはてなグラフを簡単に表示させることができます。

はてな以外のブログやホームページにもイメージタグを貼り付ける事で表示が可能です。

他のグラフと比較する

グラフの比較画面詳細グラフ画面に表示されているグラフの比較にグラフ記法を入力することで、他のユーザーの作成した公開グラフと比較することができます。

また、比較したグラフを <img> タグではてなダイアリーやブログに表示させることができます。

タグでつながる

タグとはグラフを分類するための識別子で、カテゴリやフォルダのようなものです。たとえば体重を記録したグラフに [体重] とタグを付けることで、同じ「体重」というタグをつけた人のグラフを見つけたり、さらに比較したりすることができます。

より詳しくは、次章のはてなグラフの詳しい使い方をご覧ください。

はてなグラフの詳しい使い方

編集画面

編集画面キャプチャ03グラフを追加する

グラフ名ごとにひとつグラフが作成されます。グラフ名は全角16文字半角48文字までです。

& ` ; + / ? < > % [ ] などの記号は使うことができません。

グラフ名はアルファベットの大文字・小文字を区別しません。例えば、「HOGE」と「hoge」を同時に使用することはできません。

また現在はデータベースの問題で、最後にカタカナの「ム」が付くタイトルを指定することができません。

数値を入力する

グラフのデータには、半角数字のみ入力できます。自動的に小数点2位まで記録されます。それ以下は切り捨てられます。

登録できる数値の上限と下限は以下の通りです。

  • 最大値:999999999.99
  • 最小値:-99999999.99

また、半角のコロン「:」で区切った数字は自動的に60進法に変換され、時間として扱われます。毎日の起床時刻の記録や運動した時間の記録にお使いください。

  • 今日は6時30分に起きた。→「6:30」と入力すると「6.5」に変換されます。
  • 今日は1時間30分間水泳で泳いだ。→「1:30」と入力すると「1.5」に変換されます。

日付を指定してデータを入力する

以下の形式で、日付の指定が可能です。(年の指定がない場合は現在の年が指定されます。)

年の100の位、1000の位が省略された場合は2000年代として扱います。過去の年を入力したい場合は「0999-01-02」のように年が4桁になるように0で埋めてください。

  • ハイフン( - )で区切る。(「2005-07-28」「「05-07-28」「07-28」)
  • スラッシュ( / )で区切る。(「2005/07/28」「05/07/28」「07/28」)
  • 年月日で指定する。(「2005年7月28日」「05年7月28日」「7月28日」)
  • 区切らずそのまま入力する。(「20050728」「050728」)

csvファイルを活用する

編集画面キャプチャ06文字コードが Shift_JIS で作成されたcsv形式のファイルを、アップロードしてグラフにすることができます。

csvファイルの書式は、1行目にグラフ名を、1列目に日付を記述してください。

編集画面の下部に表示されているCSVファイルをアップロードから、該当のファイルを参照してアップロードしてください。

ファイルのアップロードが成功すると、既にあるデータに加えて新しくグラフが追加されます。うまく反映されない場合はファイルの内容をご確認ください。

また、これまでに作成したデータをcsvファイル形式でダウンロードすることができます。CSVファイルをダウンロードから、リンクを右クリックしてファイルを保存してください。

ダウンロードしたcsvファイルは、テキストエディターや表計算ソフトで再編集することが可能です。

グラフを移動する

グラフページやデータ編集ページに表示されるグラフの並び替えをするには、矢印アイコン左へをクリックしてください。1回クリックするたびに、グラフが左に移動します。

その日のデータを削除する

日付の横に表示されている消しゴムアイコン削除をクリックすると、その日付のデータが全て削除されます。

グラフの設定

グラフ設定編集画面に表示されている鉛筆アイコン編集をクリックすると、各グラフの詳細ページに移動します。ログイン中の本人にのみグラフの設定が表示されているので、ここからさまざまな設定を変更することができます。

線の色を変える

グラフの線の色を変更することが可能です。プルダウンから好きな色を選んで「変更する」ボタンを押し決定してください。

グラフの種類を変える

グラフの種類を変更することができます。現在は折れ線グラフと棒グラフに対応しています。また、グラフの数値を累積値で表示するかや、縦軸を降順か昇順かを選択することができます。

グラフの最大値と最小値を設定する

特に設定がない場合、グラフの最大値と最小値は自動で決定します。

グラフの縦軸に任意の数値を入力すると、自分で最大値と最小値をまで設定することができます。値に指定することができるのは10桁、小数点2位までの数字です。

グラフの値を非表示にする

グラフの縦軸項目の「値を表示しない」にチェックをつけると、縦軸の値が表示されなくなります。

グラフは公開したいけど、他人に値を知られたくない場合などにお使いください。値を表示しない場合、自分のグラフ同士では比較できますが、他人のグラフとは比較することができません。

グラフの目標値を設定する

目標値に値を設定することで、「この一線は越えたくない」や「ここまでたどり着きたい」といった目標ラインを設定できます。また、色を選ぶこともできます。グラフの比較を行った場合は表示されません。

目標ラインがグラフの縦軸の範囲を超えている場合は、最大値・最小値を設定して表示されるよう調節してください。

グラフを非公開にする

グラフごとに、ログインしていない状態では閲覧できない「非公開」設定にすることができます。プルダウンメニューから選択してください。

データページに表示しない

「データ表示」で「非表示」に設定すると、データ編集ページにそのグラフのデータが表示されなくなります。あまり頻繁に入力しなくなったグラフや、はてなカウンターなどから自動で入力しているグラフなどにお使いください。

データ非表示にしたグラフは、「グラフ」からグラフ設定ページに移動して再度「表示」に変更することが可能です。

タグをつける

"[ タグ名 ]"と書くことで、グラフにタグをつけることができます。ひとつのグラフに指定できるタグは3つまでです。

設定したタグはページ上部のグラフ名の横に表示され、クリックすることで同じタグをつけているグラフ一覧ページへ移動します。

また、他の人がどんなタグをつけているかは、はてなグラフのトップのタグ一覧から見ることができ、よく使われているタグは文字サイズが大きくなって表示されています。

グラフを参照しやすくするために、他のユーザーがどうタグ付けしているかも参考にしてタグ付けていきましょう。

グラフを比較する

グラフの比較に、グラフ記法を入力することで複数のグラフを比較して表示することができます。自分のグラフだけでなく、他のユーザーのグラフ記法を指定することもできます。

グラフの比較では、入力した順に自動的に線の色が決定されます。

数式を使ってグラフを集計する

数式にグラフ名と数式を入力すると、自分が作成したグラフをもとに計算を行ったグラフを作成することができます。

たとえば、愛犬を抱えて量った体重から、自分の体重を引いた愛犬の体重のみのグラフを作成したい場合は、「数式」欄に

=

のように入力してください。グラフ名は [ ] で囲んでいただく必要があります。

はてなグラフでは、

  • +
  • -
  • *
  • /
  • (
  • )

などの演算子や関数を使うことができます。また、グラフ名の他に直接数値を指定することも可能です。

はてなグラフで利用可能な演算子、および関数の一覧ははてなグラフ利用可能関数をご覧ください。

数式で作成したグラフの内容は編集画面ではセルが灰色で表示され、編集することができません。数式を編集してください。

グラフを削除する

グラフの削除から「このグラフを削除する」ボタンをクリックすると、グラフのデータ全てが削除されます。

はてなのサービスと連携する

グラフ記法

はてなモジュール設置画面グラフ画面に表示されている、

[graph:id:ユーザー名:グラフ名:image]

という文字列をはてなダイアリー・はてなグループの日記やキーワードの本文中に貼り付けると、グラフ画像とグラフへのリンクを表示させることができます。

詳しくははてなダイアリーのヘルプを参照ください。

グラフモジュール

グラフ画面に表示されている、

<hatena name="graph" moduletitle="タイトル" template="hatena-module" graphname="グラフ名" background="">

という文字列をはてなダイアリー、はてなグループのヘッダやフッタに貼り付けると、サイドバーなどにグラフを表示させることができます。

また、 background に画像URLを指定することで、背景に画像を表示させることができます。

詳しくははてなダイアリーのヘルプを参照ください。

はてな以外のブログやホームページに画像を表示する

イメージタグ

グラフ画面の一番下に表示されている

<a href="http://graph.hatena.ne.jp/ユーザー名/グラフ名"><img src="http://graph.hatena.ne.jp/ユーザー名/graph?graphname=グラフ名" width="130" height="90" alt="グラフ名"></a>

というhtmlタグを入力ください。

はてなグラフAPI(開発者様向け)

APIを用いて外部からグラフ値の登録が可能です。毎日のデータ追加の自動化などにお役立て下さい。詳しくは『はてなグラフAPI』のドキュメントをご覧下さい。

ご確認ください

はてなグラフは、JavaScriptを使用したアプリケーションです。ご利用には、ブラウザのJavaScriptの設定が有効になっている必要があります。

動作確認を行っているブラウザは、以下の通りです。

  • InternetExplorer 6
  • Firefox 1.0.4