Generic Google Map Example with Markers

by Arsen

HTML

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3&key=AIzaSyDaKJ6LhqFSI7XAad1CtCZGOUojOtKP3WU"></script>
<style>
html, 
body {
    height: 100%;
}
body {
    margin: 0;
    padding: 0;
    font: 12px sans-serif;
    display: flex;
    min-height:800px;
}

h1,
p {
    margin: 0;
    padding: 0;
}

#geocode input {
    height: 2em;
    margin: 2px;
    float: left;
    display: inline-block;
}

#geocode {
    border: #f03 4px dashed;
    background: #cacaca;
    padding: 15px;
    position:fixed;
}

#out {
    font: monospace;
    height: 100%;
    width: 39%;
  display: block;
}
#map_div {
  height:100%;
  width:60%;
}
  
</style>

<div id="geocode">
    <input type="text" value="Мартеновская, 12, Москва" placeholder="For geocode just put smth" id="geocode-inp" />
    <input type="button" value="geocode" id="geocode-btn" />
</div>
<div id="map_div"></div>
<textarea id="out"></textarea>

JavaScript

google.maps.event.addDomListener(window, "load", function() {

    let map = new google.maps.Map(document.getElementById("map_div"), {
            center: new google.maps.LatLng(55.7543997, 37.8094875),
            zoom: 15,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }),
        apiUrl = "http://address-api.map.stg.s.o3.ru/api",
        locationApiURL="http://location-gateway.map.prod.s.o3.ru/Location/v2/",
        locationCurrent=point => `${locationApiURL}current?latitude=${point.lat()}&longitude=${point.lng()}`,
        locationSearch=address => `${locationApiURL}search?query=${address}`,
        geocodeURL = address => `${apiUrl}/geocode?address=${address}`,
        revGeoURL = point =>
        `${apiUrl}/rev_geocode?LatLong.lat=${point.lat()}&LatLong.long=${point.lng()}`,
        geoYandex = address =>
        `https://geocode-maps.yandex.ru/1.x/?kind=house&amp;format=json&amp;geocode=${address}`,
        revGeoYandex = latLng => geoYandex(
            `${latLng.lng()},${latLng.lat()}`),
        // debugOut generated from http://olado.github.io/doT/index.html
        debugOut = function anonymous(arr1) {
            var out = '';
            if (arr1) {
                var ar, i1 = -1,
                    l1 = arr1.length - 1;
                while (i1 < l1) {
                    ar = arr1[i1 += 1];
                    if (ar.distance) {
                        out += 'Distance:\t' + (Math.round(ar.distance *
                            100) / 100) + 'm\n';
                    }
                    out += 'Formatted:\t' + (ar.address.formatted);
                    if (ar.address.point) {
                        out += '\nPoint:\t\t' + (ar.address.point.lat) +
                            ', ' + (ar.address.point.long);
                    }

                    out += '\n=========\n';
                }
            }
            return out;
        },
        geocodeDiv = document.getElementById('geocode'),
        input =...