1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
/*
This is a Example program to retrieve and display the data.
Press the Run button on the right of the screen (described the behavior of the Example program below).
Please create a new application rewrite this program work.
*/
* 定数
// カテゴリ
var C_CATEGORY1 = '常住地';
var C_CATEGORY2 = '就業地・通学地';
var C_ORIGIN = 'origin'; // 常住地
var C_DESTIN = 'destination'; // 就業地・通学地
// 利用交通手段
var C_WAY1CNT = '総数(利用交通手段)';
var C_WAY2CNT = '徒歩だけ';
var C_WAY3CNT = '鉄道・電車';
var C_WAY4CNT = '乗合バス';
var C_WAY5CNT = '勤め先・学校のバス';
var C_WAY6CNT = '自家用車';
var C_WAY7CNT = 'ハイヤー・タクシー';
var C_WAY8CNT = 'オートバイ';
var C_WAY9CNT = '自転車';
var C_WAY10CNT = 'その他';
var C_WAY11CNT = '鉄道・電車及び乗合バス';
var C_WAY12CNT = '鉄道・電車及び勤め先・学校のバス';
var C_WAY13CNT = '鉄道・電車及び自家用車';
var C_WAY14CNT = '鉄道・電車及びオートバイ';
var C_WAY15CNT = '鉄道・電車及び自転車';
var C_WAY16CNT = 'その他利用交通手段が2種類';
var C_WAY17CNT = '利用交通手段が3種類以上';
var C_WAY0CNT = '不詳';
* 変数
// 表示するデータの分類(デフォルトは「常駐地」)
var selCategory = '常住地';
// 基本となる場所(デフォルトは「東京都」)
var selArea = '東京都';
/**
* 事前処理
// パッケージのロード
google.load('visualization', '1', {'packages': ['geochart', 'corechart']});
google.setOnLoadCallback(initialize);
// データセット格納テーブル
var lowdata;
// iPhone、iPadなど対応
$("#startgraph").on('tap', function(){
setCategory();
setArea();
drawVisualization();
})
* カテゴリの取得
function setCategory(){
selCategory = $("#category")[0].value;
if (selCategory == C_CATEGORY1){
$('#placed').html(C_CATEGORY2);
} else {
$('#placed').html(C_CATEGORY1);
}
* 常駐地または就業地・通学地の取得
function setArea(){
selArea = $("#area")[0].value;
* 都道府県名称から「都」「府」「県」を削除する
function setPrefForPlot(target){
retValue = target.replace('都', '');
retValue = retValue.replace('府', '');
retValue = retValue.replace('県', '');
if (target == '京都府') retValue = '京都';
return retValue;
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<h3>自宅外就業者・通学者数と利用交通手段</h3><br/>
元データ:常住地による従業・通学市区町村,利用交通手段(16区分)別15歳以上自宅外就業者・通学者数 人口10万以上の市(平成22年国勢調査)
<hr/>
<!-- 常駐地/就業地・通学地が◯◯(例「大阪」)の就業者・通学者の常駐地/就業地・通学地 -->
<span>
<select id="category" onChange="setCategory();drawVisualization();">
<option value="常住地" selected>常住地</option>
<option value="就業地・通学地">就業地・通学地</option>
</select>
</span>
が
<select id="area" onChange="setArea();drawVisualization();">
<option value="北海道">北海道</option>
<option value="青森県">青森県</option>
<option value="岩手県">岩手県</option>
<option value="宮城県">宮城県</option>
<option value="秋田県">秋田県</option>
<option value="山形県">山形県</option>
<option value="福島県">福島県</option>
<option value="茨城県">茨城県</option>
<option value="栃木県">栃木県</option>
<option value="群馬県">群馬県</option>
<option value="埼玉県">埼玉県</option>
<option value="千葉県">千葉県</option>
<option value="東京都" selected>東京都</option>
<option value="神奈川県">神奈川県</option>
<option value="新潟県">新潟県</option>
<option value="富山県">富山県</option>
<option value="石川県">石川県</option>
<option value="福井県">福井県</option>
<option value="山梨県">山梨県</option>
<option value="長野県">長野県</option>
<option value="岐阜県">岐阜県</option>
<option value="静岡県">静岡県</option>
<option value="愛知県">愛知県</option>
<option value="三重県">三重県</option>
<option value="滋賀県">滋賀県</option>
<option value="京都府">京都府</option>
<option value="大阪府">大阪府</option>
<option value="兵庫県">兵庫県</option>
<option value="奈良県">奈良県</option>
<option value="和歌山県">和歌山県</option>
<option value="鳥取県">鳥取県</option>
<option value="島根県">島根県</option>
<option value="岡山県">岡山県</option>
<option value="広島県">広島県</option>
<option value="山口県">山口県</option>
<option value="徳島県">徳島県</option>
<option value="香川県">香川県</option>
<option value="愛媛県">愛媛県</option>
<option value="高知県">高知県</option>
<option value="福岡県">福岡県</option>
<option value="佐賀県">佐賀県</option>
<option value="長崎県">長崎県</option>
<option value="熊本県">熊本県</option>
<option value="大分県">大分県</option>
<option value="宮崎県">宮崎県</option>
<option value="鹿児島県">鹿児島県</option>
<option value="沖縄県">沖縄県</option>
の就業者・通学者の
<span id="placed">就業地・通学地</span>
<input type="button" id="startgraph" value="グラフ描画" />
<font style="color:blue">(iPhone iPadなどの場合は「グラフ描画」ボタンを押してください)</font>
<font style="color:red">※ロード時はグラフの描画に時間がかかります</font>
<div id="visualization" style="width:100%;"></div>
<div id="piechartarea" style="position:absolute;left:60%;top:55%;width:45%;height:45%;background-color:#CCFFFF;" class="ui-widget-content">
エリアを選択すると移動交通手段の内訳をみることができます<br/>
好きな場所へドラッグすることが可能です
</div>
<div id="message" style="position:absolute;left:22%;top:22%;width:45%;height:45%;">
グラフを描画しています...
Click the Browse button or drag and drop to choose files to upload
The Maximum upload size is 1MB.(bmp,gif,jpeg,jpg,png)
*Required field
Add name for another language
You can upload jpg, gif, png file formats
Add description for another language
Fork original application has been updated. >>see
Original application has been updated. >>see
Playing...
Please enter a valid URL