SiRumCz / CSC501

CSC501 assignments
0 stars 1 forks source link

two Choropleth connected to backend #53

Closed soroushysfi closed 4 years ago

soroushysfi commented 4 years ago

I connected two Choropleth to end points. First you have to run the backend and then start frontend with npm start. It should be running fine. If you face any errors let me know.

SiRumCz commented 4 years ago

we should add legend for each map to explain what those colors mean.

jonhealy1 commented 4 years ago

So I run setup_db.py? Or app.py? When I run setup_db.py I get error: ValueError: time data '12/30/18 5:37' does not match format '%m/%d/%Y %I:%M:%S %p'

SiRumCz commented 4 years ago

@noonespecial009 what dataset are you using?

jonhealy1 commented 4 years ago

taxi-sample.csv It's the zip file from Connex

SiRumCz commented 4 years ago

@noonespecial009 hmm, that is not normal. Your error suggests the time value does not match the format, it's missing am/pm. This script worked in my machine. You can use database file I generated on my machine and use it for now. https://drive.google.com/file/d/1cRSqXiB-tCDm58hAJOzoj2tiRRi8tUZK/view?usp=sharing

soroushysfi commented 4 years ago

It's weird because I also didn't get that error.

soroushysfi commented 4 years ago

Does it matter if we use python3 or python?

jonhealy1 commented 4 years ago

So if I have the database file then I can just run app.py? I see the maps but not the chloropleth

SiRumCz commented 4 years ago

I have been using python pip instead of python3 and pip3.

SiRumCz commented 4 years ago

So if I have the database file then I can just run app.py? I see the maps but not the chloropleth

I cloned this repo into a new folder called back-end and git checkout my api branch to run my back-end app python app.py. I then git checkout this ui branch to run react app. I feel like there are easier ways.

SiRumCz commented 4 years ago

So if I have the database file then I can just run app.py? I see the maps but not the chloropleth

and also the .db file should be in the same folder as app.py.

jonhealy1 commented 4 years ago

I see the requests from app.py: 127.0.0.1 - - [15/Oct/2019 14:24:45] "GET /busy-areas HTTP/1.1" 404 - 127.0.0.1 - - [15/Oct/2019 14:24:45] "GET /average-passenger-counts HTTP/1.1" 404 -

I'm just not seeing the chlorpleth layer from react in the browser on the map.

SiRumCz commented 4 years ago

@noonespecial009 the reason you are seeing 404 is because you are on his UI branch. You need to create a new folder and clone this repo and switch to my API branch to run back-end.

SiRumCz commented 4 years ago

@noonespecial009

before you create repo, you should checkout to new-ui-components branch and npm install; npm start this react app. to create a new repo for backend:

  1. in your root folder, 'mkdir a2-back-end'
  2. 'cd a2-back-end'
  3. git clone https://github.com/SiRumCz/CSC501.git
  4. git checkout --track origin/four-api-endpoints-kevin
  5. move your assignment2.db file into a2-back-end folder
  6. pip install -r requirements.txt
  7. python app.py to start back-end app
jonhealy1 commented 4 years ago

Ok it works. Looks good!

I've spent the last two days making a video. The Blue is for departures, the orange is for arrivals. If there are more departures it shows blue, if there are more arrivals it shows orange. The number of arrivals or departures determines the size of the circle.

Could you guys check it out? Maybe we can embed it on our web page? output.zip

I had to find the centre point of each taxi zone. There was quite a few things to figure out.

SiRumCz commented 4 years ago

Ok it works. Looks good!

I've spent the last two days making a video. The Blue is for departures, the orange is for arrivals. If there are more departures it shows blue, if there are more arrivals it shows orange. The number of arrivals or departures determines the size of the circle.

Could you guys check it out? Maybe we can embed it on our web page? output.zip

I had to find the centre point of each taxi zone. There was quite a few things to figure out.

will look later tonight

jonhealy1 commented 4 years ago

It's just a 12 second video.

soroushysfi commented 4 years ago

Ok it works. Looks good!

I've spent the last two days making a video. The Blue is for departures, the orange is for arrivals. If there are more departures it shows blue, if there are more arrivals it shows orange. The number of arrivals or departures determines the size of the circle.

Could you guys check it out? Maybe we can embed it on our web page? output.zip

I had to find the centre point of each taxi zone. There was quite a few things to figure out.

Wow! this is really cool. I will embed it tonight. How did you do it? do you have more details about the video that I can put as a description?

jonhealy1 commented 4 years ago

Hi thanks. I will send more info later. A couple of the zones got mixed up - trying to fix it.

jonhealy1 commented 4 years ago

I noticed in the csv data there are two taxi zones: 264 and 265 that I can't find in the GeoJSON or the Shapefiles. Not sure what is up with that. 265 especially has a ton of activity associated with it but no corresponding geographical location of any sort.

I fixed the video and I will upload a new one later. It takes a while to render. I found centre points for each zone and then made a map. I render a ton of frames for different time periods and then assemble them all into a mp4 with ffmpeg. I will update the notebook on GitHub later.

soroushysfi commented 4 years ago

@SiRumCz I added legend to this branch. If everything seems alright I'd be happy if you could approve this PR.