<?php $random = rand(); ?>
<div id="google-map<?php echo esc_attr($random); ?>" class="ombre-flex-video<?php if ($widescreen == 'true') { ?> widescreen<?php } ?>"></div>
<?php if (!empty($markercolor)) { ?>
<style type="text/css">
    #google-map<?php echo esc_attr($random); ?> .pin:after {
        color: <?php echo esc_attr($markercolor); ?>
    }
</style>
<?php } ?>
<script type="text/javascript">
    jQuery(document).ready(function () {
        jQuery("#google-map<?php echo esc_js($random); ?>").dvmap({
            container: 'google-map<?php echo esc_js($random); ?>', // map container id
            latitute: '<?php echo esc_js($latitute); ?>', // latitute
            longitude: '<?php echo esc_js($longitude); ?>', // longtitude
            zoom: <?php echo esc_js($zoom); ?>, // a numeric value between 0-19
            grayscale: <?php echo esc_js($grayscale); ?> // true or false
        });
    });
</script>