TanchoToplineCargo/public/topCargo/assets/js/map-helper.js
2024-05-05 10:32:49 +05:45

147 lines
3.6 KiB
JavaScript

"use strict"; // Start of use strict
// 7. google map
function gMap () {
if ($('.google-map').length) {
$('.google-map').each(function () {
// getting options from html
var Self = $(this);
var mapName = Self.attr('id');
var mapLat = Self.data('map-lat');
var mapLng = Self.data('map-lng');
var iconPath = Self.data('icon-path');
var mapZoom = Self.data('map-zoom');
var mapTitle = Self.data('map-title');
var markers = Self.data('markers');
// defined default style
var styles = [
{
"featureType": "administrative",
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#444444"
}
]
},
{
"featureType": "landscape",
"elementType": "all",
"stylers": [
{
"color": "#f2f2f2"
}
]
},
{
"featureType": "poi",
"elementType": "all",
"stylers": [
{
"visibility": "off"
}
]
},
{
"featureType": "road",
"elementType": "all",
"stylers": [
{
"saturation": -100
},
{
"lightness": 45
}
]
},
{
"featureType": "road.highway",
"elementType": "all",
"stylers": [
{
"visibility": "simplified"
}
]
},
{
"featureType": "road.arterial",
"elementType": "labels.icon",
"stylers": [
{
"visibility": "off"
}
]
},
{
"featureType": "transit",
"elementType": "all",
"stylers": [
{
"visibility": "off"
}
]
},
{
"featureType": "water",
"elementType": "all",
"stylers": [
{
"color": "#00baff"
},
{
"visibility": "on"
}
]
}
];
// if zoom not defined the zoom value will be 15;
if (!mapZoom) {
var mapZoom = 15;
};
// init map
var map;
map = new GMaps({
div: '#'+mapName,
scrollwheel: false,
lat: mapLat,
lng: mapLng,
styles: styles,
zoom: mapZoom
});
// if icon path setted then show marker
if(iconPath) {
$.each(markers, function (index, value) {
var index = value;
var html;
if (index[2]) {
html = index[2];
};
if (!index[3]) {
index[3] = iconPath;
};
map.addMarker({
icon: index[3],
lat: index[0],
lng: index[1],
infoWindow: {
content: html
}
});
});
}
});
};
}
// instance of fuction while Document ready event
jQuery(document).on('ready', function () {
(function ($) {
gMap();
})(jQuery);
});