Google Chartsで作る図表&インフォグラフィックス!

線グラフの為のデータの準備と設定

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
GoogleChartsを使って線グラフを描画する為の、実際のデータの準備と設定方法について解説致します。
講師:
04:21

字幕

このレッスンでは Google Chartsを使って 線グラフを描画するための 実際のデータの準備と 設定方法について解説致します まずはダウンロードしてきた こちらの「prepare_data_for_line」 というフォルダの中に入っている この「index.html」ファイルを エディタで開いてください そしてこれがそのファイル を開いた状態です このファイルを使って今回のレッスンの 解説を進めていきたいと思います それでは早速レッスンを始めていきましょう 今回注目して頂きたい部分は こちらのファイルの中の この部分となります 今回は日本 アメリカ イギリス の三ヶ国で出生率の推移を 線グラフで描画していって みたいと思います まずはそのためのデータの準備ですね では順番に見ていきたいと思います まずはこちらの部分で 変数「data」を作成して そしてその中に データを入れ込むための箱 厳密に言うと データを入れ込むための テーブルを作成します そして次にこちらの4行の部分 こちらの部分で実際にデータを 入れるための枠を作っていきます つまりは実際のデータを入れ込むための テーブルに対するカラムを 作成していくわけです まず一行目のこちらの部分 こちらの部分は 線グラフの横軸の基準 となる内容を入れ込んでいきます まずこちらの第二引数でそのタイトルを そして 第一引数の所で「string」 と設定して 文字列のデータを 入れ込めるようにしておきます そしてこちら残りの三つの行に関しては 実際にグラフを描画するためのデータですね まず一つ目は 日本 というタイトルを設定して そしてそのデータ型を 「number」要するに数値と設定しています そして残りの二行に関しても同様ですね 一つは「アメリカ合衆国」 というタイトルを設定して 同じく「number」 数値のデータを入れ込めるようにしています 同じく「number」 数値のデータを入れ込めるようにしています そしてもう一つは「イギリス」 というタイトルを設定して それも同じように 「number」を第一引数に設定して 数値のデータを入れ込めるようにしています そして次に続くこちらの部分 こちらの部分で実際のデータを格納しています まずこちらのデータは この「期間」に該当するデータですね この期間には1995年から 2000年といった形の データを入れ込んでいます そしてこちらの「9.5」 というデータは次に定義している こちらの「日本」 の値ですね 続いてこの「14.2」は アメリカ合衆国 そして こちらの「12.4」はイギリスですね このように上から順番に 定義した並びで こちらでは左から順番に データを格納しています そして今回は トータルで四つのデータ をそれぞれの配列にいれて さらにこちらの 「data.addRows」の中で配列を 設定しています これでデータの準備は完了です ここまでできましたら こちらの オプション項目設定部分で まずはタイトルの設定 そしてこちらの「vAxis」で 縦軸の基準となる 項目のタイトルをつけてあげます 今回はこちらの部分ですね そして「titleTextStyle」で 表示するタイトルの文字列が 「italic」体で表示されないようにしています これでこちらのオプション設定の方も完了です 以上でレッスンは終了です 今回はGoogle Chartsを使って 線グラフを描画するための 実際のデータの準備と 設定方法について解説致しました 以降のレッスンでは このGoogle Chartsと準備したデータを利用して 実際に線グラフを描画する 方法について解説致しますので そちらもあわせてご覧ください

Google Chartsで作る図表&インフォグラフィックス!

インフォグラフィックスとはさまざまなデータを人々が直感的に理解できるように図表化・グラフ化したものです。このコースでは、Google ChartsとJavaScriptを使ったインフォグラフィックスの作り方について解説します。このツールの基本的な使い方やさまざまな種類のチャートの作り方、またジオチャートやタイムライン機能などについても説明します。

1時間32分 (27 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 1,990
発売日:2015年04月02日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。