University Map

Using the map on other websites

Creating custom maps

In order to create a custom map you'll need the identifiers to the points you'd like to include on the map. These identifiers can be found from the URL within maps.ox, for example Christ Church has the path #/places/oxpoints:23232352. Therefore the identifier is oxpoints:23232352. Non-University points can be included as well: George and Danver on St. Aldates has the identifier osm:553028844. Now if we want to create a custom map with Christ Church and George and Danver we'd use the following path.


Note that identifiers should be separated by a comma if you have more than one POI in your map.

The browse pane (on the left) can be removed leaving a fullscreen map by using the fullscreen parameter.


Embedding a map

You can embed a map in your website using an iframe. You need to use the base url // and then add a path, either a custom path created as per the instructions above (e.g. #/custom?ids=oxpoints:23232352,osm:553028844 ), or an existing path within maps (e.g. #/search?type=/university/college).

Note that the base url does not start with http:, but rather just two slashes. This is a protocol-relative URL, and ensures that the map will be displayed over http or https. (N.B. This will not work for viewing maps embedded in an locally stored file. An http: prefix can be included during local testing)

The following iframe embeds a custom map including the different locations of IT Services:

<iframe src="//,oxpoints:23233672,oxpoints:23233665,oxpoints:55329098,oxpoints:23233636" style="width: 80%; height: 500px;"></iframe>


IT Services

<iframe src="//,oxpoints:23233672,oxpoints:23233665,oxpoints:55329098,oxpoints:23233636" frameborder="0" width="80%" height="500" scrolling="no"></iframe>

All Colleges

<iframe src="//" frameborder="0" width="80%" height="500" scrolling="no"></iframe>

Custom map with browse pane

<iframe src="//,osm:553028844" frameborder="0" width="80%" height="500" scrolling="no"></iframe>

Custom fullscreen map

<iframe src="//,osm:553028844&fullscreen" frameborder="0" width="80%" height="500" scrolling="no"></iframe>