Dev4citizen manual

DEV for CITIZEN
操作マニュアル

Copyright © 2014 Aizu-wakamatsu City

DEV for CITIZEN 操作マニュアル

目次

DEV for CITIZEN 操作マニュアルの記載内容

ページ数

DEV for CITIZENについて

 「DEV for CITIZEN」に係る機能概要およびア
クセス方法について記載しております。

・・・・・

Ｐ2

データを確認してみよう

 「DEV for CITIZEN」にて公開されているデー
タの確認方法について記載しております。

・・・・・

Ｐ4

データを作ってみよう

 開発者が保有しているデータの本サイトへの
アップロード・公開する方法について記載して
おります。

・・・・・

Ｐ5

アプリケーションを作ってみよう

 「DEV for CITIZEN」にて公開されているデー
タを利用したアプリケーションの作成方法につ
いて記載しております。

・・・・・

Ｐ6


1


DEV for CITIZENとは


「DEV for CITIZEN」とは、街を見える化したい、毎日を便利にしたい、市民みんなで街をよくしたい、そ
んな思いを持つディベロッパーの方のためのプラットフォームです。

アプリケーション
作って市民のためになりたい

開発者向けのBaaSとか
革新的であると便利

DEV for CITIZEN Platform

公共データを分析して、
行動解析したい!!!


データ取得
のAPI欲しいなぁ

API

2


DEV for CITIZENへのアクセス


「DEV for CITIZEN」のアクセス、ログイン（ログアウト）方法についてご説明します。

操作説明
Step 1

DEV for CITIZENにアクセス

画面説明
（トップ画面）

 以下URLにアクセスします
http://www.data4citizen.jp/app/developer/
※右の画面は、Devepoler向けトップ画面になりま
す。

Step 2

ユーザ登録
 トップ画面にて、「サインイン」ボタンを
クリックすると、地域SNSサイト「あいべ
あ」の連携アプリケーション承認画面が表
示されるため、開発者にて必要項目を入力
の上、登録・承認願います。


3


データを確認してみよう


「DEV for CITIZEN」では、会津若松市、会津若松市に拠点を置く民間企業等からのデータをSQLライクに
データ取得・確認することが可能なAPI「Open Data Query Language（以下、ODQLと記載）」を展開し
ております。

操作説明
Step 1

「データを利用する」にアクセス

画面説明
（データ確認画面）

 メニューの「オープンデータ >> データの
利用」をクリックします

Step 2

データを確認
 テキストボックスにSQLを入力し、「デー
タ取得」をクリックすると条件に該当する
データが表示されます。

制約事項
試験中につき将来的に仕様が変更される可能性があります。
•
＊禁止、union、union all禁止、cast関数禁止
•
５秒以上時間がかかるクエリはキャンセルされます
•
10,000件以上の問い合わせ結果のクエリはキャンセルさ
れます。件数を絞り検索してください。


4


データを作ってみよう


「DEV for CITIZEN」では、CSVファイルよりデータを登録することが可能です。なお、データモデルとし
て、検索フラグ、ビックデータフラグ等をメタデータとして登録することができます。

操作説明
Step 1

「データを作る」にアクセス

画面説明
（データ作成画面）

 メニューの「アプリケーション>> データ
を作る」をクリックします

Step 2

データの作成
 登録用csvファイルの選択画面にて、ご自身
の作成したcsvファイルを選択し、「次へ」
ボタンをクリックします。
 その後、 csvファイルに記載されたデータが
テーブル形式で表示されます。
 必須項目を入力し、「登録」ボタンをク
リックすると、会津若松市の承認を経て公
開されます。

制約事項
登録用CSVファイルについては、以下に留意して下さい。
•
各カラムのヘッダーについては、必ず英数字にして下さい。
※なお、カラムのヘッダーがDBの物理名として定義されます

•
•

上限ファイルサイズは、12MBとなります。
値にエンクォート（’・“）、改行を含めないでください


5






「DEV for CITIZEN」では、会津若松市、会津若松市に拠点を置く民間企業等からのデータを基に、アプリ
ケーションを作成するプラットフォームを提供しております。
アプリケーションの作成方法としては、①Webインターフェースでの作成、②自身のPCでローカル開発し、
zipファイルでのインポート、の2通りがあります。

操作説明

画面説明

アプリの作成方法


