| Common properties | |
|---|---|
| width | The width of the map in pixels (e.g. '700'). Height is adjusted automatically. 'responsive' will make the map width responsive. |
| height | Set a fixed height of the map (e.g. '300'). 'auto' by default. If width is responsive, map will be centered. If width is 'auto', width will be set using fixed aspect ratio. |
| background_color | The color of the background. White by default. |
| background_image_url | Use an image for the background. The image will expand to fit mapinfo.initial_view unless main_settings.background_image_bbox is set. |
| background_transparent | Makes it possible to see content behind the map. ['yes', 'no'] |
| popups | 'detect' - the map automatically detects mobile devices and shows them pop-ups on click and generates a link to the defined url.
'on_hover' - pop-ups always appear on hover. 'on_click' - pop-ups always appear on click. 'off' - pop-ups never appear. |
Note: Depending on the map, state could refer to a state, province or country.
| State defaults (can be overwritten for individual states) | |
|---|---|
| state_color | Default color of states. (e.g. 'blue' or '#0000FF') |
| state_hover_color | Default color of states upon hover or 'off'. (e.g. 'darkblue' or '#000066') |
| state_description | Default description for states. This will fill up the popup and can include HTML/CSS. |
| state_url | Default url when states are clicked. (e.g. 'http://simplemaps.com') |
| all_states_inactive | If "yes" all states are inactive by default. This means hovering or clicking on a state has no effect. |
| border_size | The width of the stroke for state borders. 1.5 by default. It is often desirable to change this property if you make the map much larger or smaller than it's default settings. |
| border_hover_size | The width of the stroke for state borders upon hover. Defaults to border_size value. |
| border_color | Color of state borders. White by default. If the border color is the same as state_color it will not be possible to distinguish individual state boundaries. |
| border_hover_color | Color of state borders upon hover. Defaults to border_color value. |
| state_image_url | The url of the background image. Related state-specific properties can also be made defaults by prefixing them with 'state_'. |
| Note: States can only be pulsed via the API. | |
| state_pulse_size | The magnitude of the pulse. '4' by default. |
| state_pulse_speed | The speed of the pulse in seconds. '.5' by default. |
| state_pulse_color | The colorof the pulse. Defaults to state border color. |
| Location defaults (can be overwritten for individual locations) | |
|---|---|
| location_color | Default color of locations. (e.g. 'blue' or '#0000FF') |
| location_hover_color | Default color of locations upon hover. (e.g. 'blue' or '#0000FF') |
| location_description | Default description for locations. This will fill up the popup and can include HTML/CSS. |
| location_url | Default url when locations are clicked. (e.g. 'http://simplemaps.com') |
| location_size | The width of location squares. 12 by default. |
| location_type | Shape of location markers. ['square', 'circle'] | location_image_url | If location_type is set to 'image', this is the url where the image resides [e.g. 'http://simplemaps.com/images/frog.png']. |
| location_opacity | The opacity of the location. [0-1] |
| location_hover_opacity | The opacity of the location upon hover. [0-1] |
| location_border_color | Default color of location borders. (e.g. 'white') |
| location_border | Size of location border. (e.g. 2) |
| location_pulse | If 'yes', locations will pulse. |
| location_pulse_size | The magnitude of the pulse. '4' by default. |
| location_pulse_speed | The speed of the pulse in seconds. '.5' by default. |
| location_hover_border | Size of location border upon hover. (e.g. 2.5) |
| all_locations_inactive | If "yes" all locations are inactive by default. This means hovering or clicking on a location has no effect. |
| all_locations_hidden | If "yes" all locations are hidden by default. |
| custom_shapes | You can expand the number of location shapes by creating this dictionary of SVG paths. Each path should be contained within a 1mm square box. Example: {diamond: "M 0,-0.5 -0.4,0 0,0.5 0.4,0 Z"} |
| Label defaults (can be overwritten for individual labels) | |
|---|---|
| label_color | Default color of labels. (e.g. 'white' or '#FFFFFF') |
| label_hover_color | Default color of labels upon hover. (e.g. 'blue' or '#0000FF') |
| label_font | Default font family for labels (e.g. 'Arial') |
| hide_labels | When 'yes', labels will be hidden by default |
| hide_eastern_labels | When 'yes', labels on the East Coast of the US map will be hidden. Only works with US map. |
| Zoom Settings | |
|---|---|
| manual_zoom | 'yes' adds zooming buttons and panning support to the map. |
| zoom | 'yes' enables zooming based off of default regions. 'no' means that default regions will be ignored. |
| all_states_zoomable | When set to 'yes', clicking on a state will zoom into that state instead of redirecting the page to the url. 'no' by default. |
| back_image_url | Use an image url instead of back arrow for zooming out. (e.g. 'no' or 'back.png') |
| back_image | Use image in images_directory instead of back arrow for zooming out. (e.g. 'no' or 'back.png') |
| initial_zoom | The region the map start zoomed in to. '-1' is zoomed out. |
| initial_zoom_solo | 'yes' hides the back arrow and adjacent continents when initial_zoom is not -1. |
| initial_back | This property accepts JavaScript. When set, the back button will appear even when the map is fully zoomed out. Clicking on the button will execute this JavaScript. e.g. 'javascript: alert("You clicked the back button")',. Useful for linking maps. |
| navigation_size | The width of the back arrow and zoom buttons 40 by default. |
| navigation_color | The color of the back arrow and zoom buttons. |
| navigation_border_color | The color of the border of the back arrow and zoom buttons. |
| arrow_color | The color of the back arrow that can be clicked to zoom out. Inherits from navigation_color |
| arrow_border_color | The color of the back arrow's border. Inherits from navigation_border_color |
| zoom_out_incrementally | If 'no' clicking the back button will zoom all the way out. If 'yes', clicking the back button will zoom out to the previous level. |
| zoom_percentage | The percentage of the canvas that a zoomed region or state should take up. (e.g. '.9', would create a 10% border around the zoomed state/region) |
| region_opacity | Default opacity of regions (default '1') |
| region_hover_opacity | Opacity of regions when hovered over (default'.6') |
| adjacent_opacity | Opacity of adjacent states when zoomed in on a state or region. (e.g. '.3') |
| zoom_time | The time in seconds to fly from one region/state to another during zooming. (e.g. '.5') |
| zoom_mobile | Whether zooming on mobile devices should be smooth (instead of snapping to last frame). 'yes' by default. |
| Miscellaneous properties | |
|---|---|
| div | The id of the div that will be replaced by the map when the page loads. 'map' by default. |
| url_new_tab | 'no' open urls in the same window. 'yes' open urls in new tab. |
| auto_load | 'yes' means the map will load itself automatically. 'no' prevents the map from loading unless it is loaded manually using the JavaScript API. |
| images_directory | The map will typically look for a map_images folder in the same directory as the usmap.js/worldmap.js file. If you'd like this directory to exist somewhere else, you can specify it's location here. Must end with /. e.g. ('http://yoursite.com/map_images/') |
| fade_time | The time in seconds it takes for hovered colors to return to their default color after the mouse leaves them. (e.g. .1) |
| link_text | When mobile users click on a state they first see the description on must click this text to go to the defined url. '(Link)' by default. |
| location_popups | Override popups for locations. |
| state_popups | Override popups for states. |
| rotate | Rotate the map's states and locations using degrees. (e.g. 90). |
| import_labels | Whether to use the map's default labels. 'yes' by default to support older customizations. Use 'no' for version 3.6+ and edit labels via mapdata object. |
| scale_limit | Point at which labels and locations should stop scaling so that they can be more easily clicked. Expressed as a fraction of the initial_view width. 0.125 by default. |
| Pop-up/tooltip styling (customize the look of the pop-ups) | |
|---|---|
| popup_color | The color of the pop-up background. 'white' by default. |
| popup_opacity | The opacity of the pop-up. .9 by default. 1 is opaque. 0 is transparent. [0-1]. |
| popup_shadow | The size of the pop-up drop shadow. 1 by default. 0 removes the drop shadow. 2 would double the size of the default drop shadow. Note: IE 7 and 8 are unable to show the drop shadow. |
| popup_corners | The radius of the rounded corners. 5 by default. 0 will make the pop-ups rectangles. Note: IE 7 and 8 do not support rounded corners and will always show rectangular pop-ups. |
| popup_font | The default font for the pop-up. '12px/1.5 Verdana, Arial, Helvetica, sans-serif' by default. |
| popup_nocss | 'yes' turns off all css for the pop-up. You must then set your own css styles. |
| popup_orientation | The position of the popup relative to the cursor. 'auto' by default moves the popup towards the middle of the map and away from the cursor. 'below' or 'above' are also options. |
| popup_centered | Whether 'on_click' popups should be centered. 'auto' by default centers popups if the map is less than 400px wide. Makes the map more useable on mobile devices. 'yes' and 'no' are also options. |
| Keyboard Navigation(for accessibility and ease of use) | |
|---|---|
| keyboard_navigation | Whether the map should be navigatable by keyboard through dropdowns. 'yes', 'no', 'auto'. 'auto' is default and shows dropdowns when the map is tabbed over. |
| keyboard_omit | Whether specific dropdowns should be omitted. ['navigate', 'locations', 'states', 'regions']. (e.g. 'states regions'). |
Home | License | Privacy | Releases | Testimonials | Resources | Documentation | Order Lookup | All Maps | FAQs
Formerly FlashUSAmap.com and FlashWorldMap.com
SimpleMaps.com is a product of Pareto Software, LLC. © 2010-2024.