仕える
- ##1 マップ サービスの概要
- 2 ローカル検索 ##3
- バスナビゲーション ##4
- ドライブナビゲーション##5 ジオコーディング
マップ サービスの概要
マップ サービスとは、ローカル検索、ルート計画などのデータ情報を提供するインターフェイスを指します。 Baidu Map API が提供するサービスは次のとおりです。
LocalSearch: ローカル検索。北京の「公園」の検索など、特定のエリアでの位置検索サービスを提供します。
TransitRoute: バス ナビゲーション。特定のエリアのバス旅行プランの検索サービスを提供します。
DrivingRoute: ドライブナビゲーション、ドライブ旅行プランの検索サービスを提供します。
WalkingRoute: 徒歩旅行プランの検索サービスを提供する徒歩ナビゲーション。
ジオコーダー: 住所解決。住所情報を座標点情報に変換するサービスを提供します。
LocalCity: 地方都市。あなたの都市を自動的に決定するサービスを提供します。
TrafficControl: リアルタイムの交通制御。リアルタイムおよび履歴の交通情報サービスを提供します。
検索クラスのサービス インターフェイスは検索範囲を指定する必要があります。指定しない場合、インターフェイスは機能しません。
Local Search
BMap.LocalSearch は、ローカル検索サービスを提供します。ローカル検索を使用する場合、その検索領域を設定する必要があります。取得領域には BMap を使用できます。 .Map オブジェクト、BMap.Point オブジェクト、または省名と都市名の文字列 (例: "Beijing")。 BMap.LocalSearch コンストラクターの 2 番目のパラメーターはオプションであり、結果のレンダリングを指定できます。 BMap.RenderOptions クラスは、レンダリングを制御するいくつかのプロパティを提供します。map は結果が表示されるマップ インスタンスを指定し、panel は結果リストのコンテナ要素を指定します。
var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.404, 39.915), 11); var local = new BMap.LocalSearch(map, { renderOptions:{map: map} }); local.search("天安门");
さらに、BMap.LocalSearch には、周囲の検索サービスと範囲検索サービスを提供する searchNearby メソッドと searchInBounds メソッドも用意されています。
検索の構成
BMap.LocalSearch には、ニーズに合わせて検索サービスの動作をカスタマイズできるいくつかの構成方法が用意されています。次の例では、8 つの結果を表示するように各ページを調整し、最初の結果の情報ウィンドウを表示せずに、結果ポイントの位置に応じてマップの視野を自動的に調整します。
var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.404, 39.915), 14); var local = new BMap.LocalSearch("北京市", {renderOptions: {map: map,autoViewport: true},pageCapacity: 8}); local.search("中关村");
結果パネルBMap.LocalSearchOptions.renderOptions.panel プロパティを設定すると、ローカル検索オブジェクトの結果リスト コンテナーを提供できます。検索結果はコンテナ要素に自動的に追加されます。次の例を参照してください:
var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.404, 39.915), 11); var local = new BMap.LocalSearch(map, {renderOptions: {map: map,panel: "results"}); local.search("中关村");
データ インターフェース
地図やリストに検索結果が自動的に追加されるほか、データ インターフェースを通じて詳細なデータ情報を取得することもできます。地図 API と組み合わせることで、注釈と情報ウィンドウ。 BMap.LocalSearch クラスと BMap.LocalSearchOptions クラスは、検索結果のデータ情報を取得できるコールバック関数を設定するためのいくつかのインターフェイスを提供します。たとえば、BMap.LocalResult オブジェクト インスタンスは、各検索結果のデータ情報を含む onSearchComplete コールバック関数パラメータを通じて取得できます。コールバック関数が実行されると、BMap.LocalSearch.getStatus() メソッドを使用して、検索が成功したかどうかを確認したり、エラーの詳細を取得したりできます。
次の例では、最初のページの各結果のタイトルとアドレス情報が onSearchComplete コールバック関数を通じて取得され、ページに出力されます:
var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.404, 39.915), 11); var options = { onSearchComplete: function(results){ if (local.getStatus() == BMAP_STATUS_SUCCESS){ // 判断状态是否正确 var s = []; for (var i = 0; i < results.getCurrentNumPois(); i ++){ s.push(results.getPoi(i).title + ", " + results.getPoi(i).address); } document.getElementById("log").innerHTML = s.join("<br>"); } } }; var local = new BMap.LocalSearch(map, options); local.search("公园");
近隣検索
近隣検索サービスでは、特定の場所の近くを検索したり、特定の結果地点の周囲を検索したりできます。
次の例は、玄関近くのスナックを検索する方法を示しています:
var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.404, 39.915), 11); var local = new BMap.LocalSearch(map, { renderOptions:{map: map, autoViewport: true}}); local.searchNearby("小吃", "前门");
長方形範囲検索
長方形範囲検索では、指定した視野に基づいて検索結果が表示されます。注: 検索範囲が大きすぎる場合、結果が表示されない場合があります。
次の例は、現在のマップの視野内で銀行を検索する方法を示しています:
##バス ナビゲーションvar map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.404, 39.915), 14); var local = new BMap.LocalSearch(map, { renderOptions:{map: map}}); local.searchInBounds("银行", map.getBounds());
BMap.TransitRoute クラスは、バス ナビゲーション検索サービスを提供します。ローカル検索と同様に、検索する前に検索エリアを指定する必要があります。バス ナビゲーションのエリア範囲は、県ではなく都市のみであることに注意してください。検索エリアが BMap.Map オブジェクトの場合、ルート結果は自動的に地図に追加されます。結果コンテナを指定すると、対応するルートの説明もページに表示されます。
次の例は、バス ナビゲーション サービスの使用方法を示しています:
var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.404, 39.915), 14); var transit = new BMap.TransitRoute(map, { renderOptions: {map: map} }); transit.search("王府井", "西单");
結果パネル テキスト結果を表示するためのコンテナ要素を指定すると、プログラムの結果が自動的にページに表示されます:var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.404, 39.915), 14); var transit = new BMap.TransitRoute(map, { renderOptions: {map: map, panel: "results"} }); transit.search("王府井", "西单");
データ インターフェイス
データ インターフェイスを通じて詳細なバス計画情報を取得できます。バス ナビゲーションの検索結果は、BMap.TransitRouteResult によって表されます。これには、いくつかのバス旅行計画 (BMap.TransitRoutePlan) が含まれています。各旅行プランは徒歩ルートとバスルートで構成されています。出発地と乗車地間、降車地と終点間、各乗換駅間の徒歩ルートが存在し、上記2点が一致する場合、その間の徒歩ルートの長さは0となります。
次の例では、最初の計画のルートがデータ インターフェイスを介して地図に追加され、すべての計画の説明情報がページ
var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.404, 39.915), 12); var transit = new BMap.TransitRoute("北京市"); transit.setSearchCompleteCallback(function(results){ if (transit.getStatus() == BMAP_STATUS_SUCCESS){ var firstPlan = results.getPlan(0); // 绘制步行线路 for (var i = 0; i < firstPlan.getNumRoutes(); i ++){ var walk = firstPlan.getRoute(i); if (walk.getDistance(false) > 0){ // 步行线路有可能为0 map.addOverlay(new BMap.Polyline(walk.getPoints(), {lineColor: "green"})); } } // 绘制公交线路 for (i = 0; i < firstPlan.getNumLines(); i ++){ var line = firstPlan.getLine(i); map.addOverlay(new BMap.Polyline(line.getPoints())); } // 输出方案信息 var s = []; for (i = 0; i < results.getNumPlans(); i ++){ s.push((i + 1) + ". " + results.getPlan(i).getDescription()); } document.getElementById("log").innerHTML = s.join("<br>"); } }) transit.search("中关村", "国贸桥");
#に出力されます。##ドライブ ナビゲーション
BMap.DrivingRoute は、ドライブ ナビゲーション サービスを提供します。ドライブナビはバスナビと違い、検索範囲を都道府県に設定できます。 次の例は、運転ナビゲーション インターフェイスの使用方法を示しています:var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.404, 39.915), 14); var driving = new BMap.DrivingRoute(map, { renderOptions: { map: map, autoViewport: true } }); driving.search("中关村", "天安门");
結果パネル
below この例では、結果パネルのパラメーターを指定し、ソリューションの説明がページに自動的に表示されます。var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.404, 39.915), 14); var driving = new BMap.DrivingRoute(map, { renderOptions: { map : map, panel : "results", autoViewport: true } }); driving.search("中关村", "天安门");
データ インターフェイス
ドライビング ナビゲーション サービスは、豊富なデータ インターフェイスも提供します。 onSearchComplete コールバック関数 BMap.DrivingRouteResult オブジェクト。運転ナビゲーション結果データ情報が含まれます。結果には複数の運転計画が含まれます (現在は 1 つの計画のみが提供されています)。各計画には複数の運転ルートが含まれます (ナビゲーション プランに目的地が 1 つだけ含まれている場合、運転ルートの数は 1 になります。計画に複数の目的地が含まれている場合、運転ルートの数は 1 より大きくなります。現在、API は複数の目的地への運転ナビゲーションをサポートしていません)。各運転ルートには一連のキー ステップ (BMap.Step) が含まれます。キー ステップは特定の運転計画を記述しており、BMap.Step.getDescription() メソッドを通じて取得できます。うわー徒歩ナビゲーション インターフェイスは、運転ナビゲーションと一貫して使用できます。詳細については、API ドキュメントを参照してください
##ジオコーディング
Geocoding 住所情報を地理座標点情報に変換できます。住所の説明に基づいて座標を取得する
Baidu Map API は、住所解決用の Geocoder クラスを提供します。Geocoder.getPoint() メソッドを使用して、住所の説明を変換できます。コーディネートに。次の例では、住所「北京市海淀区上地 10 番街 10 号」の地理座標を取得し、この場所にラベルを追加します。 Geocoder.getPoint() メソッドを呼び出すときは、住所がある都市 (この場合は「北京」) を指定する必要があることに注意してください。var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.404, 39.915), 14); var options = { onSearchComplete: function(results){ if (driving.getStatus() == BMAP_STATUS_SUCCESS){ // 获取第一条方案 var plan = results.getPlan(0); // 获取方案的驾车线路 var route = plan.getRoute(0); // 获取每个关键步骤,并输出到页面 var s = []; for (var i = 0; i < route.getNumSteps(); i ++){ var step = route.getStep(i); s.push((i + 1) + ". " + step.getDescription()); } document.getElementById("log").innerHTML = s.join("<br>"); } } }; var driving = new BMap.DrivingRoute(map, options); driving.search("中关村", "天安门");
リバース ジオコーディング
リバース ジオコーディングのプロセスはまったく逆で、座標に基づいて取得されます。ポイント アドレスの説明。住所の説明は、Geocoder.getLocation() メソッドを通じて取得できます。解析作業が完了すると、指定したコールバック関数がトリガーされます。解析が成功した場合、コールバック関数のパラメータは GeocoderResult オブジェクトになり、それ以外の場合は null になります。うわぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁん