Extending RailCode

Extending RailCode

RailCode is based around an extendible architecture. This allows anyone to add map images into RailCode. All you need to do this is an appropriate image - no knowledge of programming required.

When selecting an image to be used with RailCode, make sure that it is suitable for use within RailCode. Many official transport maps - such as the ones provided for the London Underground by the Transport of London - are under copyright meaning you cannot use them in RailCode without the written permission of the copyright holder - and potentially a large fee. Look for images licensed as Creative Commons Attribution 4.0 or under the public domain. When in doubt, ask before using.

The best images have an approximate resolution of 800x600 pixels. RailCode will automatically scale the image depending on the user's screen size, but try not to stray too far from 800x600. It is best if your chosen image has a transparent background. Once you have an image you wish to use, save it as a PNG file. Make sure each marker (e.g. stations, in the London Underground maps) has a clear title so users can easily identify it.

Now open up the /railcode/js/stationLocations.js file in a text editor. Scroll to the bottom of the file, type 'return' a few times to space out between lines, then paste the following:

var lineName = { image: "/path/to/your/image.png", lines: [ { name: "name of line", locations: [ [{name:"markerName", x:24, y:268}], [{name:"markerName", x:204, y:23}], [{name:"markerName", x:204, y:23}] ] } ] }

Now, replace **lineName **with the name of your addition. Do not include spaces. Next, replace /path/to/your/image.png with the file path to the image you with to include. Replace name of line with the name of your addition, this time using spaces if necessary. Now, for every marker on your image you need to create a line that looks a bit like this: [{name:"markerName", x:24, y:268}],

You can see that three have been created in the example text, but you can have any number, as long as there is more than one. For each marker replace **markerName **with the name of your marker exactly as it appears on the image, except all lower case. Then replace **204 **with the X-Coordinate of the marker on the image, and **23 **with the Y-Coordinate of the marker on the image. If you do not know the coordinates of the markers you can easily find them using most image-editing software such as the GNU Image Manipulation Program (GIMP).

Once you have added in all your marker-information lines, delete the comma on the last line if there is one. You can now close stationLocations.js Now open up stationFunctions.js . It is in the same folder as stationLocations.js . Search for var mapsToChoose . You should find one line that starts with this. At the end of the line, but before the ]; , add a comma followed by the name of your addition - the one without the spaces. If there are any map images you wish to remove from RailCode, you can do so by removing their entry in the line starting with var mapsToChoose . Do not forget to remove the comma that comes after all but the last entries.

That's it! Your map should now be added into RailCode.