This repository has been archived by the owner on Jun 23, 2023. It is now read-only.
forked from og-kyogikai/papamama
-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
479 lines (457 loc) · 26.6 KB
/
index.html
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
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
<!doctype html>
<html lang="ja">
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# product: http://ogp.me/ns/product#">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta property="og:type" content="product">
<meta property="og:image" content="http://papamama.code4chiba.org/image/papamama.png">
<meta id="description-tag" name="description" content="千葉市の保育園一覧が表示されているマップ（通年版）">
<title>ちば保育園マップ by Code for Chiba（通年版）</title>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/ol3/3.2.0/ol.min.css" type="text/css">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.2.0/css/bootstrap.min.css" type="text/css">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/jquery-mobile/1.4.4/jquery.mobile.min.css">
<link rel="stylesheet" href="css/base.css" type="text/css">
<link rel="stylesheet" href="css/icon-pack-custom.css">
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-87601234-1', 'auto');
ga('send', 'pageview');
</script>
<script>
var getQueryVariable = function(variable) {
var query = window.location.search.substring(1);
var vars = query.split('&');
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split('=');
if (decodeURIComponent(pair[0]) == variable) {
return decodeURIComponent(pair[1]);
}
}
return null
}
</script>
</head>
<body>
<div data-role="page" id="mainPage">
<div role="main" class="ui-content">
<div id="nav">
<fieldset id="nav1" data-role="controlgroup" data-type="horizontal" data-mini="true">
<label for="cbNinka" id="lblNinka">認可</label>
<input type="checkbox" name="cbNinka" id="cbNinka" checked="checked">
<label for="cbNinkagai" id="lblNinkagai">認可外</label>
<input type="checkbox" name="cbNinkagai" id="cbNinkagai" checked="checked">
<label for="cbKindergarten" id="lblKindergarten">幼</label>
<input type="checkbox" name="cbKindergarten" id="cbKindergarten" checked="checked">
<label for="cbElementarySchool" id="lblElementarySchool">小</label>
<input type="checkbox" name="cbElementarySchool" id="cbElementarySchool">
<label for="cbMiddleSchool" id="lblMiddleSchool">中</label>
<input type="checkbox" name="cbMiddleSchool" id="cbMiddleSchool">
<a id="btnFilter" href="#filterdialog" data-rel="popup" data-position-to="window" class="ui-btn ui-icon-filter ui-btn-icon-right ui-icon-check">検索</a>
<label for="changeBaseMap">背景</label>
<select id="changeBaseMap" data-mini="true">
</select>
<label for="moveTo">最寄駅</label>
<select id="moveTo" data-mini="true">
<optgroup label="駅表示">
<option>駅表示なし</option>
</optgroup>
</select>
<label id="lblDisplayCircle" for="cbDisplayCircle" class="ui-btn-icon-notext">距離円<span class="ui-icon-bullseye ui-btn-icon-notext"></span></label>
<input type="checkbox" id="cbDisplayCircle" name="cbDisplayCircle" data-mini="true"/>
<label for="changeCircleRadius" class="ui-hidden-accessible">円表示</label>
<select id="changeCircleRadius" data-mini="true">
<optgroup label="円表示">
<option value="" selected="selected">円なし</option>
<option value="500">半径 500m</option>
<option value="1000">半径 1km</option>
<option value="3000">半径 3km</option>
<option value="5000">半径 5km</option>
</optgroup>
</select>
<a id="btnFavorite" href="#favorite-list" class="ui-btn ui-btn-icon-right ui-icon-star">お気に入り</a>
<a class="typeform-share link ui-btn ui-icon-heart ui-btn-icon-right" href="https://codeforchiba.typeform.com/to/ozCQwu" data-mode="1" target="_blank">フィードバックする</a>
<a id="btnHelp" href="#helpDialog" data-rel="popup" data-position-to="window" data-transition="pop" class="ui-btn ui-icon-question ui-btn-icon-notext">help</a>
<span id="display-title">通年版</span>
<a id="change-view" href="#"></a>
</fieldset>
</div>
<div id="map" class="map"></div>
<div id="popup" data-role="popup" data-theme="a" class="ol-popup" style="max-height: 200px;">
<a href="#" id="popup-closer" data-rel="back" class="ui-btn ui-corner-all ui-shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right">Close</a>
<div id="popup-title" data-role="header" data-theme="a"></div>
<div id="popup-nav">
<a id="add-favorite" href="#" class="ui-btn ui-icon-star ui-btn-icon-left ui-mini">お気に入り登録する</a>
<a id="remove-favorite" href="#" class="ui-btn ui-icon-star ui-btn-icon-left ui-mini ui-state-active">お気に入り登録中</a>
</div>
<div id="new-open" style="display: none;"><span id="new-open-title"></span></div>
<div id="popup-content" role="main"></div>
</div>
</div>
<div data-role="popup" data-history="false" id="filterdialog" data-theme="a" class="ui-corner-all ui-icon-delete ui-btn-left">
<a href="#" data-rel="back" class="ui-btn ui-corner-all ui-shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right">Close</a>
<form>
<div style="padding:10px 20px;">
<h3>保育施設 絞り込み</h3>
<fieldset data-role="controlgroup" data-type="horizontal" data-mini="true">
<label for="OpenTime" class="select">開園</label>
<select id="OpenTime" class="filtersb">
<option value="">開園</option>
<option value="7:00">7:00以前</option>
<option value="7:30">7:30以前</option>
<option value="7:45">7:45以前</option>
<option value="8:00">8:00以前</option>
</select>
<label for="CloseTime" class="select">終園</label>
<select id="CloseTime" class="filtersb">
<option value="">終園</option>
<option value="18:00">18:00以降</option>
<option value="19:00">19:00以降</option>
<option value="20:00">20:00以降</option>
<option value="22:00">22:00以降</option>
<option value="23:00">23:00以降</option>
<option value="24:00">00:00以降</option>
<option value="27:00">03:00以降</option>
</select>
<label for="24H">24時間</label>
<input type="checkbox" id="24H" class="filtercb">
</fieldset>
<fieldset data-role="controlgroup" data-type="horizontal" data-mini="true">
<label for="EnchouHoiku">延長保育</label>
<input type="checkbox" id="EnchouHoiku" class="filtercb">
<label for="IchijiHoiku">一時保育</label>
<input type="checkbox" id="IchijiHoiku" class="filtercb">
<label for="Yakan">夜間</label>
<input type="checkbox" id="Yakan" class="filtercb">
<label for="Kyujitu">休日</label>
<input type="checkbox" id="Kyujitu" class="filtercb">
</fieldset>
<fieldset data-role="controlgroup" data-type="horizontal" data-mini="true">
<label for="Kodomo">こども園</label>
<input type="checkbox" id="Kodomo" class="filtercb">
<label for="Shonai">事業所内保育所</label>
<input type="checkbox" id="Shonai" class="filtercb">
</fieldset>
<fieldset data-role="controlgroup" data-type="horizontal" data-mini="true" id="vacancy-fieldset">
<label for="Vacancy">空きあり</label>
<input type="checkbox" id="Vacancy" class="filtercb">
</fieldset>
<div class="ui-grid-a">
<div class="ui-block-a">
<a href="#" data-rel="back" id="filterApply" class="ui-btn ui-corner-all ui-btn-b ui-btn-icon-left ui-icon-check">条件適用</a>
</div>
<div class="ui-block-b">
<a href="#" id="filterReset" class="ui-btn ui-corner-all ui-btn-a ui-btn-icon-left ui-icon-delete">リセット</a>
</div>
</div>
</div>
</form>
</div>
<div data-role="popup" data-history="false" id="helpDialog" data-theme="a" class="ui-corner-all ui-icon-delete ui-btn-left">
<a href="#" data-rel="back" class="ui-btn ui-corner-all ui-shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right">Close</a>
<div data-role="header" data-theme="a">ちば保育園マップについて</div>
<div data-role="main" class="main">
<section>
保育園（認可保育施設、認可外保育施設）、幼稚園を地図に表示をしました。<br><br>
少子化と言われている昨今において、未就学児をお持ちの親御さんには、「子どもを正しく育てる」「安心して仕事ができる」ようにお子様に合った保育施設を選択していただきたいと思います。
実際に保育施設を選ぶ際には 入所選考基準だけでなく、所在地や費用などいろいろな情報を元に候補をピックアップし、実際に足を運んで見学をしたうえで決定をするのが一般的です。
千葉保育園マップは<span class="strong">「見学に行く保育施設を見つける」</span>ことを目標に開発をしました。
</section>
<section>
<header>
<h3>保育園マップメニュー</h3>
</header>
<div class="row">
<div class="col-xs-12 col-sm-4">
<img class="sample-image" src="image/tutolial/main-image.png" alt="メイン画像">
</div>
<div class="col-xs-12 col-sm-8">
<table class="table table-bordered">
<thead>
<tr>
<th>項目</th>
<th>説明</th>
</tr>
</thead>
<tbody>
<tr>
<th>認可</th>
<td>認可保育施設を表示/非表示にします。</td>
</tr>
<tr>
<th>認可外</th>
<td>認可外保育施設を表示/非表示にします。</td>
</tr>
<tr>
<th>幼</th>
<td>幼稚園を表示/非表示にします。</td>
</tr>
<tr>
<th>小</th>
<td>小学校と小学校の学区を表示/非表示にします。</td>
</tr>
<tr>
<th>中</th>
<td>中学校と中学校の学区を表示/非表示にします。</td>
</tr>
<tr>
<th>検索</th>
<td>保育施設の条件を絞り込んで検索することができます。</td>
</tr>
<tr>
<th>背景地図</th>
<td>背景の地図を選択することができます。</td>
</tr>
<tr>
<th>最寄駅</th>
<td>指定したJR・私鉄の駅を地図上の中心に表示します。</td>
</tr>
<tr>
<th>円表示</th>
<td>指定した距離を半径とする円を地図上に表示することができます。</td>
</tr>
<tr>
<th class="normal">フィードバックする</th>
<td>「ちば保育園マップ」について意見を入力できます。</td>
</tr>
</tbody>
</table>
<ul class="list-inline">
<li>
<img src="image/tutolial/ninka.png" alt="認可" class="icon">認可保育施設
</li>
<li>
<img src="image/tutolial/ninkagai.png" alt="認可外" class="icon">認可外保育施設
</li>
<li>
<img src="image/tutolial/youchien.png" alt="幼稚園" class="icon">幼稚園
</li>
<li>
<img src="image/tutolial/favorite.png" alt="お気に入り登録時" class="icon">お気に入り登録時
</li>
</ul>
</div>
</div>
</section>
<section>
<header>
<h3>絞り込み検索</h3>
</header>
<div class="row">
<div class="col-xs-12 col-sm-4">
<img class="sample-image" src="image/tutolial/search.png" alt="メイン画像">
</div>
<div class="col-xs-12 col-sm-8">
<table class="table table-bordered">
<thead>
<tr>
<th>項目</th>
<th>説明</th>
</tr>
</thead>
<tbody>
<tr>
<th>開園</th>
<td>開園する時間を指定します。</td>
</tr>
<tr>
<th>終園</th>
<td>終園する時間を指定します。</td>
</tr>
<tr>
<th>24時間</th>
<td>24時間保育をしている保育所を指定します。</td>
</tr>
<tr>
<th>一時保育</th>
<td>一時保育をしている保育所を指定します。</td>
</tr>
<tr>
<th>夜間</th>
<td>夜間保育をしている保育所を指定します。</td>
</tr>
<tr>
<th class="normal">先取りプロジェクト認定</th>
<td>「先取りプロジェクト」認定を受けている認可外保育施設を指定します。</td>
</tr>
<tr>
<th class="normal">保育ルーム認定</th>
<td>「保育ルーム」認定を受けている認可外保育施設を指定します。</td>
</tr>
<tr>
<th>こども園</th>
<td>「認定こども園」を指定します。<br>※認定こども園は保育園の一形態として扱います。</td>
</tr>
<tr>
<th class="normal">事業所内保育所</th>
<td>「事業所内保育所」を指定します。</td>
</tr>
<tr>
<th>空きあり</th>
<td>空きのある保育所を指定します。</td>
</tr>
<tr>
<th>条件適用</th>
<td>絞り込み条件を適用して検索をします。</td>
</tr>
<tr>
<th>リセット</th>
<td>絞り込み条件をリセットします。</td>
</tr>
</tbody>
</table>
</div>
</div>
</section>
<section>
<header>
<h3>地図表示</h3>
</header>
<div class="row">
<div class="col-xs-12 col-sm-4">
<h4>背景地図を選択</h4>
<img class="sample-image" src="image/tutolial/background.png" alt="背景画像">
<div>
地図（Bing）／国土地理院／電車（OSM）／航空写真（Bing）から選択ができます。
</div>
</div>
<div class="col-xs-12 col-sm-4">
<h4>駅を地図の中心に表示</h4>
<img class="sample-image" src="image/tutolial/station.png" alt="駅画像">
<div>
JR・私鉄の駅を指定すると、地図上にその駅が表示され駅が中心になります。
</div>
</div>
<div class="col-xs-12 col-sm-4">
<h4>距離円を表示</h4>
<img class="sample-image" src="image/tutolial/circle.png" alt="円表示画像">
<div>
距離を指定すると、その距離を半径とする円が表示されます。
</div>
</div>
</div>
</section>
<section class="compare">
<header>
<h3>お気に入り・比較</h3>
</header>
<div class="row">
<div class="col-xs-12 col-sm-3">
<img class="sample-image" src="image/tutolial/compare-step1.png" alt="背景画像">
<div>
地図上の保育所をタップしポップアップから「お気に入り登録する」を選択します。
</div>
</div>
<div class="col-xs-12 col-sm-3">
<img class="sample-image" src="image/tutolial/compare-step2.png" alt="駅画像">
<div>
メニューの「お気に入り」を選択するとお気に入りの一覧が表示されます。
</div>
</div>
<div class="col-xs-12 col-sm-3">
<img class="sample-image" src="image/tutolial/compare-step3.png" alt="円表示画像">
<div>
比較したい保育所を2ヶ所選択をします。
</div>
</div>
<div class="col-xs-12 col-sm-3">
<img class="sample-image" src="image/tutolial/compare-step4.png" alt="円表示画像">
<div>
選択した保育所の詳細情報を比較することができます。
</div>
</div>
</div>
</section>
<section>
<header>
<h3>フィードバック</h3>
</header>
<div class="row">
<div class="col-xs-12 col-sm-4">
<img class="sample-image" src="image/tutolial/feedback.png" alt="フィードバック">
</div>
<div class="col-xs-12 col-sm-8">
メニューから「フィードバックする」を選択すると別画面にアンケートフォームが表示されます。<br>
全部で9問ありますが、今後のサービス改善のためにご意見をいただきますようお願いいたします。
</div>
</div>
</section>
<section>
<header>
<h3>ご利用上のご注意</h3>
</header>
<div>
「ちば保育園マップ」は、千葉市が提供するオープンデータを元に、<a href="http://code4chiba.org/" target="_blank">Code for Chiba</a>が提供しています。<br>
保育所などのデータについては千葉市の職員の方々、サービスは<a href="http://code4chiba.org/" target="_blank">Code for Chiba</a>のメンバーが極力間違いがないようにしておりますが、瑕疵（かし）やバグがないことは保証しておりません。<br>
もしデータの間違いやバグなどにお気づきの際はメニューの「フィードバックする」からお伝えいただけると幸いです。<br>
また、利用者の方々にはあらかじめ通知することなくサービスの内容や仕様を変更したり、提供を停止したり中止したりする場合がありますがご了承ください。<br>
<br>
「ちば保育園マップ」は、Code for Sapporo の開発したさっぽろ保育園マップを母体として開発されました。<br>
<br>
<a href="https://github.com/codeforchiba/papamama" target="_blank">githubのページ</a>
</div>
</section>
</div>
</div>
</div>
<div data-role="page" id="favorite-list" >
<div data-role="header" role="banner" class="ui-header ui-bar-inherit">
<h1 class="ui-title" role="heading" aria-level="1">お気に入り一覧</h1>
<a href="#mainPage" data-icon="carat-l" data-iconpos="notext" class="ui-link ui-btn-left ui-btn ui-icon-carat-l ui-btn-icon-notext ui-shadow ui-corner-all" data-role="button" role="button">Back</a>
</div><!-- /header -->
<div role="main">
<form>
<fieldset data-role="controlgroup" class="ui-controlgroup ui-controlgroup-vertical ui-corner-all">
<div class="ui-controlgroup-controls" id="favorite-items">
</div>
</fieldset>
</form>
<div class="ui-content">
<a href="#compare-page" class="ui-btn ui-icon-bullets ui-btn-icon-left ui-corner-all ui-btn-b" id="compare-btn">比較する</a>
</div>
</div><!-- /content -->
</div>
<div data-role="page" id="compare-page" >
<div data-role="header" role="banner" class="ui-header ui-bar-inherit">
<h1 class="ui-title" role="heading" aria-level="1">比較</h1>
<a href="#favorite-list" data-icon="carat-l" data-iconpos="notext" class="ui-link ui-btn-left ui-btn ui-icon-carat-l ui-btn-icon-notext ui-shadow ui-corner-all" data-role="button" role="button">Back</a>
</div><!-- /header -->
<div role="main">
<table id="phone-table" class="nursery-compare ui-shadow table-stroke ui-table ui-table-columntoggle">
<thead>
<tr>
<th class="item-label">名称</th>
<th>
<h3 id="compare-title-1"></h3>
</th>
<th>
<h3 id="compare-title-2"></h3>
</th>
</tr>
</thead>
<tbody id="nursery-compare-body">
</tbody>
</table>
</div>
</div>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js" type="text/javascript"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-mobile/1.4.4/jquery.mobile.min.js" type="text/javascript"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.2.0/js/bootstrap.min.js" type="text/javascript"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ol3/3.2.0/ol.min.js" type="text/javascript"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="js/ol_style.js" type="text/javascript"></script>
<script src="js/movecurrentlocationcontrol.js" type="text/javascript"></script>
<script src="js/movetolist.js" type="text/javascript"></script>
<script src="js/facilityfilter.js" type="text/javascript"></script>
<script src="js/papamamap.js" type="text/javascript"></script>
<script src="js/favoriteStore.js" type="text/javascript"></script>
<script src="js/index.js" type="text/javascript"></script>
<script>(function(){var qs,js,q,s,d=document,gi=d.getElementById,ce=d.createElement,gt=d.getElementsByTagName,id='typef_orm',b='https://s3-eu-west-1.amazonaws.com/share.typeform.com/';if(!gi.call(d,id)){js=ce.call(d,'script');js.id=id;js.src=b+'share.js';q=gt.call(d,'script')[0];q.parentNode.insertBefore(js,q)}})()</script>
<div id="marker"></div>
<div id="markerTitle"></div>
<div id="center_marker"></div>
<div id="center_markerTitle"></div>
</body>
</html>