<script async="async" defer="defer" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDIJCYRiPRSgn9m3f0Tkd3bLONW3COB_7I&callback=initMap&libraries=geometry"></script>
<script>
var map, map2;
var centerMap = {
lat: <?php echo get_field( 'доставка' )['lat'] ?>,
lng: <?php echo get_field( 'доставка' )['lng'] ?>
};
var centerMap2 = {
lat: <?php echo get_field( 'самовывоз' )['lat'] ?>,
lng: <?php echo get_field( 'самовывоз' )['lng'] ?>
};
function circlePath(center, radius, points,reverse=false){
var a=[],p=360/points,d=0;
for(var i=0;i<points;++i,d+=p){
a.push(google.maps.geometry.spherical.computeOffset(center,radius,d));
}
return a;
}
function initMap() {
var styles = [
{
"featureType": "administrative",
"elementType": "all",
"stylers": [
{
"visibility": "simplified"
}
]
},
{
"featureType": "landscape",
"elementType": "geometry",
"stylers": [
{
"visibility": "simplified"
},
{
"color": "#fcfcfc"
}
]
},
{
"featureType": "poi",
"elementType": "geometry",
"stylers": [
{
"visibility": "simplified"
},
{
"color": "#fcfcfc"
}
]
},
{
"featureType": "road.highway",
"elementType": "geometry",
"stylers": [
{
"visibility": "simplified"
},
{
"color": "#dddddd"
}
]
},
{
"featureType": "road.arterial",
"elementType": "geometry",
"stylers": [
{
"visibility": "simplified"
},
{
"color": "#dddddd"
}
]
},
{
"featureType": "road.local",
"elementType": "geometry",
"stylers": [
{
"visibility": "simplified"
},
{
"color": "#eeeeee"
}
]
},
{
"featureType": "water",
"elementType": "geometry",
"stylers": [
{
"visibility": "simplified"
},
{
"color": "#dddddd"
}
]
}
];
// var styledMap = new google.maps.StyledMapType(styles, {name: "Styled Map"});
map = new google.maps.Map(document.getElementById('map'), {
zoom: 8,
center: centerMap,
});
var infowindow = new google.maps.InfoWindow({
content: "<?php echo get_field( 'доставка' )['address'] ?>"
});
var marker = new google.maps.Marker({
position: centerMap,
map: map
});
marker.addListener('click', function() {
infowindow.open(map, marker);
});
// map.mapTypes.set('map', styledMap);
// map.setMapTypeId('map');
circle1 = circlePath(new google.maps.LatLng(centerMap),20000,360);
circle2 = circlePath(new google.maps.LatLng(centerMap),40000,360);
circle3 = circlePath(new google.maps.LatLng(centerMap),60000,360);
circle4 = circlePath(new google.maps.LatLng(centerMap),80000,360);
polygon_c1 = new google.maps.Polygon({
map:map,
fillColor: '#FF0000',
fillOpacity: 0.20,
strokeWeight: 1,
strokeOpacity: 0.20,
paths: [circle1],
});
polygon_c2 = new google.maps.Polygon({
map:map,
fillColor: '#FFFF00',
fillOpacity: 0.20,
strokeWeight: 1,
strokeOpacity: 0.20,
paths: [circle2, circle1.reverse()],
});
polygon_c3 = new google.maps.Polygon({
map:map,
fillColor: '#00FF00',
fillOpacity: 0.20,
strokeWeight: 1,
strokeOpacity: 0.20,
paths: [circle3, circle2.reverse()],
});
polygon_c4 = new google.maps.Polygon({
map:map,
fillColor: '#00FFFF',
fillOpacity: 0.20,
strokeWeight: 1,
strokeOpacity: 0.20,
paths: [circle4, circle3.reverse()],
});
map2 = new google.maps.Map(document.getElementById('map2'), {
zoom: 14,
center: centerMap2,
});
var infowindow2 = new google.maps.InfoWindow({
content: "<?php echo get_field( 'самовывоз' )['address'] ?>"
});
var marker2 = new google.maps.Marker({
position: centerMap2,
map: map2
});
marker2.addListener('click', function() {
infowindow2.open(map2, marker2);
});
// map2.mapTypes.set('map2', styledMap);
// map2.setMapTypeId('map2');
}
</script>
