jQuery plugin for interactive svg maps

View the Project on GitHub ucdavis/wayfinding


Developed at the School of Law: https://law.ucdavis.edu/information-technology/projects/wayfinding.html


Works with Chrome, Firefox, and Opera. IE will show path, but is not animating the path.

This is a demonstration of a wayfinding system for providing routing within a building. It allows the entire map data to be stored in a single .svg file from which it displays a map and extracts the information about which routes are available. A change in the .svg file will be enough to change routing results.

Things to try

  • Click any room and it will trigger the routing. We will be using this with a touch screen lcd at key points in our building.
  • In addition to clicking on a room it is possible to trigger routing using the "Show Route to" dropdown or through JavaScript.
  • Route to room 201 and try it with the Accessible option on and off an you will see that the accessible route takes the elevator rather than the stairs even though the path is longer. Accessible routing will be extended to allow certain path segments to be considered accessible or not.
  • Change the "Begin Route at" selection and it will remember the last destination and reroute.
  • Click the second room from the left on the top row on the first floor and note that it routes through the right hand side of the room next to it. The left hand side is set not to pass traffic. You can choose which routes to enable.
  • Show paths. Hide paths. Show portals. Hide portals. Show doors. Hide doors.
  • one way paths - work in progress
  • portal lengths as route consideration - work in progress
  • $('#myMaps').wayfinding('checkMap') make into clickable report into report div
  • in addition to checkMap, add a dump parse, consider a load parse from JSON