Map with locations and routes
Map to display routes and locations.

Code to display locations and routes on map
<html>
<head>
	<script>
        function initMap() {
            const objMap = new google.maps.Map(document.getElementById("dvMap"), {
                zoom: 10,
                center: { lat: 38.9072, lng: -77.0369 },
            });

            const objDS = new google.maps.DirectionsService();
            const objDR = new google.maps.DirectionsRenderer();

            const arrLocations = [
                ["Bethesda, MD", "B", "Bethesda City"],
                ["Tyson Mall, VA", "TM", "The Tyson Mall"],
                ["National Harbor, DC", "NH", "The National Harbor"],
                ["Capitol Building, DC", "C", "The Capitol"],
            ];

            objDR.setMap(objMap);
            calculateAndRenderRoute(objDS, objDR, arrLocations);
        }

        function calculateAndRenderRoute(objDS, objDR, arrLocations) {
            const waypts = [];

            for (let i = 1; i < arrLocations.length - 1; i++) {
                waypts.push({
                    location: arrLocations[i][0],
                    stopover: true,
                });
            }

            objDS
                .route({
                    origin: arrLocations[0][0],
                    destination: arrLocations[arrLocations.length - 1][0],
                    waypoints: waypts,
                    optimizeWaypoints: true,
                    travelMode: google.maps.TravelMode.DRIVING,
                })
                .then((response) => {
                    objDR.setDirections(response);

                    const route = response.routes[0];
                })
                .catch((e) => window.alert("Directions request failed due to " + status));
        }
	</script>
</head>
<body>
	<div id="dvMap" style="width:800px; height:600px; border:1px solid grey;"></div>	
	<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap" async defer></script>
</body>
</html>



Ginger CMS
the future of cms, a simple and intuitive content management system ...

ASP.NET MVC Application
best practices like Repository, LINQ, Dapper, Domain objects ...

CFTurbine
cf prototyping engine, generates boilerplate code and views ...

Search Engine LITE
create your own custom search engine for your web site ...

JRun monitor
monitors the memory footprint of JRun engine and auto-restarts a hung engine ...

Validation Library
complete validation library for your web forms ...