My favorites | Sign in
Project Home Issues
New issue   Search
  Advanced search   Search tips   Subscriptions
Issue 37: Create a legend for the map's colors and markers
216 people starred this issue and may be notified of changes. Back to list
Status:  Available
Owner:  ----
Closed:  Mar 2013

Sign in to add a comment
Project Member Reported by, Oct 20, 2010
After setting a style for lines, polygons or markers on the map, a legend should be automatically generated that can be used with the map. 
Dec 6, 2010
I set the style for polygons using "bucket" classifications but no legend was created.  You can view the map I am talking about to see what the end product was.  The legends that appear I created in ArcMap and are not part of the Google FT map.

Dec 8, 2010
Project Member #2
 Issue 135  has been merged into this issue.
Dec 9, 2010
I've written some code to do exactly this...


function initialize() {


// Create the legend
legend = document.createElement('DIV'); = '5px'; = '5px'; = 'white'; = 'solid'; = '2px';
// Create the day/night legend items
legendDay = document.createElement('DIV');
new Legend(legendDay, 'overdag', 'yellow', 'Overdag');
new Legend(legendDay, '\'s nachts', 'blue', '\'s Nachts');
// Create the altitude legend items
legendAlt = document.createElement('DIV');
new Legend(legendAlt, '> 800m', 'red', 'Groter dan 800 meter');
new Legend(legendAlt, '600 - 800m', 'yellow', 'Tussen 600 en 800 meter');
new Legend(legendAlt, '400 - 600m', 'green', 'Tussen 400 en 600 meter');
new Legend(legendAlt, '200 - 400m', 'blue', 'Tussen 200 en 400 meter');
new Legend(legendAlt, '0 - 200m', 'purple', 'kleiner dan 200 meter');
// Append day/night legend to actual legend
legend.index = 1;



function Legend(controlDiv, name, color, title) {
	// Set CSS for the control border
	var controlUI = document.createElement('DIV'); = 'default'; = 'left';
	controlUI.title = title;
	var legendIcon = document.createElement('IMG'); = '4px';
	legendIcon.src = '../../../../images/small_' + color + '.png';
	// Set CSS for the control interior
	var controlText = document.createElement('SPAN'); = 'Arial,sans-serif'; = '12px';
	controlText.innerHTML = name;

This code creates the legend as shown on:

This code generates a legend for different markers, but in a similar way it is possible to generate a legend for lines or polylines...
Jan 4, 2011
Thanks for posting this code! Very helpful.
Status: Accepted
Jan 13, 2011
Project Member #5
This is a bit of bookkeeping for all our feature requests - please excuse the extra email. 
Status: Acknowledged
Jan 18, 2011
Project Member #6
 Issue 204  has been merged into this issue.
Feb 2, 2011
Project Member #7
 Issue 270  has been merged into this issue.
Mar 1, 2011
Stupid question: where do you put this code?
Mar 1, 2011
Hudson, try this link: should show you where to put the code, part of it is within the map initialize() function and part of it not.
Mar 12, 2011
Nice map and legend...but where do I put the code in fusion tables? I can't see an input box for code like this anywhere! Sorry for being dense.
Mar 12, 2011
This is javascript code that you should put in the web page that implements Google Maps v3 API. It's not to be directly used with Fusion Tables.

For more information check the Fusion Tables within the Google Maps v3 API reference here:
Mar 14, 2011
Very interested in creating a screen overlay legend 
Mar 22, 2011
Project Member #14
 Issue 381  has been merged into this issue.
Mar 25, 2011
I'd really like to see a legend for map colors!
May 23, 2011
....AND the legend should allow turning groups on/off....
(see  issue 521 )
May 28, 2011
i interest for making legend from google fusion tables without manually make it.
Jul 12, 2011
If it's not possible to automatically generate a legend for the map from the buckets picked in the Fusion Tables interface, would it be possible to query the Fusion Table through the google.maps.FusionTablesLayer interface to get the thresholds and color values of the bucket?

If I could in javascript get back those values, it would be easy to then build a key automatically.
Jul 12, 2011
Project Member #19
Check out the styling in the FusionTablesLayer. That way you can set the style from javascript, and you'll already know what it is so you can build a key.

Jul 12, 2011
We have a workflow where users work through the Fusion Tables interface to create a map and a set of buckets to style their data, and then copy the table ID into our FusionTablesLayer Google Maps builder tool that creates a map to publish. Trying to avoid as much copy/pasting as possible.
Aug 12, 2011
Project Member #21
(No comment was entered for this change.)
Labels: Tag-Geo
Sep 12, 2011
Project Member #22
(No comment was entered for this change.)
Labels: -Tag-Geo Component-Geo
Sep 13, 2011
Project Member #23
 Issue 794  has been merged into this issue.
Sep 16, 2011
For the Fusion Table icons (  Are these IMAGES hosted anywhere publicly? For use with the code contained in Comment #9

Comment 9 by, Mar 1, 2011

Hudson, try this link: should show you where to put the code, part of it is within the map initialize() function and part of it not.

Sep 17, 2011
Very very usefull if you could implement an "automated way" to insert the legend accordingly the different colored icons. For who like me, does not understand the first thing about coding it would be really really great!!
Sep 17, 2011
I agree with comment 25 - 
Sep 26, 2011
another vote for Comment 25!
Oct 26, 2011
Vote for having a option to insert legend in Fusion Tables without coding.
Oct 26, 2011
I vote in favor! 
Oct 26, 2011
I vote in favor as well!
Oct 27, 2011
obviously you can count on my vote too! :)
Nov 9, 2011
Nov 9, 2011
Jan 1, 2012
Please give those of us who don't understand coding an easy way to include a legend with a map!!!
Feb 6, 2012
the lack of generating a easy legend greatly reduces the usability of fusion tables
Feb 19, 2012
Feb 21, 2012
I'm using column styling set from the color codes in my fusion table. Is is possible to make a legend for the corresponding color columns?
Apr 12, 2012
As a GIS student, or someone who deal with maps, I don't understand how you make a tool for generating maps without a legend. This is a basic component that ought to be on FT without necessarily having to code.How about adding it on FT Layer Builder?
Apr 12, 2012
We use javascript and the Google Chart API Query language to build dynamic legends in a separate map. Here's an example of our zoning (Fusion Tables layer) layer turned on with a legend:|10050&userMarkers=0&mapType=roadmap

Apr 30, 2012
Legend Should be a part of Fussion tables else the map or charts are without essential communications about what the chart or map is about..
Jun 25, 2012
this should be an essential feature, without it, maps are pretty meaningless without digging through the map configuration
Jun 27, 2012
Has anyone ever seen or come up with a tool that will generate code to
build a legend, sort of in the style of the layer builder?
Aug 15, 2012
Would very much like to keep this request alive. Legends are essential for making the map meaningful.
Mar 12, 2013
Any word on automated legend?
Mar 12, 2013
Le 12/03/2013 15:59, a écrit :

If we can choose, it's better. But the legend must be in the Fusion 
table document, not generate with javascript.
Mar 12, 2013
It's good to see it's still an issue for others too. I thought the point of
fusion tables was to enable non-coders to build presentable maps with data.
But it falls down without the legend.
Mar 19, 2013
Project Member #47
I'm happy to announce we have released map legends.

Legends can be configured in the "Change map styles" dialog under "Automatic legend."

Create legends for
  - marker icons using buckets
  - polygon fill colors using buckets or gradients

Configure appearance with
  - title
  - position on the map
  - a link back to your table

The resulting legend appears in
  - your map tab (click to change the map style)
  - embedded maps
  - the generated code in the Publish dialog's HTML/JavaScript section

Status: Available
Mar 19, 2013
Fantastic, thanks so much for this improvement. It's working great for me.
Mar 19, 2013
I have been eagerly awaiting this development and I am grateful for it, but I can't find the "Automatic Legend" option.  Where do I click?  Thanks.
Mar 19, 2013
Oh, I see you need to look at the new layout to see it.  nm I got it now.  Thanks again for adding this feature!
Mar 19, 2013
Thanks for they guys behind it.
Mar 19, 2013
kudos to the guys who made this.
Mar 20, 2013
Le 19/03/2013 21:16, a écrit :
Mar 21, 2013
I'm having troubles getting the legend to this because I'm using a column based market format?  Also, what is the "include a link to this table" for?
Mar 21, 2013
Project Member #55
As mentioned in the announcement, legends only apply to bucket and gradient styles. 

The link back to the table allows viewers of embedded maps to easily see the source data.
Mar 21, 2013
Any plans to include an automatic legend function for the column based market format?

Mar 21, 2013
Project Member #57
> Any plans to include an automatic legend function for the column based market format?

It's hard to generate a legend automatically from a column-based style. We'd have to go through all the rows and try understand how the styles relate to the data values. That relationship could be anything at all, not just a range.

That said, I would encourage you to open a new feature request for this. But automatic generation is unlikely to happen, so some other approach will be required.
Mar 22, 2013
I will do that, maybe a better approach is to allow the user to assign "label" names to each marker from which a legend is generated.  Many of our maps identify groups of schools that are all part of a program.  I'd like to be able to identify these in a legend.
Mar 25, 2013
Same situation than #58. It will be great if we can change/edit legend label so it can appear to be mere relevant for the user. So, for example, they don't have to know that "1 to 1.5" means in fact "french school"
Apr 8, 2013
Excellent! Thanks. It's working great.
Sign in to add a comment

Powered by Google Project Hosting