Inspiration

We wanted to know the shortest path to get from our hall to our classes on the other side of campus. We also realized how many routes have stairs or steep slopes, so we wanted to make an option to avoid these areas that could be difficult or impossible for people with disabilities.

What it does

Allows users to click start and end points and then the website highlights the shortest path from their source to their destination. It will also print out the distance (feet) of their route, and the estimated commute time. Also the user can select whether they need a wheelchair accessible route, and our program will factor that into the output path.

How we built it

We used python to build a Graph class including an implementation of Dijkstra's algorithm in order to find the shortest route across campus. We used json files to load a full graph of the campus map into a Graph object. We then used html, css, and an svg file to display our program hosted on a heroku server. Javascript was used to handle user interactions through the svg and pass it on to the python Dijkstra algorithm.

Challenges we ran into

Our naming convention for the vertices in the svg and json files made human errors very prevalent, which meant we spend some time debugging our files. Other than than than, a lot of challenges we ran into were on the front end. No one in our group has any front end development experience so we had to problem solve through a lot of issues. Also, when we extended out program to have a handicap accessibility we had a lot of work to do to get our Dijkstra's to work appropriately given the constraints.

What we learned

We learned a good deal about front end development and how to use javascript and svg into to make a interactable website. We also learned about the interaction between front and back end development, such as getting input from users into javascript and then making that usable for our python data structures/algorithms.

What's next for Shortest Path Around Campus

Add a feature to allow users to specify "stops" along their route.

Develop a better css style for the visuals of the website

Share this project:

Updates