Share/Bookmark

You are here: > Home > Sidetracking - cycle buying, maintenance, mapping, health... > How to Draw Google Map Lines to Show Routes

I can't answer programming questions, but these specialists can - ask Tech Support now.

Ordnance Survey maps image

Visit Ordnance Survey for maps and outdoor essentials for all activities

Family Mobile logo

Save at least 25% on Pay As You Go calls compared to Orange, O2, T-mobile and Vodafone, using Family Mobile's SIM card.

How to Draw Google Map Lines to Show Routes

View or add comments on this page

Welcome to Cheshire Cycleway's simplified digitiser for showing a route on a Google map.

  1. Select the XHTML option.
  2. Use the map controls (top left corner of map) to zoom in and out as required.

  3. Find the area of the world to concentrate on.

  4. Click on the map to start drawing a line, then click along the route at intervals. Code will build up in the panel to the right of the map.

  5. Once you've completed the route, click in the panel to highlight all the code for copying, pasting and saving as an HTML file.

  6. Select the PolyLine option to add extra code blocks to this file, pasting it into the file on a new line anywhere between the labels '//START PolyLine code block' and '//END PolyLine code block'.

  7. See tips for use below the map.

Draw mode:

XHTML page and polyLine co-ordinates code block

PolyLine co-ordinates code block   


Tips:

If the route you plan to draw has a lot of co-ordinates, chop the route into convenient sections. About 50 co-ordinates/section is easy to re-draw if you need to modify the route.


Label each line block using two back slashes // (JavaScript comments code) before the label.

Example: //Beginning of Bank St to the A50 junction


Don't forget, you can change the line colour, line weight and line opacity of each line block


The coding produced for your webpage will validate as a XHTML 1.0 Strict document. So any other text and coding that you add is best written using XHTML coding conventions. XHTML is required for the map to work correctly.

I can't answer programming questions, but these specialists can - ask Tech Support now.

Comments

  1 Ruben    17 Jan 2009 15.08.41

Hey man, thanks for the handy tool. Much appreciated

  2 Sam Dean    26 Feb 2010 22.25.02

Good solution thanks

  3 caio    02 Jun 2010 15.19.36

Handy tool, but it would be easier if I could search for cities or streets.


Comment on 'How to Show Cycle/Other Routes on a Google Map'

  Email address

  Name

  Website  (optional)

Type into the empty box (below) the four letters you can see.

If the letters are difficult to read, click on the blue arrows for a new set.



Privacy statement:

The name you give with your comment will be displayed on this page, with a link to a website if given. Your email address is not displayed and is required only for moderation purposes. We do not pass on your personal information to anyone else.


Jessops for cycling

Free delivery by DHL and many discounts on cameras such as Canon kits and Fuji, plus other photo equipment - also discount voucher codes.

  • Free delivery
  • Camera cashback/discounts
  • Photo equipment discounts
Wiggle Online Cycle Shop logo

Wiggle cycles

Cycle gear