DEV for CITIZEN
操作マニュアル

Copyright © 2014 Aizu-wakamatsu City
DEV for CITIZEN 操作マニュアル

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

ページ数

DEV for CITIZENについて

 「DEV for CITIZEN」に係る機能概要およびア
クセス方法に...
DEV for CITIZEN 操作マニュアル

DEV for CITIZENについて


「DEV for CITIZEN」とは、街を見える化したい、毎日を便利にしたい、市民みんなで街をよくしたい、そ
んな思いを持つ開発者の方のためのプラ...
DEV for CITIZEN 操作マニュアル

DEV for CITIZENについて


-DEV for CITIZENが提供する機能-

「DEV for CITIZEN」には、オープンデータ登録機能、オープンデータのダウンロード機能...
DEV for CITIZEN 操作マニュアル

DEV for CITIZENについて


-DEV for CITIZENへのアクセス-

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

...
DEV for CITIZEN 操作マニュアル

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

「DEV for CITIZEN」では、行政、地元民間企業等が公開したオープンデータをSQLライクにデータ取得・
確認することが可能なAPI「Open Data Q...
DEV for CITIZEN 操作マニュアル

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

-ODQLテンプレートクエリの挿入-

でーた確認画面から、検索したいオープンデータテーブル名をクリックすると、ODQLクエリ(select)の
テンプレートを、テ...
DEV for CITIZEN 操作マニュアル

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

「DEV for CITIZEN」では、行政、地元民間企業等が公開したオープンデータを基に、Webアプリケー
ション作成プラットフォームを提供しています...
DEV for CITIZEN 操作マニュアル

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

–アプリケーションの開発方法-

開発者は、DEV for CITIZEN上で直接コーディング、またはローカルのアプリ資源アップロードによって、
開発したア...
DEV for CITIZEN 操作マニュアル

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

–ODQLでデータを取得するには-

ODQLを活用する場合は、HTMLコード上に以下を追加する必要があります。
また、アプリケーション開発ルールとして...
DEV for CITIZEN 操作マニュアル

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

–ODQLでデータを取得するには-

ODQLを活用したデータ検索を行う場合は、HTMLコード上に以下を追加する必要があります。
また、アプリケーション...
DEV for CITIZEN 操作マニュアル

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

–ODQLでテーブルを更新するには-

ODQLを活用してデータを更新する場合は、HTMLコード上にODQL.LoaderのupdateOpenData関数...
DEV for CITIZEN 操作マニュアル

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

-留意事項-

ローカルで開発したアプリケーションを、「Dev for CITIZEN」にアップロードする際に以下の事項に留意
してください。

規定のフォ...
DEV for CITIZEN 操作マニュアル

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

-テンプレートダウンロード-

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

操作説明
Step 1

画面説...
DEV for CITIZEN 操作マニュアル

最後に

Dev For Citizenを使って、
あなたもアプリ、作ってみませんか?

14

Copyright © 2014 Aizu-wakamatsu City
DEV for CITIZEN 操作マニュアル

アンケート協力のお願い

今後の機能改善のインプットとして、
アンケートにご協力ください。
アプリケーションとして登録されている
Data For Citizen利用アンケート(市民向け)
Da...
Upcoming SlideShare
Loading in...5
×

Dev for Citizen Manual

301

Published on

