TTC Google Maps for all!
I just spent a few minutes factoring out my TTC subway map Javascript code so that it can be called to insert the TTC subway into any Google Map:
<div id="map">
<script src="http://crazedmonkey.com/ttcgooglemap/ttcgooglemaps.js"
type="text/javascript"></script>
<script type="text/javascript">
<!--
var map = new GMap( document.getElementById( "map" ) );
map.addControl( new GSmallMapControl() );
map.centerAndZoom( new GPoint( -79.386871, 43.660241 ), 4 );
// Add your own markers and polylines here.
drawTtcSubwayMap( map );
-->
</script>
There are two other additional functions, drawTtcSubwayMapColor()
and writeTtcSubwayStations()
, which can be used to specify the colors for the different subway lines and to display the colour-coded list in a div
, respectively. I might add more helper methods later if there is a demand for them.
You can affect how the stations appear in the info pop-up by styling div
elements of the station
class.
Originally I had thought to limit access to my Javascript file to those who asked permission to use it. Doing so would make me aware of how people were using the map. For now, people are free to link the Javascript in their pages. All I ask is that you leave a comment on my weblog with a link to your page, and include the following HTML somewhere near the map:
<p>TTC station code and coordinates provided by
<a href="http://crazedmonkey.com/">Ian Stevens</a> and his
<a href="http://crazedmonkey.com/ttcgooglemap/">TTC Subway Google Map</a>.</p>
Linking, not copying, the script has its advantages, namely that any changes or additions that I make will propagate to your map. There are also a few known bugs, all of which have to do with Internet Explorer, that I hope to address soon.
August 2, 2005 at 1:56 am
Hi, good work on the TTC Google map. I’d love to be able to overlay that on Google maps of th GTA, since I am new to the area and looking for a transit-friendly place to live. Any tips on the subject?
Thanks again …
August 2, 2005 at 10:48 am
Google does currently support overlaying of third-party information over a map generated by a Google Maps search and their Google Maps API does not provide search functionality. My code is really intended for sites who wish to hard-code locations on a map and who wish to include the subway on that map.
August 3, 2005 at 3:34 pm
Hi Ian- We added the subway lines to our map (see my Homepage) – but we can’t seem to get the icons displayed (although their shadows are appearing). Any thoughts on what might be causing this?
August 3, 2005 at 5:53 pm
If the shadows are being displayed then the markers are being drawn. It’s possible that the image file is not being loaded, although its full-path is set for the icon image. If you click on the shadow to bring up the textbox, what do you see?
I’ll see if I can replicate this.
August 3, 2005 at 5:57 pm
Sorry, just answered my own question. The large icon does not show either, although that is because the pop-up text is not styled as such.
August 3, 2005 at 8:36 pm
OK, this is fixed. The problem was that your createMarker() function was overriding my createMarker() function. I have since prepended all my methods with “CM_” to avoid this possibility.
September 20, 2005 at 12:07 pm
Just wanted to say very nice work using google’s map api. I’ve been very frustrated by the brutal rideguide pdf the ttc supplies, and read about a site that implemented google’s api for the new york subway system ’bout a month ago. Finally google maps + ttc == true, end sub.
November 8, 2005 at 11:43 am
Nice work! :)
Just an additional note: It would be very cool if this was overlayed onto housingmaps.com (craigslist – Toronto, etc.)!
Nonetheless great work.
November 17, 2005 at 2:13 pm
Any chance you could add the Toronto area go train stations to this map?
Then you’d have a really good idea of all your commuting options.
July 7, 2006 at 4:39 pm
very cool and useful. i just used it to show a friend from out of town how to get to my place. thanks.
one request would be to be able to resize the portion containing the map itself. the map only takes up about a quarter of my screen.
again, thanks.
August 2, 2006 at 8:57 pm
Good job.
TTC’s own embarassing hack of a website can sure learn something here.
I was actually looking for a full transit map: street cars and buses etc and all they have is a huge unworkable PDF.
What we need is a page that lets you get transit directions for getting from point a to point b like google maps does, but with transit.
This is of course a bit more complex problem.
May be they can hire you to fix them up.
January 11, 2007 at 1:39 am
When will you release a free version of your newly updated map?
January 11, 2007 at 2:17 pm
Sorry, the new map will not be available to be placed on other people’s webpages.
January 11, 2007 at 4:42 pm
by the way, looking at the links in the comments, and trying the code on a blank page, it is not working. Any idea what I am doing wrong?
January 12, 2007 at 1:48 am
Econojon, is a Google map showing up? If not, you may need a Google Maps key. Is your page online so that I can have a look at it and see what else might be the problem?
January 14, 2007 at 7:37 pm
ok, I got it working now. Thanks! :D
June 12, 2007 at 1:54 pm
Hi,
I really like your TTC map, came in really handy the other day of the big rain storm.
Are you familiar with google mapplets? Here is a link. You might be able to make your ttc map a mapplet that can be added as a new option.
http://maps.google.com/maps/mm?mapprev=1