Labels | Documentation

Labels have already been added to US, North America, and Canada maps. You can edit these, or add labels to any other map you wish. Labels must be attached to either a region, a state or a location. They will share hover and click events with their parent.

Label Properties (these overwrite the properties in the main settings)
name The name of the label.
x The x coordinate of the label. Generate with online tool or manually.
y The y coordinate of the label. Generate with online tool or manually.
parent_type The type of the parent. ['state', 'region', 'location']
parent_id The id of the parent. (e.g. '0')
hide 'yes' makes the label invisible.
line 'yes' creates a line to the parent. Lines can now be used at all display levels.
line_x Overwrite the line destination's x value.
line_y Overwrite the line destination's y value.
line_color If a line exists, the color of the line. (e.g. 'black' or '#000000')
line_size If a line exists, the width of the line's stroke. 1 by default.
anchor The orientation of the text relative to the x/y coordinate. ('start', 'middle', 'end')
pill If 'yes', and the parent is a state, the label will have a pill with the same color as the parent.
width Only relevant if pill:'yes',. This is the width of the pill. If not specified, the pill will grow to fit the label.
font The font family for the label. (e.g. 'Arial')
size The size of the label font in pixels
color The color of the label. (e.g. 'black' or '#000000')
hover_color The color of the label upon hover. (e.g. 'black' or '#000000')
scale If 'yes' the label's size will remain constant as the map zooms. 'no' by default.
display Determines when the label will be visible. Options are: 'all', 'out', 'region', 'state'. Use of a zoom ratio [0-1], is also permitted. In the case of '.25', a label would be visible when the map had zoomed in such that the viewbox width was less than 25% of the initial view's width.

Easily create labels with our online tool

It's now easy to create labels using our online map editor. Just click on Generate Labels and choose on of the options:

Choices Description
Get x,y from parent This will loop over all of the labels you've created and replace any blank x/y coordinates with its best guess of the optimal label placement.
Add a label to the center of each state This will create a label for each state in the mapdata.js file.
Add a label to the center of each state This will create a label for each location the mapdata.js.
Add labels by click This will put the map in special mode where every first click selects a state/location and every second click creates a label at the clicked the spot for the selected state/location.

Home | License | Privacy | Releases | Testimonials | Resources | Documentation | Order Lookup | All Maps
Formerly FlashUSAmap.com and Flashworldmap.com
© Simplemaps.com 2010-2017