README.md 3.78 KB
Newer Older
Porter Libby's avatar
Porter Libby committed
1
# IFS Datavis Tool 2
Porter Libby's avatar
Porter Libby committed
2
## v0.1.5
Porter Libby's avatar
Porter Libby committed
3
Contributors: Porter Libby
Porter Libby's avatar
test    
Porter Libby committed
4

Porter Libby's avatar
Porter Libby committed
5
6
7
8
[![GitHub issues](https://img.shields.io/github/issues/probably-not-porter/datavis)](https://github.com/probably-not-porter/datavis/issues)<br>
[![GitHub license](https://img.shields.io/github/license/probably-not-porter/datavis)](https://github.com/probably-not-porter/datavis/blob/master/LICENSE)<br>
![GitHub repo size](https://img.shields.io/github/repo-size/probably-not-porter/datavis)<br>
[![Website shields.io](https://img.shields.io/website-up-down-green-red/http/shields.io.svg)](http://cluster.earlham.edu:9900/)<br>
Porter Libby's avatar
fix    
Porter Libby committed
9

Porter Libby's avatar
Porter Libby committed
10
**Docs:**
Porter Libby's avatar
Porter Libby committed
11
12
13
14
[ [ Database Map ] ](docs/DATABASE.md) 
[ [ Developer Guide ] ](docs/DEV.md)
[ [ Customization Guide ] ](docs/CUSTOM.md) 
[ [ Mobile App ] ](docs/MOBILE.md) 
Porter Libby's avatar
docs    
Porter Libby committed
15

Porter Libby's avatar
Porter Libby committed
16
17

[ Live Demo Version ](http://cluster.earlham.edu:9900/)
Porter Libby's avatar
Porter Libby committed
18

Porter Libby's avatar
Porter Libby committed
19
20


Porter Libby's avatar
Porter Libby committed
21

Porter Libby's avatar
Porter Libby committed
22
A visualization tool for the IFS database using Node.js and the ArcGIS api. Uses queries to fetch data from the Earlham Field Science database and show that data in a graph format, as well as a map format. The goal of this application is to be useful for both information purposes, as well as for field work purposes. This requires that the app be usable on an android device, so that field data can be visualized in real time, but the tool must also be user-friendly enough that someone unfamiliar with the work could use it to look at data from a particular IFS trip.
Porter Libby's avatar
Porter Libby committed
23

Porter Libby's avatar
Porter Libby committed
24
25
26
27
28
<div style='display: inline'>
    <image width='30%' src="https://i.ibb.co/XYzb6Gh/Screenshot-20191126-193944.jpg"></image>
    <image width='30%' src="https://i.ibb.co/3CSJsL8/Screenshot-20191126-193902.jpg"></image>
    <image width='30%' src="https://i.ibb.co/HNJ51Hz/Screenshot-20191126-193845.jpg"></image>
</div>
Porter Libby's avatar
Porter Libby committed
29
30
31

**Map view**, **Graph view**, and **Data view** shown respectively.

Porter Libby's avatar
Porter Libby committed
32
## Usage
Porter Libby's avatar
Porter Libby committed
33
34
35
This app is set up to be usable on both mobile and desktop platforms. Keep in mind that whatever machine is hosting the Node server might need to be connected to the same network that your Database is set up on. 

It is possible to have the database and this tool running on the same machine, which would allow users to access the front-end of the tool from either the device running both programs, or any device connected to the same LAN as the host device.
Porter Libby's avatar
Porter Libby committed
36

Porter Libby's avatar
Porter Libby committed
37
First, the <strong>Data view</strong> will open, which can be used to select a specific set of data to view. Once a selection has been made, the user has the option to create a <strong>permalink</strong>, which can be used to return to the same query again, or <strong>export a .csv file</strong> of the data selected, which can be used with a few other processing tools. Once a selection is complete, the <strong>Graph View</strong> and <strong>Map view</strong> will light up to show the user that there is new data to be viewed.
Porter Libby's avatar
Porter Libby committed
38

Porter Libby's avatar
Porter Libby committed
39
40

### Desktop Setup
Porter Libby's avatar
Porter Libby committed
41
1. clone repository and enter parent directory
Porter Libby's avatar
Porter Libby committed
42
2. Follow the format below to create a `.env` file.
Porter Libby's avatar
Porter Libby committed
43
44
45
46
3. use `npm install` to add dependencies to node_modules folder
4. use `node index.js` to start a local development server
5. open `localhost:3000` in your favorite browser!

Porter Libby's avatar
Porter Libby committed
47
### Mobile Setup
Porter Libby's avatar
Porter Libby committed
48
49
1. Install a UNIX terminal emulator like [Termux (Android)](https://play.google.com/store/apps/details?id=com.termux&hl=en_US).
2. Install some basic tools in the emulator:
Porter Libby's avatar
Porter Libby committed
50
51
52
    1. ```pkg install git```
    2. ```pkg install nodejs```
    3. ```pkg install nano```
Porter Libby's avatar
Porter Libby committed
53
4. clone the repository.
Porter Libby's avatar
Porter Libby committed
54
3. Follow the format below to create a `.env` file.
Porter Libby's avatar
Porter Libby committed
55
56
57
58
4. Use `npm install` inside the directory to install dependencies.
5. Use `node index.js` to run the server.
6. open `localhost:3000` in your browser.

Porter Libby's avatar
Porter Libby committed
59
## Format template for .env file
Porter Libby's avatar
Porter Libby committed
60

Porter Libby's avatar
Porter Libby committed
61
```
Porter Libby's avatar
Porter Libby committed
62
63
64
65
66
DB_NAME=[database user name]
DB_HOST=[database host name]
DB_DATABASE=[database name]
DB_PASSWORD=[databse password]
DB_PORT=[database port]
Porter Libby's avatar
Porter Libby committed
67
68
```

Porter Libby's avatar
Porter Libby committed
69
## Node Dependencies
Porter Libby's avatar
Porter Libby committed
70
71
72
73
74
- dotenv@^8.1.0
- ejs@ ^2.7.1
- express@^4.17.1
- pg@^7.12.1
- restful-api@^0.1.8
Porter Libby's avatar
Porter Libby committed
75