29 May 2019  Herrington Harbour North, Chesapeake, USA

{source}

<script>

// Load Location Parameters

var pinName = 'Herrington Harbour North';

var pinFunction = 'HerringtonHarbourNorth';

</script>

<!-- Load Google Maps API -->

<script src='https://maps.googleapis.com/maps/api/js?key=AIzaSyB3oLL6Ibii86BicVdZBkyaNE_02YFCpOY'></script>

<script src="http://thehowarths.net/includes/js/AlbaMapsWestIndies.js"></script>

<!-- Load Helper Functions -->

<script src='http://thehowarths.net/includes/js/AlbaHelperFunctions.js'></script>

<script>

// Get the position variables from the PositionJS file

// First initialise the variables

var viewLongitude; // Deprecated, was used for Google Earth Plugin

var viewLatitude; // Deprecated, was used for Google Earth Plugin

var viewHeading; // Deprecated, was used for Google Earth Plugin

var viewTilt; // Deprecated, was used for Google Earth Plugin

var viewRange; // Deprecated, was used for Google Earth Plugin

var pinLongitude;

var pinLatitude;

var strDescription = ''; // Not yet implemented - Description of the Anchorage

// Get the variables for this location

eval(pinFunction + '();');

// Format the Latitude and Longitude to 2 decimal places for Info Window

var strLongitude = formatLongitude (pinLongitude);

var strLatitude = formatLatitude (pinLatitude);

// Create Page Heading

var pageHeading = pinName + ' (' + strLatitude + ' ' + strLongitude + ')';

// Set up for Google Maps (not as detailed as Google Earth, so only using some variables)

var latLong = new google.maps.LatLng(pinLatitude, pinLongitude);

var intTilt = 45;

var intZoom = 3;

var intHeading = 0;

var strIcon = 'http://www.thehowarths.net/images/Assets/AnchorIcon.png';

var contentString = '<div id="content">'+ '<b>' + pinName + '</b>'+ '<p>' + strLatitude + ' ' + strLongitude + '</p>' + '<p>' + strDescription + '</p>' + '</div>';

</script>

<script>

//  Initialise Google Maps API

function initialize() {

// Define the div to place the map

var mapCanvas = document.getElementById('map3d');

//  Define the map options

var mapOptions = {

center: latLong,

zoom: intZoom,

mapTypeId: google.maps.MapTypeId.SATELLITE 

};

// Create the map variable

var myMap = new google.maps.Map(mapCanvas, mapOptions);

// Add a Placemark

var marker = new google.maps.Marker({

position: latLong,

map: myMap,

title: pinName,

icon: strIcon

});

// Create the Info Window

var infowindow = new google.maps.InfoWindow({

content: contentString,

maxWidth: 400

});

// Detect the user clicking the marker and open the info window

marker.addListener('click', function() {

infowindow.open(myMap, marker);

});

// Add route KML files - these need to be the Full URL - not a relative URL

// Use +'?'+ new Date().getTime()  to prevent caching during development

var kmlPath1 = 'http://www.thehowarths.net/images/kml/AlbaEasternCaribbeanRoute.kml';

var kmlPath2 = 'http://www.thehowarths.net/images/kml/AlbaEasternUSARoute.kml';

var kmlPath3 = 'http://www.thehowarths.net/images/kml/AlbaWesternCaribbeanRoute.kml';

var kmlPath4 = 'http://www.thehowarths.net/images/kml/AlbaEasternPacificRoute.kml';

var kmlPath5 = 'http://www.thehowarths.net/images/kml/AlbaSouthPacificRoute.kml'; // + '?' + new Date().getTime();

var kmlPath6 = 'http://www.thehowarths.net/images/kml/AlbaNZSingaporeRoute.kml';

var kmlPath7 = 'http://www.thehowarths.net/images/kml/AlbaMalaysiaThailandRoute.kml';

var kmlPath8 = 'http://www.thehowarths.net/images/kml/AlbaIndianOceanRoute.kml'; 

var kmlPath9 = 'http://www.thehowarths.net/images/kml/AlbaAtlanticOceanRoute.kml'; 

// Add a new KML layers - preserve viewport stops maps zooming out to the extent of the kml layers

// and still zooms in to the defined placemark

var layer1 = new google.maps.KmlLayer(kmlPath1,{preserveViewport: true});

layer1.setMap(myMap);

var layer2 = new google.maps.KmlLayer(kmlPath2,{preserveViewport: true});

layer2.setMap(myMap);

var layer3 = new google.maps.KmlLayer(kmlPath3,{preserveViewport: true});

layer3.setMap(myMap);

var layer4 = new google.maps.KmlLayer(kmlPath4,{preserveViewport: true});

layer4.setMap(myMap);

var layer5 = new google.maps.KmlLayer(kmlPath5,{preserveViewport: true});

layer5.setMap(myMap);

var layer6 = new google.maps.KmlLayer(kmlPath6,{preserveViewport: true});

layer6.setMap(myMap);

var layer7 = new google.maps.KmlLayer(kmlPath7,{preserveViewport: true});

layer7.setMap(myMap); 

var layer8 = new google.maps.KmlLayer(kmlPath8,{preserveViewport: true});

layer8.setMap(myMap); 

var layer9 = new google.maps.KmlLayer(kmlPath9,{preserveViewport: true});

layer9.setMap(myMap); 

}

// Load the Google map object into the page

google.maps.event.addDomListener(window, 'load', initialize);

</script>

<div id="map3d" style="height: 500px; 
width: 100%; 
margin:0px;
border-color:Black;
border-width:2px; 
z-index: 1;">

</div> 
{/source}

You can also see all of the anchorages that we've visited around the world.