{"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:\/\/cogs.iitgn.ac.in\/newcogs\/elements\/maps\/","title":{"rendered":"Elements &#8211; Maps"},"content":{"rendered":"<p>[vc_row full_width=&#8221;stretch_row&#8221;][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=\"2560\" height=\"1253\" src=\"https:\/\/cogs.iitgn.ac.in\/newcogs\/wp-content\/uploads\/2017\/01\/promo-1-scaled.jpg\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/cogs.iitgn.ac.in\/newcogs\/wp-content\/uploads\/2017\/01\/promo-1-scaled.jpg 2560w, https:\/\/cogs.iitgn.ac.in\/newcogs\/wp-content\/uploads\/2017\/01\/promo-1-300x147.jpg 300w, https:\/\/cogs.iitgn.ac.in\/newcogs\/wp-content\/uploads\/2017\/01\/promo-1-1024x501.jpg 1024w, https:\/\/cogs.iitgn.ac.in\/newcogs\/wp-content\/uploads\/2017\/01\/promo-1-768x376.jpg 768w, https:\/\/cogs.iitgn.ac.in\/newcogs\/wp-content\/uploads\/2017\/01\/promo-1-1536x752.jpg 1536w, https:\/\/cogs.iitgn.ac.in\/newcogs\/wp-content\/uploads\/2017\/01\/promo-1-2048x1002.jpg 2048w, https:\/\/cogs.iitgn.ac.in\/newcogs\/wp-content\/uploads\/2017\/01\/promo-1-600x294.jpg 600w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><\/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&#8217;s 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=&#8221;.vc_custom_1498220876889{padding-top: 0px !important;}&#8221; ebor_docs=&#8221;&#8221;][vc_row css=&#8221;.vc_custom_1485825445121{margin-bottom: 30px !important;}&#8221;][vc_column width=&#8221;5\/12&#8243;]<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=&#8221;7\/12&#8243;][vc_gmaps link=&#8221;#E-8_JTNDaWZyYW1lJTIwc3JjJTNEJTIyaHR0cHMlM0ElMkYlMkZ3d3cuZ29vZ2xlLmNvbSUyRm1hcHMlMkZlbWJlZCUzRnBiJTNEJTIxMW0xOCUyMTFtMTIlMjExbTMlMjExZDQwMjU4Ni44NDcwNDY0ODI2NyUyMTJkMTQ0Ljc3Mjk1NzY4MjIxMDc3JTIxM2QtMzcuOTcyMjM0MjM0Mzc0NTc1JTIxMm0zJTIxMWYwJTIxMmYwJTIxM2YwJTIxM20yJTIxMWkxMDI0JTIxMmk3NjglMjE0ZjEzLjElMjEzbTMlMjExbTIlMjExczB4NmFkNjQ2YjVkMmJhNGRmNyUyNTNBMHg0MDQ1Njc1MjE4Y2NkOTAlMjEyc01lbGJvdXJuZSUyQlZJQyUyMTVlMCUyMTNtMiUyMTFzZW4lMjEyc2F1JTIxNHYxNDcyNTMyNzExOTI4JTIyJTIwJTNFJTNDJTJGaWZyYW1lJTNF&#8221;][\/vc_column][\/vc_row][\/vc_section][vc_section][vc_row css=&#8221;.vc_custom_1485825445121{margin-bottom: 30px !important;}&#8221;][vc_column width=&#8221;5\/12&#8243;]<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=&#8221;ApIKeYtExt1234&#8243;<\/strong> &#8211; Your Maps API Key, required to use a Google JS API map.<\/li>\n<li><strong>data-address=&#8221;123 Address Place, Townsville&#8221;<\/strong> &#8211; a simple text address acceptable by Google Maps with up to 10 addresses separated by semicolons.<\/li>\n<li><strong>data-map-zoom=&#8221;NUM&#8221;<\/strong> &#8211; Sets zoom level between 1 and 12.<\/li>\n<li><strong>data-map-style=&#8221;JSON&#8221;<\/strong> &#8211; 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=&#8221;Title Text&#8221;<\/strong> &#8211; Text to appear when user hovers over map marker.<\/li>\n<\/ul>\n<p>[\/vc_column_text]<\/div><\/div>[\/vc_column][vc_column width=&#8221;7\/12&#8243;]<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","protected":false},"excerpt":{"rendered":"<p>[vc_row full_width=&#8221;stretch_row&#8221;][vc_column][\/vc_column][\/vc_row][vc_section css=&#8221;.vc_custom_1498220876889{padding-top: 0px !important;}&#8221; ebor_docs=&#8221;&#8221;][vc_row css=&#8221;.vc_custom_1485825445121{margin-bottom: 30px !important;}&#8221;][vc_column width=&#8221;5\/12&#8243;][\/vc_column][vc_column width=&#8221;7\/12&#8243;][vc_gmaps link=&#8221;#E-8_JTNDaWZyYW1lJTIwc3JjJTNEJTIyaHR0cHMlM0ElMkYlMkZ3d3cuZ29vZ2xlLmNvbSUyRm1hcHMlMkZlbWJlZCUzRnBiJTNEJTIxMW0xOCUyMTFtMTIlMjExbTMlMjExZDQwMjU4Ni44NDcwNDY0ODI2NyUyMTJkMTQ0Ljc3Mjk1NzY4MjIxMDc3JTIxM2QtMzcuOTcyMjM0MjM0Mzc0NTc1JTIxMm0zJTIxMWYwJTIxMmYwJTIxM2YwJTIxM20yJTIxMWkxMDI0JTIxMmk3NjglMjE0ZjEzLjElMjEzbTMlMjExbTIlMjExczB4NmFkNjQ2YjVkMmJhNGRmNyUyNTNBMHg0MDQ1Njc1MjE4Y2NkOTAlMjEyc01lbGJvdXJuZSUyQlZJQyUyMTVlMCUyMTNtMiUyMTFzZW4lMjEyc2F1JTIxNHYxNDcyNTMyNzExOTI4JTIyJTIwJTNFJTNDJTJGaWZyYW1lJTNF&#8221;][\/vc_column][\/vc_row][\/vc_section][vc_section][vc_row css=&#8221;.vc_custom_1485825445121{margin-bottom: 30px !important;}&#8221;][vc_column width=&#8221;5\/12&#8243;][\/vc_column][vc_column width=&#8221;7\/12&#8243;][\/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":33,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-157","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/cogs.iitgn.ac.in\/newcogs\/wp-json\/wp\/v2\/pages\/157","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cogs.iitgn.ac.in\/newcogs\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cogs.iitgn.ac.in\/newcogs\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cogs.iitgn.ac.in\/newcogs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cogs.iitgn.ac.in\/newcogs\/wp-json\/wp\/v2\/comments?post=157"}],"version-history":[{"count":0,"href":"https:\/\/cogs.iitgn.ac.in\/newcogs\/wp-json\/wp\/v2\/pages\/157\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/cogs.iitgn.ac.in\/newcogs\/wp-json\/wp\/v2\/pages\/33"}],"wp:attachment":[{"href":"https:\/\/cogs.iitgn.ac.in\/newcogs\/wp-json\/wp\/v2\/media?parent=157"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}