Mike
Mike

Reputation: 23

Map Route Using Average Traffic Conditions

Good morning. I am trying to get my map to show a route based on average traffic conditions on a Monday morning at 11:00am EST. I can do this with the calculateRoute service by appending the following to the service URL:

&depart=".date('Y-m-d', strtotime('monday this week'))."T11:00:00-05

I use this to gather my turn by turn directions, but I would also like the visual route line on the map to reflect this as well. I am very new to JS so please forgive my code, I mainly used the canned demo scripts and modified them to do what I needed. Below is the code for my map. This does also use PHP in the code, but mainly for SQL data and grabbing GET data.

<script>
    // Initialize the platform object:
    var platform = new H.service.Platform({
    'app_id': 'MY APP ID',
    'app_code': 'MY APP CODE'
    });

    // Obtain the default map types from the platform object
    var maptypes = platform.createDefaultLayers();

    // Obtain the default map types from the platform object:
    var defaultLayers = platform.createDefaultLayers();

    // Instantiate (and display) a map object:
    var map = new H.Map(
    document.getElementById('mapContainer'),
    defaultLayers.normal.traffic,
    {
    zoom: 10,
    center: { lat: 42.3314, lng: -83.0458 }
    }
    );
    // Create the default UI:
    var ui = H.ui.UI.createDefault(map, defaultLayers);
    // Enable the event system on the map instance:
    var mapEvents = new H.mapevents.MapEvents(map);

    // Add event listeners:
    map.addEventListener('tap', function(evt) {
    // Log 'tap' and 'mouse' events:
    console.log(evt.type, evt.currentPointer.type); 
    });

    // Instantiate the default behavior, providing the mapEvents object: 
    var behavior = new H.mapevents.Behavior(mapEvents);

    var routingParameters = {
    // The routing mode:
    'mode': 'fastest;truck;traffic:enabled',
    'waypoint0': 'geo!<?PHP echo $_GET['shipFrom']; ?>',

    // The end point of the route:
    'waypoint1': 'geo!<?PHP echo $geoCode; ?>',

    // To retrieve the shape of the route we choose the route
    // representation mode 'display'
    'representation': 'display'
    };

    // Define a callback function to process the routing response:
    var onResult = function(result) {
    var route,
    routeShape,
    startPoint,
    endPoint,
    linestring;
    if(result.response.route) {
    // Pick the first route from the response:
    route = result.response.route[0];
    // Pick the route's shape:
    routeShape = route.shape;

    // Create a linestring to use as a point source for the route line
    linestring = new H.geo.LineString();

    // Push all the points in the shape into the linestring:
    routeShape.forEach(function(point) {
    var parts = point.split(',');
    linestring.pushLatLngAlt(parts[0], parts[1]);
    });

    // Retrieve the mapped positions of the requested waypoints:
    startPoint = route.waypoint[0].mappedPosition;
    endPoint = route.waypoint[1].mappedPosition;

    // Create a polyline to display the route
    routeLine = new H.map.Polyline(linestring, {
    style: { lineWidth: 10 },
    arrows: { fillColor: 'white', frequency: 2, width: 0.8, length: 0.7 }
    });

    // Create a marker for the start point:
    var startMarker = new H.map.Marker({
    lat: startPoint.latitude,
    lng: startPoint.longitude
    });

    // Create a marker for the end point:
    var endMarker = new H.map.Marker({
    lat: endPoint.latitude,
    lng: endPoint.longitude
    });

    // Add the route polyline and the two markers to the map:
    map.addObjects([routeLine, startMarker, endMarker]);

    // Set the map's viewport to make the whole route visible:
    map.setViewBounds(routeLine.getBounds());
    }
};

// Get an instance of the routing service:
var router = platform.getRoutingService(); 

// Call calculateRoute() with the routing parameters,
// the callback and an error callback function (called if a
// communication error occurs):
router.calculateRoute(routingParameters, onResult,
    function(error) {
    alert(error.message);
    });
</script>

Upvotes: 0

Views: 135

Answers (1)

Jithin Krishnan
Jithin Krishnan

Reputation: 1044

You could just add the departure parameter in the routingParameters used in the above shared javascript code

var routingParameters = {
// The routing mode:
'mode': 'fastest;truck;traffic:enabled',
'waypoint0': 'geo!<?PHP echo $_GET['shipFrom']; ?>',

// The end point of the route:
'waypoint1': 'geo!<?PHP echo $geoCode; ?>',

// To retrieve the shape of the route we choose the route
// representation mode 'display'
'representation': 'display',

//departure time
'departure' : '2018-10-22T11:00:00-05'
};

Upvotes: 1

Related Questions