Code Monkey home page Code Monkey logo

project_bikey_mcbike's Introduction

Project Bikey McBike

Contents

What is Project Bikey McBike?
How does this app work?
Requirements
Demo

What is Project Bikey McBike?

Recently, I put together a series of posts about how to plot ride and bike sharing data on a map using python. As someone who loves hacking away on data and building data driven products, I thought it would be fun to take the code behind those tutorials and transform it into a simple bike sharing application using the Flask microframework and SocketIO. And then in true open source fashion, i'll document how it works and post the code online for anybody who wants to learn how to create a simple data-driven mapping app.

Feel free to fork, and even replace bike share data with other data feeds of your own.

How does this app work.

At a high level, this app does the following:

  1. Asks the user for access to their GEO location
  2. Once the user grants access, the client sends the user's geolocation data server side
  3. A python script then takes that geolocation data and determines the top 5 closest bike share stations to their position (using geopy and some open data from the City of Toronto) and how many bikes are available to rent.
  4. The python script then determines the route to the closest bike share station using openrouteservice
  5. The python script then passes back to the client all of the latitudes and longitudes for the top 5 closest stations, the shortest route and bike availability information.
  6. Then the client renders the user's position, top 5 closest stations and the route to the closest station.
  7. The client also renders metrics about distance to each top station and the number of bikes available to rent.

What does this app look like?

Requirements

This app uses the following python libraries, which you will need to install:

  • numpy
  • geopy
  • openrouteservice
  • datetime
  • flask
  • flask_socketio
  • requests

On the client side:

  • jquery
  • leaflet.js
  • bootstrap

I also installed Termux on the Play Store to run the app locally on my phone.

Main files to review how it works

Essentially, main functionality of the app is contained within the following files:

  1. app.py - this is the main script which aggregates and transforms data from the client (geo) and bikeshare data
  2. helper.py - this is a helper script which determines distances and other information about each bikestation.
  3. /static/js/buildmap.js - this is the main javascript file which takes data from server and maps all data.

Demo

You can find this app working here: https://bikey-mcbike.herokuapp.com/

You'll need to grant location priveleges for the demo to work.

Useful Reference Links

Here are some links that I found very useful:

project_bikey_mcbike's People

Contributors

garethcull avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.