答案 0 :(得分:22)
以下是懒人的视觉效果:)
不敢相信谷歌还没有记录这个......
答案 1 :(得分:21)
<强> UPD 强>
信不信由你,但最后他们记录了它!请see here。
根据this gmaps-api-issue我认为谷歌不急于记录这部分api :(
但我至少可以通过以下方式帮助解决这个问题......“机动”字段是步骤操作的简短描述。我想谷歌的脚本使用它来将css类应用到direction panel。我注意到每一步的图标取决于css类“.adp- {maneuver_name}”。面板的Css文件包含18个具有该掩码的类,我提取了一系列操作:
在工作期间,我发现了两个额外的“机动”字段值,它没有css类:
我不能保证这个列表的完整性,但我在我的项目中使用了这个列表,它运行正常。
答案 2 :(得分:7)
当您使用路线服务时,Google地图会在<head>
截至2015 / jun,我在下面有这个代码。似乎谷歌只下载显示方向所需的内容,因此,您的结果可能会有所不同。
底部的背景图片文件:
.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);
}
答案 3 :(得分:1)
机动包含当前步骤的动作(左转,合并,直线等)。此字段用于确定要显示的图标,并且可以包含以下值之一:左转弯,左转弯,左转弯,左转弯,右转弯,转弯急转弯右,右转,右转,直线,斜坡左,斜坡右,合并,左叉,右叉,渡轮,渡轮,左转,左转,右转。此列表中的值可能会发生变化
以下链接可帮助您查找所有图片 https://github.com/opentripplanner/OpenTripPlanner/tree/master/src/client/images/directions