# Web-based visual analysis tool for crminal investigations
# Web-based visual analysis tool for criminal investigations
This tool forms a part of the research project __Analysis__ — “__Complex Analysis and Visualization of Large-scale Heterogeneous Data__”, whose goal is to provide a unified system for solving criminal investigations, allowing the police forces to access, analyze, visualize and collectively share relevant data or information. The frontend of the system is a __visual analysis tool__ with multiple highly-interactive data visualization modules to allow exploration, effective decision-making, and reasoning about the data, in a way that is intuitive and comprehensible to the analysts solving the crimes.
This tool forms a part of the research project “__Complex Analysis and Visualization of Large-scale Heterogeneous Data__” (project Analysis). The primary goal of project Analysis is to design a system for analysis of big heterogeneous data that are collected by the national police agencies. The goal is to provide a unified tool for criminal investigations, allowing the police forces to access, analyze, visualize and collectively share relevant data or information. The frontend of the system is a __visual analysis tool__ with multiple highly-interactive data visualization modules to allow exploration, effective decision-making, and reasoning about the data, in a way that is intuitive and comprehensible to the analysts solving the crimes.
This is an implementation of the visual analysis tool. More detailed information about this tool, such as system design and requirements, can be found in Kristína Zákopčanová's thesis “[__Visual Analysis of Data for Criminal Investigation__](docs/zakopcanova_thesis.pdf)”. The follow-up work done by Marko Řeháček “[__Building a web-based interactive network visualization in Vue.js__](https://is.muni.cz/auth/th/lxum8/)” describes the development process, explaining the selection of technologies, the system architecture, and algorithms for aggregating nodes in the node-link diagram.
This is an implementation of the visual analysis tool. More detailed information about this tool, such as system design and requirements, can be found in Kristína Zákopčanová's thesis “[Visual Analysis of Data for Criminal Investigation](https://is.muni.cz/auth/th/ujzyx/)”. The follow-up work done by Marko Řeháček “[Building a web-based interactive network visualization in Vue.js](https://is.muni.cz/auth/th/lxum8/)” explains the selection of technologies, the system architecture, and algorithms for aggregating nodes in the node-link diagram.
_Project Analysis is supported by the Ministry of the Interior of the Czech Republic within the program “Security Research for the Needs of the State Program 2015–2020” under identification VI20172020096. The project is a cooperation between the Faculty of Informatics (Masaryk University), Institute of Computer Science – ÚVT (Masaryk University), and the Police of the Czech Republic._
@@ -20,39 +19,34 @@ See the [__latest build__](https://www.fi.muni.cz/~xrehacek/analysis-vis) of the
[D3-force](https://github.com/d3/d3-force) to calculate layout for node-link diagram.
## Project setup
Install the JavaScript runtime [Node.js](https://nodejs.org/en/).
Install [Python](https://www.python.org/downloads/), which is required to compile node-sass, one of the dependencies.
Node.js includes _NPM_, a package manager used to handle dependencies. To install the project's dependecies in order to compile it, run:
1. Install the JavaScript runtime [Node.js](https://nodejs.org/en/), which also includes _NPM_, a package manager used to handle dependencies.
2. Install [Python](https://www.python.org/downloads/), which is required to compile node-sass, one of the dependencies.
3. Using NPM, install project's dependecies:
```
npm install
```
Next, install tooling for Vue (`-g` for global install), which will take care of building the application:
4.Next, install tooling for Vue (`-g` for global install), which will take care of building the application:
```
npm install -g @vue/cli
```
### Compiles and hot-reloads for development
5. To compile for development with hot-reloading and run locally, use:
```
npm run serve
```
### Compiles and minifies for production
6. _Optionally, to compile and minify for production, run:_
```
npm run build
```
## Documenting
Use [JSDoc](https://devdocs.io/jsdoc/) to document store (Vuex). This thing is native to JavaScript, does not support __single file components__ of Vue, sadly. However, it allows type checking as in TypeScript.
[Learn more in this article](https://medium.com/@trukrs/type-safe-javascript-with-jsdoc-7a2a63209b76).
Use [JSDoc](https://devdocs.io/jsdoc/) to document store modules (there is no support for Vue's __single file components__). Using proper tools, it allows [type checking as in TypeScript](https://medium.com/@trukrs/type-safe-javascript-with-jsdoc-7a2a63209b76).
To enable type checking in VS Code, turn on this option in editor settings:
```
@@ -60,7 +54,6 @@ To enable type checking in VS Code, turn on this option in editor settings:
```
## Testing
Using [Jest](https://jestjs.io/docs/en/getting-started). Tests are located in `/tests/unit/` and need to be named `*.spec.(js|jsx|ts|tsx)` – Jest will automatically load them.
Run all tests with:
@@ -75,8 +68,10 @@ To additonally generate HTML coverage report in `/coverage`, run:
npm run test:coverage
```
## Debugging in VS Code
<details>
<summary>Setup for VS Code</summary>
### Debugging
Open debug tab, edit `launch.json`:
```
@@ -112,8 +107,7 @@ Open debug tab, edit `launch.json`:
}
```
## VS Code extensions
### Extensions
Pretty much required:
- Vetur (Pine Wu)
@@ -127,21 +121,20 @@ Useful:
- Vue Peek (Dario Fuzinato)
- Auto Close Tag, Auto Rename Tag (Jun Han)
## Application's architecture
</details>
## Application's architecture
[](docs/architecture-highlevel.png)
[](docs/architecture-components.png)
## Contributing
See [issue board](https://gitlab.fi.muni.cz/xrehacek/analysis-vis-prototype/-/boards/731).
Follow this git workflow: https://nvie.com/posts/a-successful-git-branching-model/.
## License
_TBD._
The design and development of this tool is a collaborative work of Jozef Bátrna, Barbora Kozlíková, Marko Řeháček, and Kristína Zákopčanová.