誘導画面
案内地点を画面で示すことで「どこで行動するか」をわかりやすく伝えられます。
この章では画面表示を主体とした誘導を提供する方法を紹介します。
画面表示の種類
下表に示す3種類が利用できます。
Type | 概要 | 画像提供方式 |
---|---|---|
交差点拡大図 | 案内地点を地図の中心に置き、ルート線を矢印にして図示したものです。![]() | SDKがSupportMapFragment に直接描画 |
案内イラスト | 案内地点形状と、どの車線をどう通過するか図示したものです。![]() | Bitmap |
方面案内図 | 方面看板に進行方向を図示したものです。![]() | Bitmap |
事前準備
交差点拡大図および案内イラストを利用する場合、案内地点の交差点情報をNavi.getIntersectionData()
で事前に取得しておいてください。
// 交差点情報取得
Navi.getInstance().getIntersectionData(guidePointID, true, new GetIntersectionDataListener() {
@Override
public void onCompleted(ErrorCode errorCode, GetIntersectionDataListener.Data data) {
// 取得成功
if (errorCode == ErrorCode.NONE && Navi.getInstance().getRouteNumber() == data.getRouteNumber()) {
eraseGuidePointID = data.getEraseGuidePointID(); // Viewを非表示にするタイミングの判定に使用します。
intersectionDataList = data.getIntersectionDataList(); // 後で使うので保持してください
}
}
});
案内地点間の距離が300メートル以内の場合、画面を残したまま連続で案内可能にするためIntersectionDataListには直近の案内地点とその次の地点が含まれます。
事後処理
RunInfoが示す次の案内地点のIDがeraseGuidePointID
よりも大きくなった時、表示していた交差点拡大図や案内イラストを非表示にします。
案内地点が短距離の間に連続する場合、getEraseGuidePointID()
を呼び出した時点でのRunInfoの次の案内地点IDより2以上進んだ値になり得ます。
非表示・表示を繰り返すことによる画面ちらつきを防ぐため、getEraseGuidePointID()
を非表示のトリガにすることを推奨します。
final int nextGuidePointId = Navi.getInstance().getRunInfo().getNextGuidePoint().getGuidePoint().getGuidePointID();
if (nextGuidePointId >= eraseGuidePointID) {
// 非表示処理を実行してください
}
交差点拡大図
交差点拡大図はMap
の制御によって表示します。
常時表示するMapインスタンスとは別のインスタンスを生成し、それを拡大図専用として使うことを推奨します。
交差点拡大図を出すにはMap.showIntersectionView()
を使用します。
この関数の引数にIntersectionMapSetting
が必要ですが、動的に設定を変えなくてもよいなら次のように関数化しておくと便利です。
private IntersectionMapSetting createMyIntersectionMapSetting(Map map) {
IntersectionMapSetting intersectionMapSetting = new IntersectionMapSetting();
intersectionMapSetting.setWaitFully(true);
intersectionMapSetting.setWaitFullyTimeoutTime(4000);
intersectionMapSetting.setImmediateRemoveRouteLine(true);
intersectionMapSetting.setZoomLevel(16.0);
final float mapWidth = map.getWidth();
final float mapHeight = map.getHeight();
final float left = mapWidth * 0.2f;
final float top = mapHeight * 0.2f;
final float right = mapWidth * 0.8f;
final float bottom = mapHeight * 0.8f;
intersectionMapSetting.setArrowRange(new RectF(left, top, right , bottom));
return intersectionMapSetting;
}
Map.showIntersectionView()
を使用するサンプルコードは以下の通りです。
// 以下、map オブジェクトはどこかで用意されていると仮定します。
IntersectionMapSetting intersectionMapSetting = createMyIntersectionMapSetting(map);
map.showIntersectionView(intersectionData, intersectionMapSetting, new IntersectionViewListener() {
@Override
public void onCompleted(ErrorCode errorCode, int eraseGuidePointID) {
// eraseGuidePointID は Navi.getIntersectionData() で取得したものと同じ値になります
}
});
// 以下の処理で案内地点の旗を立てます。
// 必須ではありませんが、曲がる地点の視認性を向上させるために設定した方がいいでしょう。
GuidePoint guidePoint = Navi.getInstance().getRunInfo().getNextGuidePoint().getGuidePoint();
MapIcon image = new MapIcon();
image.setImageResource(R.drawable.baloon_guide);
image.setID(icontype_guidePoint);
image.setPosition(guidePoint.getGeoCoordinate());
map.addUserIcon(image);
案内イラスト
案内イラストはBitMap制御によって表示します。
Navi.getIntersectionData()
で取得したデータに交差点の案内イラストが存在していれば、Bitmapで参照できます。
取得したBitMapはImageViewなどで表示してください。
// 該当地点(guidePointId)のイラストを探す。
IntersectionData.IllustData illustData = null;
for (IntersectionData intersectionData : intersectionData) {
if (intersectionData.getGuidePointID() == guidePointId) {
illustData = intersectionData.getIllustData();
break;
}
}
if (illustData == null || illustData.getIllust() == null) {
return;
}
Bitmap illustBmp = illustData.getIllust();
ImageView imageView = (ImageView)findViewById(ResoureIdOfIllust); // Resource IDはアプリ固有の値をご利用ください
imageView.setImageBitmap(illustData.getIllust());
方面案内図
方面案内図はBitMap制御によって表示します。
案内地点のGuidePoint.DistrictSign
に方面案内図が存在していれば、GuidePoint.DistrictSign.getIllust()
でBitmapを取得できます。
取得したBitMapはImageViewなどで表示してください。
GuidePoint.DistrictSign districtSign = Navi.getInstance().getRunInfo().getNextGuidePoint().getGuidePoint().getDistrictSign();
districtSign.getIllust(new GuidePoint.DistrictSign.IllustListener() {
@Override
public void onCompleted(ErrorCode errorCode, Bitmap illust) {
// 案内地点にイラストがない場合はリスナ呼び出しが発生しません。
// イラストがない場合、getIllust()の戻り値がfalseになります。
if (errorCode == ErrorCode.NONE) {
ImageView imageView = (ImageView)findViewById(ResoureIdOfDistrictSignIllust); // Resource IDはアプリ固有の値をご利用ください
imageView.setImageBitmap(illust);
}
}
});
その他の表示
画面表示に利用可能な要素を紹介します。
SDKはこれ以降に紹介する要素の表示用の画面部品を提供しません。
SDKを利用するアプリケーションでViewや画像を用意してください。
残距離
案内地点までの残距離を取得するにはRunInfo.GuidePointInfo.getDistance()
を利用します。
RunInfo
から取得してください。
float distanceUntilGuidePoint = Navi.getInstance().getRunInfo().getNextGuidePoint().getDistance();
案内方向
案内地点をどちらに曲がるのかを取得するにはGuidePoint.getDirection()
を利用します。
RunInfo
から取得してください。
GuidePoint.GuideDirection direction = Navi.getInstance().getRunInfo().getNextGuidePoint().getGuidePoint().getDirection();
交差点名
案内地点の交差点名称を取得するにはGuidePoint.getCrossName()
を利用します。
RunInfo
から取得してください。
String crossName = Navi.getInstance().getRunInfo().getNextGuidePoint().getGuidePoint().getCrossName();
信号機有無
案内地点に信号機が設置されているかどうかを取得するにはPassPoint.isTrafficLight()
を利用します。
RunInfo
から取得してください。
// 次の案内地点に対応する PassPoint を参照します
final boolean hasTrafficLightOnGuidePoint = Navi.getInstance().getRunInfo().getNextGuidePoint().getPassPoint().isTrafficLight();
車線
車線情報はGuidePoint.LaneInfo
で定義されており、
案内地点や通過交差点の車線情報を取得するにはそれぞれ、
GuidePoint.getLane()
PassPoint.getLane()
を利用します。
LaneInfo
は1本の車線を表現するデータ構造で、これをList
で保持することで複数車線を表現します。
List
の先頭要素は左端の車線です。Indexが一つ増えるごとに1つ右の車線を示します。
LaneInfo
が持つデータ概要を下表に示します。
要素 | 解説 | ||||||
---|---|---|---|---|---|---|---|
IncrementLane | 増加車線かどうか | ||||||
LaneKind | 誘導種別
| ||||||
LaneArrow | 車線矢印。 その車線の進行方向を示す。 |
これらのデータを組み合わせることで、Fig.1のように車線を表現します。
地図上に直近の通過交差点の信号機や一時停止標識、踏切のアイコンを表示する
地図画面に信号機、一時停止標識、踏切のアイコンを拡大表示したい場合、まずRunInfo.PassPointInfo
が示すPassPointの
PassPoint.isTrafficLight()
PassPoint.isStopSign()
PassPoint.isRailCross()
によってその地点に存在する地物を特定します。
PassPointを通過するごとに直近のPassPointのアイコンを更新するサンプルコードは以下の通りです。
// currentPassPointID, mapは広域変数と仮定します。
PassPoint pp = Navi.getInstance().getRunInfo().getNextPassPoint().getPassPoint();
if (pp.getPassPointID() == currentPassPointID) {
return;
}
if (pp.getPassPointID() > currentPassPointID) {
int iconRID = R.drawable.empty;
if (pp.isTrafficLight()) {
iconRID = R.drawable.traffic_light;
}
else if (pp.isStopSign()) {
iconRID = R.drawable.stop_sign;
}
else if (pp.isRailCross()) {
iconRID = R.drawable.rail_cross;
}
// 通過した地点のアイコンを消去
map.deleteUserIcon("PassPoint");
MapIcon icon = new MapIcon();
icon.setImageResource(iconRID);
icon.setID("PassPoint");
icon.setPosition(pp.getGeoCoordinate());
map.addUserIcon(icon);
}