コンピュータ科学実験1の課題6「SQLデータベースと連携したPython WSGI Webアプリケーションの作成」の公開ソースコードです。
pandas
が必要です。
pip install -r requirements.txt
を実行してください。
- data: データベースのCSVファイルとカラム情報が格納されたディレクトリ
- html: HTMLファイルが格納されたディレクトリ
- img: 画像ファイルが格納されたディレクトリ
- modules: SQL文作成や検索結果のHTML文を生成するモジュールが格納されたディレクトリ
- utils: アプリで使用するユーティリティ関数が入ったディレクトリ
ルートディレクトリ上で以下のコマンドを実行してアプリケーションを起動します。
# 50089はポート番号
# 他のポート番号に変えても良い
python3 sdvx_stats_app.py 50089
Webブラウザでhttp://localhost:50089
にアクセスすることでWebアプリケーションのトップページにアクセスすることが出来ます。
アプリケーションを起動後、最初にアクセスするページです。
トップページは検索条件指定部分とランキング部分に分かれています。
検索条件指定

検索フィルタ部分で、レベルや難易度、楽曲名や作曲名のフィルタを指定することで、指定したものに合致する統計データのみを出力できます。
また、表示項目部分で、指定した項目 (列) のみ出力できます。
尚、チェックボックスに関しては全て複数選択可能です。
検索フィルタ部分
① 表示するデータのレベルをチェックボックスで指定する。例えば、19と20にチェックを入れると、レベル19と20のデータのみが出力される。全選択ボタンを押すとすべてチェックされ、選択解除ボタンを押すと選択が解除される。
② 表示するデータの難易度をチェックボックスで指定する。例えば、“GRV” と “XCD” にチェックを入れると、難易度名が “GRAVITY” と “EXCEED” の譜面のみが出力される。全選択ボタンを押すとすべてチェックされ、選択解除ボタンを押すと選択が解除される。
③ 表示するデータの楽曲名をテキストボックスに入力する。検索は部分一致で行われるので、楽曲名に入力した値が含まれていればそのデータが出力される。
④ 表示するデータの作曲者名をテキストボックスに入力する。検索は部分一致で行われるので、作曲者名に入力した値が含まれていればそのデータが出力される。
※ 検索条件で何も指定しなければ全楽曲が検索される。
表示項目
⑤ レベル、作曲者名、プレイ人数の項目を表示するかどうかをチェックボックスで指定する。
⑥ 各クリアメダル (クリアマーク) の人数 (またはプレイ人数に対する割合) の項目を表示するかどうかをチェックボックスで指定する。全選択ボタンを押すとすべてチェックされ、選択解除ボタンを押すと選択が解除される。
⑦ 各スコアランクの人数 (またはプレイ人数に対する割合) の項目を表示するかどうかをチェックボックスで指定する。ドロップダウンボックスで、⑥と⑦を%表示するか人数表示するかを選択する。デフォルトは%表示。全選択ボタンを押すとすべてチェックされ、選択解除ボタンを押すと選択が解除される。
⑧ 全体の平均スコアの項目を表示するかどうかをチェックボックスで指定する。
⑨ 各VOLFORCE CLASS毎の平均スコアを表示するかどうかをチェックボックスで指定する。全選択ボタンを押すとすべてチェックされ、選択解除ボタンを押すと選択が解除される。
⑩ 各SKILL LEVEL毎の平均スコアを表示するかどうかをチェックボックスで指定する。全選択ボタンを押すとすべてチェックされ、選択解除ボタンを押すと選択が解除される。
絞り込み
⑪ 「絞り込み」ボタンを押すと、SQL文が実行され検索結果が表示されるページへ遷移する。
※ 表示項目で指定した項目に関係なく、動画、楽曲名、難易度名、削除の項目は必ず表示される。
ランキング

- スコア難易度が高い楽曲を上から順に10曲選出して掲載しています。
- RANK、動画リンク、楽曲名、難易度、レベル、作曲者、平均スコア、インペリアル1の平均スコア、後光暴龍天の平均スコアを表示します。
- 楽曲名をクリックすることで偏差値計算ページ (後述)に遷移します。
検索結果ページは、トップページと同様の検索条件指定部分と、検索結果を表示する部分に分かれています。
検索結果表示

上の画像は、
- レベル: 19, 20
- 難易度名: HEAVENLY (HVN)
- 表示項目: レベル, 作曲者, PUC 率 (%), 998 率 (%), 平均スコア, インペリアル2の平均スコア
を検索条件として指定した場合の検索結果を示しています。
機能
- 動画の項目にあるYoutubeのアイコンをクリックすると、その行に表示されている楽曲名をYoutube上で検索した結果を表示する外部ページに遷移する。
- %表示を採用した項目に関して、値が0%、すなわち該当者が0人の場合は灰色文字、0%~0.1%なら赤文字、0.1%~1%なら赤文字 (太字)で表示する。
- 楽曲名をクリックすると、その楽曲の偏差値計算ページ (後述) に遷移する。
- 表のヘッダーにある項目名 (列名) をクリックすると、その項目に関して降順、もう一回クリックすると昇順になるように表のデータが動的にソートされる。 ※ 一部の列でソートが正常に出来ないバグを確認済み、修正中。
偏差値計算ページでは、選択した譜面の自身が持つスコアを入力し、その譜面に関してスコアツールに登録された全スコアデータ中での偏差値を計算して表示します。
偏差値計算結果表示

- 難易度のドロップダウンリストから偏差値を確認したい譜面の難易度名を選択し (デフォルトはMXM, INFなどの第4譜面), テキストボックスに自身のスコアを入力して計算ボタンをクリックすると自身の偏差値と, 選択した譜面の統計データが表示されます。
- 不正な数値や文字が入力される、または登録データ数が1つ以下の場合はエラーが発生します。
aboutページでは、使用した画像、参考文献を表示します。