<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<script
src="https://maps.googleapis.com/maps/api/js?key=YOUR_MAP_KEY"
async
defer
></script>
<style>
#map {
width: 100%;
height: 400px;
}
</style>
<script>
function initMap() {
const mapOptions = {
center: { lat: 40.37945309944013, lng: 49.851690318048554 },
zoom: 14,
styles: [
{ elementType: "geometry", stylers: [{ color: "#212121" }] },
{ elementType: "labels.icon", stylers: [{ visibility: "off" }] },
{
elementType: "labels.text.fill",
stylers: [{ color: "#757575" }],
},
{
elementType: "labels.text.stroke",
stylers: [{ color: "#212121" }],
},
{
featureType: "administrative",
elementType: "geometry",
stylers: [{ color: "#757575" }],
},
{
featureType: "administrative.country",
elementType: "labels.text.fill",
stylers: [{ color: "#9e9e9e" }],
},
{
featureType: "administrative.land_parcel",
stylers: [{ visibility: "off" }],
},
{
featureType: "administrative.locality",
elementType: "labels.text.fill",
stylers: [{ color: "#bdbdbd" }],
},
{
featureType: "poi",
elementType: "labels.text.fill",
stylers: [{ color: "#757575" }],
},
{
featureType: "poi.park",
elementType: "geometry",
stylers: [{ color: "#181818" }],
},
{
featureType: "poi.park",
elementType: "labels.text.fill",
stylers: [{ color: "#616161" }],
},
{
featureType: "poi.park",
elementType: "labels.text.stroke",
stylers: [{ color: "#1b1b1b" }],
},
{
featureType: "road",
elementType: "geometry.fill",
stylers: [{ color: "#2c2c2c" }],
},
{
featureType: "road",
elementType: "labels.text.fill",
stylers: [{ color: "#8a8a8a" }],
},
{
featureType: "road.arterial",
elementType: "geometry",
stylers: [{ color: "#373737" }],
},
{
featureType: "road.highway",
elementType: "geometry",
stylers: [{ color: "#3c3c3c" }],
},
{
featureType: "road.highway.controlled_access",
elementType: "geometry",
stylers: [{ color: "#4e4e4e" }],
},
{
featureType: "road.local",
elementType: "labels.text.fill",
stylers: [{ color: "#616161" }],
},
{
featureType: "transit",
elementType: "labels.text.fill",
stylers: [{ color: "#757575" }],
},
{
featureType: "water",
elementType: "geometry",
stylers: [{ color: "#000000" }],
},
{
featureType: "water",
elementType: "labels.text.fill",
stylers: [{ color: "#3d3d3d" }],
},
],
};
const map = new google.maps.Map(
document.getElementById("map"),
mapOptions
);
}
</script>
</head>
<body onload="initMap()">
<section class="result-show">
<div id="map"></div>
</section>
</body>
</html>
Digər dildə:
EN