JSFiddle - React, Tailwind, and code Playground

by Michel Plungjan

HTML

<script src="https://google-maps-utility-library-v3.googlecode.com/svn/tags/markerclusterer/1.0/src/markerclusterer_compiled.js"></script>
<body>
    <div id="map_canvas" style="height:800px; width:700px;"></div>
    <script src="http://maps.google.com/maps/api/js?sensor=false"></script>
</body>

JavaScript

var response = [
    {
        "longitude": 78.377665,
        "latitude": 17.439669,
        "name": "one"
    },
    {
        "longitude": 78.377617,
        "latitude": 17.439692,
        "name": "two"
    },
    {
        "longitude": 78.377644,
        "latitude": 17.439674,
        "name": "three"
    },
    {
        "longitude": 78.377665,
        "latitude": 17.439667,
       "name": "four"
    }
];

initializeCalllater(18.1124372, 79.01929969999999, response);


function initializeCalllater(lator, lonor, response) {
    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(lator, lonor);
    var myOptions = {
        zoom: 17,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        mapTypeControl: false,
        zoomControlOptions: {
            style: google.maps.ZoomControlStyle.LARGE
        },
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    google.maps.event.trigger(map, 'resize');
    map.setCenter(new google.maps.LatLng(lator, lonor));
    var infowindow = new google.maps.InfoWindow({});

    addMarker(response, lator, lonor, infowindow);
}

function addMarker(response, lator, lonor, infowindow) {
    if (response.length > 0) {
        var bounds = new google.maps.LatLngBounds();
        var global_markers = [];
        var lats = [];
        for (var i = 0; i < response.length; i++) {
            var lat = parseFloat(response[i].latitude);
            var lng = parseFloat(response[i].longitude);
            var norm = normaliseLat(lat)
            var pos = lats.indexOf(norm);

            if (pos != -1) { // found
                var diff = diffLng(lng, pos, response);
                console.log(diff,diff < 0.0002)
                if (diff < 0.0002) {
                    lat = parseFloat(lat) + 0.00001;
                    lng = parseFloat(lng) + 0.00001;
                }
            }
            lats[i] = norm;

            var dealername =...