{"id":157,"date":"2017-01-31T18:00:43","date_gmt":"2017-01-31T18:00:43","guid":{"rendered":"http:\/\/tommustester.wpengine.com\/?page_id=157"},"modified":"2017-01-31T18:00:43","modified_gmt":"2017-01-31T18:00:43","slug":"maps","status":"publish","type":"page","link":"https:\/\/radialcircle.com\/index.php\/maps\/","title":{"rendered":"Elements &#8211; Maps"},"content":{"rendered":"<body><p>[vc_row full_width=\u201dstretch_row\u201d][vc_column]\n\t\t\t<section class=\"imagebg image--light cover cover-blocks bg--secondary \" >\n\t\t\t\t<div class=\"background-image-holder\"><img loading=\"lazy\" decoding=\"async\" width=\"3600\" height=\"1762\" src=\"https:\/\/i0.wp.com\/radialcircle.com\/wp-content\/uploads\/2017\/01\/promo-1.jpg?fit=3600%2C1762&amp;ssl=1\" class=\"attachment-full size-full\" alt=\"\" \/><\/div>\n\t\t\t\t<div class=\"container\">\n\t\t\t\t\t<div class=\"row\">\n\t\t\t\t\t\t<div class=\"col-sm-6 col-md-5\">\n\t\t\t\t\t\t\t<div>[vc_column_text]<\/p>\n<h1>Maps<\/h1>\n<p class=\"lead\">These modular elements can be readily used and customized across pages and in different blocks.<\/p>\n<hr class=\"short\">\n<p>Explore all of Stack\u2019s modular elements<br>\nat the\u00a0<a href=\"\/elements\/\">Element Index Page \u2192<\/a>[\/vc_column_text]<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div><!--end of row-->\n\t\t\t\t<\/div><!--end of container-->\n\t\t\t\t\n\t\t\t<\/section>\n\t\t[\/vc_column][\/vc_row][vc_section css=\u201d.vc_custom_1498220876889{padding-top: 0px !important;}\u201d ebor_docs=\u201d\u201d][vc_row css=\u201d.vc_custom_1485825445121{margin-bottom: 30px !important;}\u201d][vc_column width=\u201d5\/12\u2033]<div class=\" boxed--lg bg--secondary  boxed boxed--border\" ><div class=\"container\">[vc_column_text]<\/p>\n<h4>Iframe Map<\/h4>\n<p>Basic iframe maps can be embedded from <a href=\"http:\/\/maps.google.com\" target=\"_blank\" rel=\"noopener\">maps.google.com<\/a>. By default, the iframe map will span 100% the width of the container it is placed inside.<\/p>\n<p><strong>NOTE:<\/strong> Customizing the maps appearance is not available in the iframe embed.<\/p>\n<p>[\/vc_column_text]<\/div><\/div>[\/vc_column][vc_column width=\u201d7\/12\u2033][vc_gmaps link=\u201d#E-8_JTNDaWZyYW1lJTIwc3JjJTNEJTIyaHR0cHMlM0ElMkYlMkZ3d3cuZ29vZ2xlLmNvbSUyRm1hcHMlMkZlbWJlZCUzRnBiJTNEJTIxMW0xOCUyMTFtMTIlMjExbTMlMjExZDQwMjU4Ni44NDcwNDY0ODI2NyUyMTJkMTQ0Ljc3Mjk1NzY4MjIxMDc3JTIxM2QtMzcuOTcyMjM0MjM0Mzc0NTc1JTIxMm0zJTIxMWYwJTIxMmYwJTIxM2YwJTIxM20yJTIxMWkxMDI0JTIxMmk3NjglMjE0ZjEzLjElMjEzbTMlMjExbTIlMjExczB4NmFkNjQ2YjVkMmJhNGRmNyUyNTNBMHg0MDQ1Njc1MjE4Y2NkOTAlMjEyc01lbGJvdXJuZSUyQlZJQyUyMTVlMCUyMTNtMiUyMTFzZW4lMjEyc2F1JTIxNHYxNDcyNTMyNzExOTI4JTIyJTIwJTNFJTNDJTJGaWZyYW1lJTNF\u201d][\/vc_column][\/vc_row][\/vc_section][vc_section][vc_row css=\u201d.vc_custom_1485825445121{margin-bottom: 30px !important;}\u201d][vc_column width=\u201d5\/12\u2033]<div class=\" boxed--lg bg--secondary  boxed boxed--border\" ><div class=\"container\">[vc_column_text]<\/p>\n<h4>Google Maps API<\/h4>\n<p>For a map with more style options, opt for the Google Maps API map. This map requires you to have your own developer API key from Google but opens up more attractive options for embedded maps.<\/p>\n<p>There are a number of data attribute options to customise the behaviour of the map:<\/p>\n<ul class=\"bullets\">\n<li><strong>data-maps-api-key=\u201dApIKeYtExt1234\u2033<\/strong> \u2013 Your Maps API Key, required to use a Google JS API map.<\/li>\n<li><strong>data-address=\u201d123 Address Place, Townsville\u201d<\/strong> \u2013 a simple text address acceptable by Google Maps with up to 10 addresses separated by semicolons.<\/li>\n<li><strong>data-map-zoom=\u201dNUM\u201d<\/strong> \u2013 Sets zoom level between 1 and 12.<\/li>\n<li><strong>data-map-style=\u201dJSON\u201d<\/strong> \u2013 Apply any style from <a href=\"http:\/\/snazzymaps.com\">Snazzy Maps<\/a> or <a href=\"https:\/\/mapstyle.withgoogle.com\/\">make your own<\/a>.<\/li>\n<li><strong>data-marker-title=\u201dTitle Text\u201d<\/strong> \u2013 Text to appear when user hovers over map marker.<\/li>\n<\/ul>\n<p>[\/vc_column_text]<\/div><\/div>[\/vc_column][vc_column width=\u201d7\/12\u2033]<div class=\"map-container \" data-maps-api-key=\"AIzaSyCfo_V3gmpPm1WzJEC9p_sRbgvyVbiO83M\" data-address=\"Goleta, California\" data-marker-title=\"Goleta, California\" data-map-style=\"[{&quot;featureType&quot;:&quot;landscape&quot;,&quot;stylers&quot;:[{&quot;hue&quot;:&quot;#FFBB00&quot;},{&quot;saturation&quot;:43.400000000000006},{&quot;lightness&quot;:37.599999999999994},{&quot;gamma&quot;:1}]},{&quot;featureType&quot;:&quot;road.highway&quot;,&quot;stylers&quot;:[{&quot;hue&quot;:&quot;#FFC200&quot;},{&quot;saturation&quot;:-61.8},{&quot;lightness&quot;:45.599999999999994},{&quot;gamma&quot;:1}]},{&quot;featureType&quot;:&quot;road.arterial&quot;,&quot;stylers&quot;:[{&quot;hue&quot;:&quot;#FF0300&quot;},{&quot;saturation&quot;:-100},{&quot;lightness&quot;:51.19999999999999},{&quot;gamma&quot;:1}]},{&quot;featureType&quot;:&quot;road.local&quot;,&quot;stylers&quot;:[{&quot;hue&quot;:&quot;#FF0300&quot;},{&quot;saturation&quot;:-100},{&quot;lightness&quot;:52},{&quot;gamma&quot;:1}]},{&quot;featureType&quot;:&quot;water&quot;,&quot;stylers&quot;:[{&quot;hue&quot;:&quot;#0078FF&quot;},{&quot;saturation&quot;:-13.200000000000003},{&quot;lightness&quot;:2.4000000000000057},{&quot;gamma&quot;:1}]},{&quot;featureType&quot;:&quot;poi&quot;,&quot;stylers&quot;:[{&quot;hue&quot;:&quot;#00FF6A&quot;},{&quot;saturation&quot;:-1.0989010989011234},{&quot;lightness&quot;:11.200000000000017},{&quot;gamma&quot;:1}]}]\" data-map-zoom=\"15\"><\/div>[\/vc_column][\/vc_row][\/vc_section][vc_row][vc_column][vc_column_text]<\/p>\n<h2 style=\"text-align: center;\">Looking for styled map sections?<\/h2>\n<p style=\"text-align: center;\"><a class=\"btn btn--primary type--uppercase\" href=\"\/sections\/maps\/\">View Map Sections<\/a><\/p>\n<p class=\"type--fine-print\" style=\"text-align: center;\">or try the\u00a0<a href=\"http:\/\/tommusrhodus.theme-demo.net\/stackwordpresstheme\" target=\"_blank\" rel=\"noopener\">admin demo \u2197<\/a><\/p>\n<p>[\/vc_column_text][\/vc_column][\/vc_row]<\/p>\n<\/body>","protected":false},"excerpt":{"rendered":"<p>[vc_row full_width=\u201dstretch_row\u201d][vc_column][\/vc_column][\/vc_row][vc_section css=\u201d.vc_custom_1498220876889{padding-top: 0px !important;}\u201d ebor_docs=\u201d\u201d][vc_row css=\u201d.vc_custom_1485825445121{margin-bottom: 30px !important;}\u201d][vc_column width=\u201d5\/12\u2033][\/vc_column][vc_column width=\u201d7\/12\u2033][vc_gmaps link=\u201d#E-8_JTNDaWZyYW1lJTIwc3JjJTNEJTIyaHR0cHMlM0ElMkYlMkZ3d3cuZ29vZ2xlLmNvbSUyRm1hcHMlMkZlbWJlZCUzRnBiJTNEJTIxMW0xOCUyMTFtMTIlMjExbTMlMjExZDQwMjU4Ni44NDcwNDY0ODI2NyUyMTJkMTQ0Ljc3Mjk1NzY4MjIxMDc3JTIxM2QtMzcuOTcyMjM0MjM0Mzc0NTc1JTIxMm0zJTIxMWYwJTIxMmYwJTIxM2YwJTIxM20yJTIxMWkxMDI0JTIxMmk3NjglMjE0ZjEzLjElMjEzbTMlMjExbTIlMjExczB4NmFkNjQ2YjVkMmJhNGRmNyUyNTNBMHg0MDQ1Njc1MjE4Y2NkOTAlMjEyc01lbGJvdXJuZSUyQlZJQyUyMTVlMCUyMTNtMiUyMTFzZW4lMjEyc2F1JTIxNHYxNDcyNTMyNzExOTI4JTIyJTIwJTNFJTNDJTJGaWZyYW1lJTNF\u201d][\/vc_column][\/vc_row][\/vc_section][vc_section][vc_row css=\u201d.vc_custom_1485825445121{margin-bottom: 30px !important;}\u201d][vc_column width=\u201d5\/12\u2033][\/vc_column][vc_column width=\u201d7\/12\u2033][\/vc_column][\/vc_row][\/vc_section][vc_row][vc_column][vc_column_text] Looking for styled map sections?&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"spay_email":"","footnotes":""},"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/P8yNrc-2x","_links":{"self":[{"href":"https:\/\/radialcircle.com\/index.php\/wp-json\/wp\/v2\/pages\/157"}],"collection":[{"href":"https:\/\/radialcircle.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/radialcircle.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/radialcircle.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/radialcircle.com\/index.php\/wp-json\/wp\/v2\/comments?post=157"}],"version-history":[{"count":0,"href":"https:\/\/radialcircle.com\/index.php\/wp-json\/wp\/v2\/pages\/157\/revisions"}],"wp:attachment":[{"href":"https:\/\/radialcircle.com\/index.php\/wp-json\/wp\/v2\/media?parent=157"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}