<!--maps js-->
<script src='https://api.mapbox.com/mapbox-gl-js/v2.1.1/mapbox-gl.js'></script>
<script>
mapboxgl.accessToken = 'pk.eyJ1IjoiZGVzaWdubXlsaWZlIiwiYSI6ImNqeHlkMzljejAwaHAzbXFtaXphYWI3NmYifQ.IRPz2gseBSE-DQMzurY4ZA';
var officeLocation = [75.788350, 26.958520];
var map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/light-v10',
center: officeLocation,
zoom: 9
});
// create the popup
var popup = new mapboxgl.Popup({ offset: 18 }).setHTML(
'<h6 class="text-primary mb-0 fw-normal">Our office</h6><small class="text-body-secondary">CreativeDM, SE-03, Vidhyadhar Nagar, Jaipur, 302012</small>'
);
// create DOM element for the marker
var el = document.createElement('div');
el.id = 'marker';
// disable map zoom when using scroll
map.scrollZoom.disable();
// create the marker
new mapboxgl.Marker(el)
.setLngLat(officeLocation)
.setPopup(popup) // sets a popup on this marker
.addTo(map);
</script>