Dev for citizen操作マニュアルです。

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
301
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Dev for Citizen Manual

  1. 1. DEV for CITIZEN 操作マニュアル Copyright © 2014 Aizu-wakamatsu City
  2. 2. DEV for CITIZEN 操作マニュアル 目次 DEV for CITIZEN 操作マニュアルの記載内容 ページ数 DEV for CITIZENについて  「DEV for CITIZEN」に係る機能概要およびア クセス方法について記載しています。 ・・・・・ P2 データを確認してみよう  「DEV for CITIZEN」にて公開されているデー タの確認方法について記載しています。 ・・・・・ P5 アプリケーションを作ってみよう  「DEV for CITIZEN」にて公開されているデー タを利用したアプリケーションの作成方法につ いて記載しています。 ・・・・・ P7 1 Copyright © 2014 Aizu-wakamatsu City
  3. 3. DEV for CITIZEN 操作マニュアル DEV for CITIZENについて  「DEV for CITIZEN」とは、街を見える化したい、毎日を便利にしたい、市民みんなで街をよくしたい、そ んな思いを持つ開発者の方のためのプラットフォームです。 アプリケーション 作って市民のためになりたい 作ったアプリを公開できる 仕組みがあるといいなぁ DEV for CITIZEN Platform 公共データを分析して、 行動解析したい!!! データ取得 のAPI欲しいなぁ API 2 Copyright © 2014 Aizu-wakamatsu City
  4. 4. DEV for CITIZEN 操作マニュアル DEV for CITIZENについて  -DEV for CITIZENが提供する機能- 「DEV for CITIZEN」には、オープンデータ登録機能、オープンデータのダウンロード機能、API経由の ODQL(SQLクエリ)実行機能、及びアプリケーション公開機能があります。 機能① 機能② 機能③ オープンデータ 登録機能 オープンデータの ダウンロード機能 API経由の、 ODQL(SQLクエリ) 実行機能 会津若松市オープンデータ・プラットフォーム (一般ユーザ向け) ブラウザ上で 直接コーディング (開発者向け) アプリケーション 公開機能 機能④ 3 ローカル開発資源を アップロード Copyright © 2014 Aizu-wakamatsu City
  5. 5. DEV for CITIZEN 操作マニュアル DEV for CITIZENについて  -DEV for CITIZENへのアクセス- 「DEV for CITIZEN」のアクセス、ログイン(ログアウト)方法についてご説明します。 操作説明 Step 1 画面説明 (トップ画面) DEV for CITIZENにアクセス  以下URLにアクセスします http://www.data4citizen.jp/app/developer/ ※右の画面は、Devepoler向けトップ画面になりま す。 Step 2 ユーザ登録  トップ画面にて、「サインイン」ボタンを クリックすると、地域SNSサイト「あいべ あ」の連携アプリケーション承認画面が表 示されるため、開発者にて必要項目を入力 の上、登録・承認願います。 4 Copyright © 2014 Aizu-wakamatsu City
  6. 6. DEV for CITIZEN 操作マニュアル データを確認してみよう  「DEV for CITIZEN」では、行政、地元民間企業等が公開したオープンデータをSQLライクにデータ取得・ 確認することが可能なAPI「Open Data Query Language(以下、ODQLと記載)」を提供しています。 操作説明 Step 1 画面説明 (データ確認画面) 「データを利用する」にアクセス  メニューの「オープンデータ >> データの 利用」をクリックします Step 2 データを確認  テキストボックスにODQLクエリを入力し、 「データ取得」をクリックすると条件に該 当するデータが表示されます。 制約事項 試験中につき将来的に仕様が変更される可能性があります。 • *禁止、union、union all禁止、cast関数禁止 • 5秒以上時間がかかるクエリはキャンセルされます • 10,000件以上の問い合わせ結果のクエリはキャンセルさ れます。件数を絞り検索してください。 5 Copyright © 2014 Aizu-wakamatsu City
  7. 7. DEV for CITIZEN 操作マニュアル データを確認してみよう  -ODQLテンプレートクエリの挿入- でーた確認画面から、検索したいオープンデータテーブル名をクリックすると、ODQLクエリ(select)の テンプレートを、テキストフィールドに挿入できます。 操作説明 画面説明 Step 2 検索するテーブル名をクリック (データ確認画面)  データ確認画面のオープンデータ一覧から、 検索したいテーブルをクリックすると、 ポップアップメニューが表示されます。  表示メニューから「SELECT文サンプル」を クリックします。 Step 1 検索したいテーブルをク リックし、「SELECT文サ ンプル」をクリック テキストフィールドにサンプル文挿入  ODQL入力テキストボックスにODQLクエリ (SELECT文)が表示されます。 選択したテーブルの SELECT文サンプルが 挿入される 6 Copyright © 2014 Aizu-wakamatsu City
  8. 8. DEV for CITIZEN 操作マニュアル アプリケーションを作ってみよう   「DEV for CITIZEN」では、行政、地元民間企業等が公開したオープンデータを基に、Webアプリケー ション作成プラットフォームを提供しています。 アプリケーションの作成方法としては、①ブラウザのテキストフォームでの作成、②ローカル開発した資源 のzipアップロード、の2通りがあります。 操作説明 Step 1 画面説明 「アプリを作る」にアクセス (アプリケーション作成画面)  メニューの「アプリケーション >> アプリ を作る」をクリックします Step 2 アプリの作成方法  1 1 HTMLファイル(html)、javascriptファイル(js)、スタ イルシートファイル(css)、画像イメージファイル (jpeg,png,gif)の登録をサポートおり、HTMLベース でのアプリケーションを公開できます。 2 アプリケーション作成方法選択 新規アプリケーションの作成 • ブラウザ上でテキストフォーム上で直接アプリケー ションを開発します。 zipファイルのアップロード • ローカル開発した資源を、zipでアップロードするこ とでアプリケーションを登録します。 ※ローカル環境でもODQLは利用できます。 2 テンプレートをダウンロード • 「テンプレートをダウンロード」ボタンをクリックす ると、テンプレートファイル(html)がダウンロードさ れます。 7 Copyright © 2014 Aizu-wakamatsu City
  9. 9. DEV for CITIZEN 操作マニュアル アプリケーションを作ってみよう  –アプリケーションの開発方法- 開発者は、DEV for CITIZEN上で直接コーディング、またはローカルのアプリ資源アップロードによって、 開発したアプリケーションを公開することができます。 Dev For Citizenを活用したアプリ開発方法 1.Dev For Citizen上で直接編集する テキスト エディタ ブラウザ 開発者 2.ローカル環境で開発する 直接 コーディング アプリ編集画面 (テキストフォーム) テンプレートをダウンロード 1 ブラウザ上で直接編集 エディタ上でアプリ編集 開発者 2 ブラウザ データ 取得・更新 Dev For Citizen上の アプリ編集画面 8 開発資源を ローカルで実行 SQLクエリ実行 (ODQL) Copyright © 2014 Aizu-wakamatsu City
  10. 10. DEV for CITIZEN 操作マニュアル アプリケーションを作ってみよう   –ODQLでデータを取得するには- ODQLを活用する場合は、HTMLコード上に以下を追加する必要があります。 また、アプリケーション開発ルールとして、index.htmlを必ず作成してください。 Index.html(サンプル) CSS・JSファイル等の読み込みについて CSS、JS、imgには、必ず、../css/ファイル名、../js/ ファイル名 ・・・・ でアクセスしてください。 <html> <body> <!-- styles --> <link href="../css/bootstrap.css" rel="stylesheet"> <link href="../css/bootstrap-responsive.css" rel="stylesheet"> <input type="button" name="test" value="ODQLを実行してみる" onclick="test();"/> <!-- ODQLの実行にはjqueryが必要となります--> <script src="http://code.jquery.com/jquery-2.0.2.js"></script> <!-- ODQLにアクセスするためには、以下のファイルをインポートして下さい.--> <script src="http://www.data4citizen.jp/app/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> 9 <<例>> <link href="../css/xxxx.css" rel="stylesheet"> <link href="../css/yyyy.css" rel="stylesheet"> ODQLの利用について ODQLを活用する場合は、HTMLコード上に以下 を追加する必要があります。 <!-- ODQLの実行にはjqueryが必要となります--> <script src="http://code.jquery.com/jquery2.0.2.js"></script> <!-- ODQLにアクセスするためには、以下のファイルをイ ンポートして下さい.--> <script src="http://www.data4citizen.jp/app/developer /code/js/odql.js"></script> Copyright © 2014 Aizu-wakamatsu City
  11. 11. DEV for CITIZEN 操作マニュアル アプリケーションを作ってみよう   –ODQLでデータを取得するには- ODQLを活用したデータ検索を行う場合は、HTMLコード上に以下を追加する必要があります。 また、アプリケーション開発ルールとして、index.htmlを必ず作成してください。 データ検索時のサンプルコード APIコール手順 ODQLクエリを作成 <html> <body> <!-- styles --> <link href="../css/bootstrap.css" rel="stylesheet"> <link href="../css/bootstrap-responsive.css" rel="stylesheet"> 検索するテーブルに対するODQLクエリをパラメータにした、 連想配列を作成します。 <input type="button" name="test" value="ODQLを実行してみる" onclick="test();"/> <!-- ODQLの実行にはjqueryが必要となります--> <script src="http://code.jquery.com/jquery-2.0.2.js"></script> <!-- ODQLにアクセスするためには、以下のファイルをインポートして下さい.--> <script src="http://www.data4citizen.jp/app/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 = '大戸町上三寄大豆田'"}; selectOpenData関数の実行 ①で作成した配列を、ODQL.Loaderの selectOpenData関数パラメータに設定しメソッド実行す る。 Dev For CitizenのODQL画面からオープンデータのテーブ ル名を右クリックすると、ODSQのクエリテンプレートがテキスト フィールドに挿入されます。 テンプレートを活用し、ODQLクエリを作成し、 var jsonData = ODQLLoader.loadOpenData(data ); alert(JSON.stringify(jsonData)); } </script> </body> </html> 10 Copyright © 2014 Aizu-wakamatsu City
  12. 12. DEV for CITIZEN 操作マニュアル アプリケーションを作ってみよう  –ODQLでテーブルを更新するには- ODQLを活用してデータを更新する場合は、HTMLコード上にODQL.LoaderのupdateOpenData関数を使 用して行います。 updateOpenData関数の利用方法は以下を参考にしてください。 データ更新時のサンプルコード APIコール手順 更新データを連想配列化 <!-- ODQLの実行にはjqueryが必要となります--> <script src="http://code.jquery.com/jquery-2.0.2.js"></script> <!-- ODQLにアクセスするためには、以下のファイルをインポートして下さい.--> <script src="http://www.data4citizen.jp/app/developer/code/js/odql.js"></script> 更新するデータの連想配列を作成します。 update,deleteする際はレコードをユニークに特定する oid※を指定する必要があります。 <script> /** * データ更新用APIです. */ function updateData() { //ODQLを以下のように記述し、ODQLLoader.updateOpenDataを利用して下さい. var data = { "oid": <<oidを入力して下さい。>>, "column1":<<更新する値を入力して下さい.>> , }; ※ODQLはレコードのバルク更新をサポートしていません。 更新モードの選択 ①で作成した配列を、データ更新するモード選択する値含 め、再度連想配列を作成します。 レコード挿入 : “insert” レコード更新 : “update” レコード削除 : “delete” //データアップデート時には、必ずmode='insert'を指定して下さい. var updateData = { "mode" : "update", "data" : data }; updateOpenData関数の実行 //スタンドアローンで開発する際には、該当データのAccess_tokenを入力して下さい. var jsonData = ODQLLoader.updateOpenData(updateData,‘table_name',<<ACCESS_TOKEN>>); ②で作成した配列を、ODQL.Loaderの updateOpenData関数パラメータに設定しメソッド実行 する。 alert(JSON.stringify(jsonData)); } </script> ※old : OpendataID オープンデータのレコードに対するユニークキーとなり、データinsert時に自動で付与されます。 oidを確認するには、ODQLでselectする際に、取得カラムの’oid’を含めて取得してください。(前頁参照) 11 Copyright © 2014 Aizu-wakamatsu City
  13. 13. DEV for CITIZEN 操作マニュアル アプリケーションを作ってみよう  -留意事項- ローカルで開発したアプリケーションを、「Dev for CITIZEN」にアップロードする際に以下の事項に留意 してください。 規定のフォルダ構成でアップロードして下さい 規定のフォルダ構成 css • ローカルで開発する際は、必ず 以下の規定のフォルダ構成で作 成する。 js • アップロードするzipファイル名 は、必ず半角英数字にする。 sample.zip (アプリケーション名) ※なお、 zipファイル名は、アップロードす る際のアプリケーション名となりますが、 後で変更が可能です img html Index.html 12 Copyright © 2014 Aizu-wakamatsu City
  14. 14. DEV for CITIZEN 操作マニュアル アプリケーションを作ってみよう  -テンプレートダウンロード- 開発したアプリケーションについては、zipファイル形式でエクスポートすることが可能です。 操作説明 Step 1 画面説明 (ログイン画面) 「アプリを作る」にアクセス  メニューの「アプリケーション>> アプリ を作る」をクリックします Step 2 該当アプリをエクスポート  該当アプリの「エクスポート」ボタンをク リックするとzipファイルでダウンロードす ることができます。 13 Copyright © 2014 Aizu-wakamatsu City
  15. 15. DEV for CITIZEN 操作マニュアル 最後に Dev For Citizenを使って、 あなたもアプリ、作ってみませんか? 14 Copyright © 2014 Aizu-wakamatsu City
  16. 16. DEV for CITIZEN 操作マニュアル アンケート協力のお願い 今後の機能改善のインプットとして、 アンケートにご協力ください。 アプリケーションとして登録されている Data For Citizen利用アンケート(市民向け) Data For Citizen利用アンケート(開発者向け) を実行して登録ください。 15 Copyright © 2014 Aizu-wakamatsu City
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×