コース: JavaScript 実践講座:Google Chartsで図表を作ろう

今すぐコースを受講しましょう

今すぐ登録して、23,200件以上登録されている、業界エキスパート指導のコースを受講しましょう。

ジオチャート(日本版)の為のデータの準備と設定

ジオチャート(日本版)の為のデータの準備と設定 - JavaScriptのチュートリアル

コース: JavaScript 実践講座:Google Chartsで図表を作ろう

ジオチャート(日本版)の為のデータの準備と設定

このレッスンでは Google Chartsを使って「GeoChart」 要するにデータを含んだ 日本地図を描画するための 実際のdataの準備と 設定方法について解説いたします まずはダウンロードしてきたこちらの 「prepare_data_for_japan_geo」 というフォルダの中に入っている この「index.htmlファイル」を エディタで開いてください そしてこれがそのファイルを開いた状態です このファイルを使って今回のレッスンの解説を 進めていきたいと思います それではさっそくレッスンを始めていきましょう 前回までのレッスンでは 世界地図の「GeoChart」を 作成してきました 今回からは日本地図の「GeoChart」を 作っていきたいと思います まずはそのためのdataの作成と optionの設定を見ていきたいと思います 今回注目していただきたい部分は こちらのdata部分 そしてこちらのoption部分 となります それではdataのほうから 順番にみていきたいと思います まずはこちらの部分から 「変数data」を作成して そしてその中に 実際のdataを格納するための 「data table」をセットしています そして次にこちらの部分 この部分ではそのdata tableに対して 2つの「Column」を作成しています まず1つめは「都道府県」というタイトルをつけて そしてそのdata型を「string」 要するに文字列を設定しています そして2つめの「Column」では タイトルを「人口増減率」として そしてdata型を「number」 要するに数値を格納できるようにしています そして実際のdataを格納しているのが こちらの部分ですね ちょっと長くなっていますが すべての都道府県のdataを 入れ込んでいる形となっています これまで通り一つ一つのdataは 配列で作成されていて この配列の左から順番に 上で定義したこの順番通りに dataを格納していきます 今回はこちらの「北海道」は「都道府県」に該当するdataですね そしてこちらの2つめの「-2.2」といのは こちらの「人口増減率」の dataとなっています そしてこれをすべての都道府県で 同じようにdataを作成していきます これでdataの準備は完了です それでは次に…

目次