JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script src="http://shrt.tf/1t"></script>
<div id="map-canvas"></div>


<div id="container">
    <input type="checkbox" id="poi" />Show points of interest 
</div>

CSS

html, body, #map-canvas {
    height: 100%;
    margin: 0px;
    padding: 0px
}

#container{
    position:absolute;
    width:60%;
    padding:20px 0;
    background:white;
    text-align:center;
    top:10px;
    left:50%;
    margin-left:-30%;
    font-family:Helvatica, Arial, sans-serif;
}

JavaScript

var map = new GMaps({
    el: '#map-canvas',
    lat: 45.640981,
    lng: 25.587723
});


$("#poi").click(function() {
    var poi_markers = [];

    if ($("#poi").is(':checked')) {
        // Get points of interest and display them on the map
        $.ajax({
            type: "POST",
            url: "http://shrt.tf/poi.json",
            dataType: "JSON",
            cache: false,
            success: function(data) {
                $.each(data, function(key, value) {
                    poi_marker = {
                       // marker: {  <-------------- This is causing trouble
                            lat: value.latitude,
                            lng: value.longitude,
                            infoWindow: {
                                content: value.name
                            }
                       // }          <--------------
                    }
                    poi_markers.push(poi_marker);
                });
                
                map.addMarkers(poi_markers);
            }
        });
    } else {
        map.removeMarkers(); // <------------------ the parenthesis need to be empty
    }
});