private showDetailedTrip()

in Frontend/src/app/maps/bing-maps.service.ts [691:754]


    private showDetailedTrip(trip: Trip) {
        let colorIndex = 0;
        let previousTripLeg: TripLeg;
        for (const leg of trip.tripLegs) {
            const tripLegLocations = [];

            // Show the starting stop in a leg if its different from the ending stop of the last
            if (!previousTripLeg || previousTripLeg.endLocation.id !== leg.startLocation.id) {
                this.showTripLocation(leg.startLocation);
                tripLegLocations.push(new Microsoft.Maps.Location(
                    leg.startLocation.latitude,
                    leg.startLocation.longitude
                ));
            }

            // Add all route points
            for (let i = 0; i < leg.route.length; i++) {
                tripLegLocations.push(new Microsoft.Maps.Location(
                    leg.route[i].latitude,
                    leg.route[i].longitude
                ));
            }

            // Show the ending stop in a leg
            this.showTripLocation(leg.endLocation);
            tripLegLocations.push(new Microsoft.Maps.Location(
                leg.endLocation.latitude,
                leg.endLocation.longitude
            ));

            // Show every leg in a different color
            const line = new Microsoft.Maps.Polyline(tripLegLocations, {
                strokeThickness: 5,
                strokeColor: this.tripColors[colorIndex++ % this.tripColors.length]
            });
            this.tripsLayer.add(line);

            // Draw a dotted line between trip leg stop locations, if they are not the same.
            if (previousTripLeg && previousTripLeg.endLocation.id !== leg.startLocation.id) {
                const startPoint = new Microsoft.Maps.Location(
                    leg.startLocation.latitude,
                    leg.startLocation.longitude
                );

                const previousLocation = new Microsoft.Maps.Location(
                    previousTripLeg.endLocation.latitude,
                    previousTripLeg.endLocation.longitude);

                const dottedLine = new Microsoft.Maps.Polyline(
                    [previousLocation, startPoint],
                    {
                        strokeThickness: 5,
                        strokeDashArray: [2, 2],
                        strokeColor: this.genericColors[4]
                    }
                );
                this.tripsLayer.add(dottedLine);
            }

            previousTripLeg = leg;
        }

        this.centerMap(trip.startLocation);
    }