CODEWITHSUNDEEP
directionsgoogle-directions-api
user2633218
user2633218

Reputation: 273

Google Directions API

In the JSON output, there is a field "maneuver" within a "step". In this "turn-left", "turn-right", "turn-slight-left", etc. Example is here

Where could I find the definition of the "maneuver" field, and the list of possible values? There is no relevant description here

Thanks in advance

Upvotes: 20

Views: 12934

Answers (6)

Ali Yousafzai
Ali Yousafzai

Reputation: 61

Material-Icons are providing 90% of icons matching with these manuevers

Upvotes: 1

Wnjklm
Wnjklm

Reputation: 67

Just take a look on their SDK

https://github.com/googlemaps/google-maps-services-js/blob/master/src/common.ts line 1132

export enum Maneuver {
    turn_slight_left = "turn-slight-left",
    turn_sharp_left = "turn-sharp-left",
    uturn_left = "uturn-left",
    turn_left = "turn-left",
    turn_slight_right = "turn-slight-right",
    turn_sharp_right = "turn-sharp-right",
    uturn_right = "uturn-right",
    turn_right = "turn-right",
    straight = "straight",
    ramp_left = "ramp-left",
    ramp_right = "ramp-right",
    merge = "merge",
    fork_left = "fork-left",
    fork_right = "fork-right",
    ferry = "ferry",
    ferry_train = "ferry-train",
    roundabout_left = "roundabout-left",
    roundabout_right = "roundabout-right"
}

Upvotes: 3

Jason
Jason

Reputation: 433

Here is a visual for the lazy ones :)

Can't believe Google did not document this yet...

maneuver contains the action to take for the current step (turn left, merge, straight, etc.).

This field is used to determine which icon to display, and can contain one of the following values:

Google Maps Direction API - Maneuvers

Upvotes: 25

Joyal Clifford
Joyal Clifford

Reputation: 1212

Maneuver contains the action to take for the current step (turn left, merge, straight, etc.). This field is used to determine which icon to display, and can contain one of the following values: turn-slight-left, turn-sharp-left, uturn-left, turn-left, turn-slight-right, turn-sharp-right, uturn-right, turn-right, straight, ramp-left, ramp-right, merge, fork-left, fork-right, ferry, ferry-train, roundabout-left, roundabout-right. Values in this list are subject to change

Below link will help you to find all the images https://github.com/opentripplanner/OpenTripPlanner/tree/master/src/client/images/directions

Upvotes: 1

turach
turach

Reputation: 251

UPD

Believe it or not, but finally they documented it! Please see here.

according to this gmaps-api-issue I think google not in hurry to document this part of api :(

But I can help with this issue at least with following... The "maneuver" field is the short description of step's action. I suppose google's script uses it for applying css classes to direction panel. I noticed that icon for each step depends on css class ".adp-{maneuver_name}". Css file for panel contains 18 classes with that mask and I had extracted list of maneuvers:

  • turn-sharp-left
  • uturn-right
  • turn-slight-right
  • merge
  • roundabout-left
  • roundabout-right
  • uturn-left
  • turn-slight-left
  • turn-left
  • ramp-right
  • turn-right
  • fork-right
  • straight
  • fork-left
  • ferry-train
  • turn-sharp-right
  • ramp-left
  • ferry

During the work I found two additional values of the "maneuver" field, which doesn't have css classes:

  • keep-left
  • keep-right

I can't guarantee fullness of this list, but I used this list in my project and it works properly.

Upvotes: 23

Fernando Fabreti
Fernando Fabreti

Reputation: 4366

when you use directions service, google maps inject some css in your <head>

As of 2015/jun, I've got this code below. It seems google only downloads what it needs to show the directions, so, your results may vary.

Background-image file at the bottom:

.adp-substep .adp-stepicon .adp-maneuver {
        background-size: 19px 630px;
        position: absolute;
        left: 0;
        width: 16px;
        height: 16px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-ferry {
        background-position: 0 -614px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-ferry-train {
        background-position: 0 -566px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-merge {
        background-position: 0 -143px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-straight {
        background-position: 0 -534px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-fork-left {
        background-position: 0 -550px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-ramp-left {
        background-position: 0 -598px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-roundabout-left {
        background-position: 0 -197px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-turn-left {
        background-position: 0 -413px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-turn-sharp-left {
        background-position: 0 0
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-turn-slight-left {
        background-position: 0 -378px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-uturn-left {
        background-position: 0 -305px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-fork-right {
        background-position: 0 -499px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-ramp-right {
        background-position: 0 -429px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-roundabout-right {
        background-position: 0 -232px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-turn-right {
        background-position: 0 -483px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-turn-sharp-right {
        background-position: 0 -582px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-turn-slight-right {
        background-position: 0 -51px
    }

    .adp-substep .adp-stepicon .adp-maneuver.adp-uturn-right {
        background-position: 0 -35px
    }

    .adp-substep .adp-stepicon .adp-maneuver {
        background-image: url(http://maps.gstatic.com/mapfiles/api-3/images/maneuvers.png);
    }

Upvotes: 9

Related Questions