This commit is contained in:
dchen4
2024-12-02 20:29:44 +11:00
6 changed files with 9694 additions and 123 deletions

BIN
data.sqlite3 Normal file

Binary file not shown.

0
db.js Normal file
View File

40
format.py Normal file
View File

@@ -0,0 +1,40 @@
#it is used to clean and create the database
import sqlite3
import pandas
conn = sqlite3.connect("data.sqlite3")
cur = conn.cursor()
df = pandas.read_csv("offencebymonth.csv")
#drop empty value
new_df = df.dropna()
#get rid of spaces
new_df.replace(' ', '_', regex=True)
LGA = df['LGA'].unique()
subdiv = df['Statistical Division or Subdivision'].unique()
cat = df["Offence category"].unique()
#database split to 3 tables, main statistics, subdiv index and statistics4
#Enale foreign key support
print(cat)
cur.execute("PRAGMA foreign_keys = ON;")
categories = """CREATE TABLE IF NOT EXISTS categories(id INTEGER AUTO INCREMENT PRIMARY KEY, name TEXT)"""
subcat = """CREATE TABLE IF NOT EXISTS subcat(id INTEGER AUTO INCREMENT PRIMARY KEY, name TEXT, cat_id INTEGER, FOREIGN KEY(cat_id) REFERENCES categories(id))"""
location = """CREATE TABLE IF NOT EXISTS location(id INTEGER AUTO INCREMENT PRIMARY KEY, subdiv TEXT, LGA TEXT)"""
stat = """CREATE TABLE IF NOT EXISTS statistics(id INTEGER AUTO INCREMENT PRIMARY KEY, category_id INTEGER, subcat_id INTEGER, location_id INTEGER, month TEXT NOT NULL, count INTEGER NOT NULL,FOREIGN KEY(category_id) REFERENCES categories(id), FOREIGN KEY(subcat_id) REFERENCES subcat(id), FOREIGN KEY(location_id) REFERENCES location(id))"""
cur.execute(categories)
cur.execute(subcat)
cur.execute(location)
cur.execute(stat)
#insert statements
categories_ins = """INSERT INTO categories VALUES(NULL, ?)"""
subcat_ins = """INSERT INTO subcat VALUES(NULL, ?, ?)"""
location_ins = """INSERT INTO location(NULL, ?, ?)"""
stat_ins = """INSERT INTO statistics(NULL, ?,?,?,?,?)"""
cat = cat.tolist()
print(cat)
for category in cat:
print(category)
cur.executemany(categories_ins, category)
cur.execute("SELECT * FROM categories")
print(cur.fetchall())

View File

@@ -1,67 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Crime Statistics</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- dependencies -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
</head>
<body>
<!-- bootstrap-->
<script defer src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js" integrity="sha384-0pUGZvbkm6XF6gxjEnlmuGrJXVbNuzT9qBBavbLwCsOGabYfZo0T0to5eqruptLy" crossorigin="anonymous"></script>
<!-- vue stuff-->
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.8/dist/umd/popper.min.js" integrity="sha384-I7E8VVD/ismYTF4hNIPjVp/Zjvgyol6VFvRkX/vR+Vc4jQkC+hVqc2pM8ODewa9r" crossorigin="anonymous"></script>
<!-- SQL -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/sql.js/1.2.1/dist/sql-wasm.js"></script>
<!--nav-->
<nav class="navbar navbar-expand-lg navbar-light bg-warning">
<a class="navbar-brand" href="#">&nbsp;&nbsp;Crime statistic analysis</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
View
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="#">By year</a>
<a class="dropdown-item" href="#">By LGA</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">By Crime category</a>
</div>
</li>
</ul>
</div>
</nav>
<br><br>
<!-- page columns -->
<div class="container text-center " id="body">
<div class="row">
<!-- now to vue-->
<div class="col-2 border border-primary text-left" id="filters">
<ul class="">
<li class="list-group-item text-left" v-for="item in filters">
<span v-html="item.html"></span>
</li>
</ul>
</div>
<div class="col-10">
</div>
</div>
</div>
<!-- my stuff-->
<script src="index.js"></script>
</body>
</html>

View File

@@ -1,60 +1,47 @@
const initSqlJs = window.initSqlJs
const SQL = await initSqlJs({
// Required to load the wasm binary asynchronously. Of course, you can host it wherever you want
// You can omit locateFile completely when running in node
locateFile: file => `https://sql.js.org/dist/${file}`
});
// Create a database
const db = new SQL.Database();
const { createApp, ref } = Vue
//filters module
createApp({
props: ['dbConnObj'],
data(){
return {
filters : [{"html": a}]
class db_handler {
constructor (sqlite3){
this.db = sqlite3;
}
},
methods:{
sqlStatements(opt, val = 0){
var stmt;
switch(opt){
case 0:
stmt = "SELECT * FROM index";
break;
case 1:
stmt = "SELECT DISTINCT lga FROM index";
break;
case 2:
stmt = "SELECT DISTINCT crime_category FROM index";
break;
case 3:
stmt = "SELECT record_id FROM index";
case 4:
stmt = db.prepare("SELECT * FROM records WHERE record_id=:id");
stmt = stmt.
default
break;
select_all(table){
var stmt = ("SELECT * FROM "+table+";");
console.log(stmt);
return this.db.exec(stmt, {"returnValue":"resultRows"})
}
select(column, condition, table){
console.log(column,condition);
var stmt = this.db.prepare("SELECT * FROM "+table+" WHERE $column = $condition").bind([column,condition]);
return stmt.finalize();
}
}
class component {
constructor(dbhandler){
this.handler = dbhandler;
}
}
class filter extends component{
constructor(dbhandler){
super(dbhandler);
this.init();
}
return stmt;
} ,
init(){
db.exec(sqlStatements(0))
}
},
beforeMount(){
this.init;
var all_location = this.handler.select_all("locations");
console.log(all_location);
var some_location = this.handler.select("id","1","locations");
console.log(some_location);
}
}, {"dbConnObj": db}).mount('#filters');
}
function init(sqlite3){
var global_component = new filter(new db_handler(sqlite3));
}
function filtergen(){
console.log(this.sqlite3);
}

9611
offencebymonth.csv Normal file

File diff suppressed because it is too large Load Diff