...
- Find proper floor map and download it as a .psd or a .ai file. Open the file in Adobe Illustrator or other editing program (Illustrator would be best).
- If map incudes a legend, cut it out. Drag mouse to select only the map. Copy the highlighted map using Ctrl C on Windows or Cmd C on Mac.
- Create a new file that has the appropriate width and height for the map and paste it into the new file using Ctrl V on Windows or Cmd V on Mac. Before doing anything, save this file and give it a new name.
- Create 3 layers (Layers 1-3). The top layer will be renamed to Text, the middle/second layer will be renamed Hotspots, and the final one should be the layer that you started with. The text layer (top) is the front most, or most surface layer. The Hotspots layer must be between layer 1 and the top layer. It is important that the Text layer is above the Hotspots layer because it allows the text to be seen in the interactive maps in Libcal.
- Separate text into the Text layer and everything else into the bottom layer (aka Layer 1). Do this by highlighting the text from Layer 1 and place it into the text layer. Do this for all of the text in the document.
- Click the Hotspots layer and use the rectangle tool to draw a box around the area that you want to be interactable in the map. In the properties tab, go to appearance and ensure that the stroke and fill of the rectangle are set to none, this way there isn't a random box that covers the map. Then rename the box to its appropriate location (4th Rotunda, West Classroom, 1862). Repeat for all needed hotspots.
- Save this as a .ai or .psd file. Then save it as .pdf file by clicking file, then save a copy, and choosing .pdf under Format Select .pdf. Finally, save it as an .svg by going to save a copy, and choosing .svg under Format Select .svg. Then under options make sure that the image location is set to embed, then click okayOK.
...