本サイトでは、HTMLファイル(html)、javascript
ファイル(js)、スタイルシートファイル(css)、画像イ
メージファイル(jpeg,png,gif)の登録が可能となって
おり、HTMLベースでのアプリケーションの開発・公
開をサポートしております。

1

（アプリケーション作成画面）

Webインターフェースでの作成

1

2

3

• アプリケーション名を定義し、テキストフォーム形式
でアプリケーションを開発します。

2

zipファイルでのインポート
• 自身のPCでローカル開発し、zipファイルでのイン
ポートすることでアプリケーションを登録することが
可能です。
• ODQLを利用したスタンドアロンでの開発が可能です。

3

テンプレートをダウンロード
• 「テンプレートをダウンロード」ボタンをクリックす
ると、テンプレートhtmlファイルが取得できます。


6




ODQLを活用する場合は、HTMLコード上に以下を追加する必要があります。
また、アプリケーション開発ルールとして、index.htmlを必ず作成してください。

Index.html（サンプル）
<html>
<body>

<link href="../css/bootstrap.css" rel="stylesheet">
<link href="../css/bootstrap-responsive.css" rel="stylesheet">
<input type="button" name="test" value="ODQLを実行してみる" onclick="test();"/>

<script src="http://code.jquery.com/jquery-2.0.2.js"></script>

<script src="http://admin.data4citizen.jp/app_test/developer/code/js/odql.js"></script>
<script>
/**
* ODQL実行用テストメソッドです.
*/
function test() {
//ODQLを以下のように記述し、ODQLLoader.loadOpenDataを利用して下さい.
var data = { odql : "SELECT town_name,year,month FROM O_OOAZA_JINKO where
town_name = '大戸町上三寄大豆田'"};
var jsonData = ODQLLoader.loadOpenData(data);
alert(JSON.stringify(jsonData));
}
</script>
</body>
</html>


CSS・JSファイル等の読み込みについて
CSS、JS、imgには、必ず、../css/ファイル名、../js/
ファイル名・・・・でアクセスしてください。
<<例>>
<link href="../css/xxxx.css" rel="stylesheet">
<link href="../css/yyyy.css" rel="stylesheet">

ODQLの利用について
ODQLを活用する場合は、HTMLコード上に以下
を追加する必要があります。

<script src="http://code.jquery.com/jquery-2.0.2.js"></script>

<script src="http://admin.data4citizen.jp/app_test/developer/code/js/odql.js"></script>
<script>
function test() {
//ODQLを以下のように記述し、ODQLLoader.loadOpenDataを利用して下さい.
var data = { odql : "SELECT town_name,year,month FROM O_OOAZA_JINKO where
town_name = '大戸町上三寄大豆田'"};
var jsonData = ODQLLoader.loadOpenData(data);
alert(JSON.stringify(jsonData));
}
</script>

7


アプリを作ってみよう（留意事項）


アプリケーションの作成方法として、②自身のPCで開発し、「Dev for CITIZEN」にアップロードする際に
以下の事項に留意してください。

規定のフォルダー構成
でインポートして下さい
•

ご自身のPCで開発する際には、
必ず以下のフォルダ構成で作成
してください。

•

また、zipファイル名については、
必ず半角英数字にしてください。

css

js

※なお、 zipファイル名は、インポートした
際、アプリケーション名となりますが、イ
ンポート後変更することは可能です

img

html

Cross Site Scriptingに留意してください

Index.html


Hoge.zip(アプリケーション名)
|- css
|- js
|- img
|- html

•

ご自身のPCでアプリケーションを開発す
る際、ODQLを活用する場合には、P.7の
HTMLコードを追加することが必須となり
ますが、Cross Site Scriptingに留意し開
発してください。

•

Google Chrome等では、XSS仕様により、
開発者側で別途設定等を実施し、開発して
いく必要があるため、internet explorerで
開発すると、XSSエラーが発生しなくなり
ます。

8




開発したアプリケーションについては、zipファイル形式でエクスポートすることが可能です。

操作説明
Step 1

「アプリを作る」にアクセス

画面説明
（ログイン画面）

 メニューの「アプリケーション>> アプリ
を作る」をクリックします

Step 2

該当アプリをエクスポート
 該当アプリの「エクスポート」ボタンをク
リックするとzipファイルでダウンロードす
ることができます。


9

Dev4citizen manual

More Related Content

Featured (20)

Dev4citizen manual