Bermuda Triangle

by Steve Jansen

HTML

<script src="https://maps.googleapis.com/maps/api/js?v=3&amp;sensor=false"></script>
<div id="map-canvas"></div>

CSS

#map-canvas {
    height: 400px;
    width: 600px;
    background-color: red;
}

JavaScript

(function () {
    // This example creates a simple polygon representing the Bermuda Triangle.
    // source: https://developers.google.com/maps/documentation/javascript/examples/polygon-simple

    function initialize() {

        var mapOptions = {
            zoom: 5,
            center: new google.maps.LatLng(24.886436490787712, -70.2685546875),
            mapTypeId: google.maps.MapTypeId.TERRAIN
        };

        var bermudaTriangle;

        var map = new google.maps.Map(document.getElementById('map-canvas'),
        mapOptions);

        // Define the LatLng coordinates for the polygon's path.
        var triangleCoords = [
        new google.maps.LatLng(25.774252, -80.190262),
        new google.maps.LatLng(18.466465, -66.118292),
        new google.maps.LatLng(32.321384, -64.75737),
        new google.maps.LatLng(25.774252, -80.190262)];
        
        //finds and displays the center of the polygon on the map, used as common sense checking on the algorithm
        var center = findGeographicMidpoint(triangleCoords, triangleCoords.length - 1);
        
        new google.maps.Marker({
            position: center,
            title: "Geographic Center",
            map: map
        });
        
        //displays the points of the polygon with their associated index
        //used to know which lat/lng corresponds to which point on the map
        for (var i = 0; i < 3; i++){
            new google.maps.Marker({
                position: triangleCoords[i],
                title: i.toString(),
                map: map
            });
        }

        // Construct the polygon.
        bermudaTriangle = new google.maps.Polygon({
            paths: triangleCoords,
            strokeColor: '#FF0000',
            strokeOpacity: 0.8,
            strokeWeight: 2,
            fillColor: '#00FF00',
            fillOpacity: 0.35
        });

        bermudaTriangle.setMap(map);
        
        /*
        * THIS IS THE CODE THAT CALLS AND PRINTS THE WINDING...