Skip to content

Instantly share code, notes, and snippets.

@raselahmed7
Created April 25, 2017 11:23
Show Gist options
  • Save raselahmed7/e233c308d5bf354c9d174f80a30c6b6a to your computer and use it in GitHub Desktop.
Save raselahmed7/e233c308d5bf354c9d174f80a30c6b6a to your computer and use it in GitHub Desktop.
<?php
function stock_styled_map_shortcode($atts, $content = null) {
extract( shortcode_atts( array(
'lat' => '40.7433379',
'lng' => '-74.0103219',
'title' => 'Head Office',
'desc' => 'House 21, Grand St.<br/> New York, USA',
'height' => '500',
), $atts) );
$dynamic_map_id = rand(42587942, 382947283);
$stock_styled_map_markup = '
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD7CQl6fRhagGok6CzFGOOPne2X1u1spoA&region=US"></script>
<div style="width:100%;height:'.$height.'px" id="stock-map-'.$dynamic_map_id.'"></div>
<script>
jQuery(document).ready(function($) {
var stockmap'.$dynamic_map_id.' = {lat: '.$lat.', lng: '.$lng.'};
$("#stock-map-'.$dynamic_map_id.'")
.gmap3({
center: stockmap'.$dynamic_map_id.',
zoom:15,
scrollwheel: false,
mapTypeId: "shadeOfGrey",
})
.marker({
position: stockmap'.$dynamic_map_id.',
icon: "'.plugin_dir_url( __FILE__ ).'../assets/img/marker.png"
})
.infowindow({
position: stockmap'.$dynamic_map_id.',
content: "<h4>'.$title.'</h4>'.$desc.'",
pixelOffset: new google.maps.Size(0,-20)
})
.then(function (infowindow) {
infowindow.open(this.get(0)); // this.get(0) return the map (see "get" feature)
})
.styledmaptype(
"shadeOfGrey",
[
{"featureType":"all","elementType":"labels.text.fill","stylers":[{"saturation":36},{"color":"#909090"},{"lightness":40}]},
{"featureType":"all","elementType":"labels.icon","stylers":[{"visibility":"off"}]},
{"featureType":"administrative","elementType":"geometry.fill","stylers":[{"color":"#f7f7f7"},{"lightness":20}]},
{"featureType":"administrative","elementType":"geometry.stroke","stylers":[{"color":"#f7f7f7"},{"lightness":17},{"weight":1.2}]},
{"featureType":"landscape","elementType":"geometry","stylers":[{"color":"#f7f7f7"},{"lightness":20}]},
{"featureType":"poi","elementType":"geometry","stylers":[{"color":"#f7f7f7"},{"lightness":21}]},
{"featureType":"road.highway","elementType":"geometry.fill","stylers":[{"color":"#ffffff"},{"lightness":17}]},
{"featureType":"road.highway","elementType":"geometry.stroke","stylers":[{"color":"#ffffff"},{"lightness":29},{"weight":0.2}]},
{"featureType":"road.arterial","elementType":"geometry","stylers":[{"color":"#ffffff"},{"lightness":18}]},
{"featureType":"road.local","elementType":"geometry","stylers":[{"color":"#ffffff"},{"lightness":16}]},
{"featureType":"transit","elementType":"geometry","stylers":[{"color":"#ffffff"},{"lightness":19}]},
{"featureType":"water","elementType":"geometry","stylers":[{"color":"#ededed"},{"lightness":17}]}
],
{name: "Shades of Grey"}
);
});
</script>
';
return $stock_styled_map_markup;
}
add_shortcode('stock_styled_map', 'stock_styled_map_shortcode');
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment