100629

1. 【GoogleのAPIを使って ソートできるテーブル(表)を表示する】

サンプルその1：http://code.prostaff1.com/visualization/table.html

• 見出しをクリックすると 昇順・降順に並び変わる
• 自動的に 背景色が付く
• マウスオーバーやクリックしたときに 背景色が変わる

などの特徴がある

サンプルその2：http://code.prostaff1.com/visualization/table_2.html

• 行と値1/2を選択すると その値が表示される
• 値を変更し「set」をクリックすると 値が上書きされる

サンプルその3：http://code.prostaff1.com/visualization/table_3.html

• 地名・値1・値2を入力し 「add」をクリックすると 行が挿入される

サンプルその4：http://code.prostaff1.com/visualization/table_4.html

書式の設定も optionの設定で変更できる

• 負の値は赤色・()付きに設定
• 値の最後に円を挿入
• 3桁ごとにカンマを挿入

など

サンプルその5：http://code.prostaff1.com/visualization/table_5.html

• 行をクリックすると その情報が上に表示される
• ShiftキーやCtrlキーで複数選択すると 選択した行の情報が全て表示される

サンプルその6：http://code.prostaff1.com/visualization/table_6.html

ラベル部分をクリックすると その情報が表示される

2.【Google APIを使って グラフを書いてみる】

サンプルその1：http://code.prostaff1.com/chart/chart.html

横向きの棒グラフ

グラフをクリックすると 情報が表示される

サンプルその2：http://code.prostaff1.com/chart/chart_2.html

縦の棒グラフ(3D)

optionの設定で 3D表示も簡単に設定できる

サンプルその3：http://code.prostaff1.com/chart/chart_3.html

折れ線グラフ

サンプルその4：http://code.prostaff1.com/chart/chart_4.html

これなんて言うんだっけ?

エリアなんとか？

サンプルその5：http://code.prostaff1.com/chart/chart_5.html

散布図

サンプルその6：http://code.prostaff1.com/chart/chart_6.html

円グラフ(3D)

表にタイトルの設定もできる