Servir
Répertoire
Présentation des services de carte
Les services de carte font référence à des interfaces qui fournissent des informations sur les données, telles que la recherche locale, la planification d'itinéraire, etc. Les services fournis par Baidu Map API sont :
LocalSearch : recherche locale, fournissant des services de recherche de localisation dans une zone spécifique, comme la recherche de "parc" à Pékin.
TransitRoute : navigation en bus, fournissant des services de recherche de plans de voyage en bus dans une zone spécifique.
DrivingRoute : navigation routière, fournissant des services de recherche pour les plans de voyage.
WalkingRoute : navigation à pied, fournissant des services de recherche de plans de voyage à pied.
Géocodeur : analyse d'adresses, fournissant des services de conversion des informations d'adresse en informations de points de coordonnées.
LocalCity : Ville locale, fournissant un service qui détermine automatiquement votre ville.
TrafficControl : contrôle du trafic en temps réel, fournissant des services d'informations sur le trafic en temps réel et historiques.
L'interface de service de la classe de recherche doit spécifier une plage de recherche, sinon l'interface ne fonctionnera pas.
Recherche locale
BMap.LocalSearch fournit des services de recherche locale lorsque vous utilisez la recherche locale, vous devez définir une zone de recherche pour celle-ci. La zone de recherche peut être un objet BMap.Map, un objet BMap.Point ou une province. ou le nom de la ville (par exemple : "Beijing City"). Le deuxième paramètre du constructeur BMap.LocalSearch est facultatif, où vous pouvez spécifier le rendu des résultats. La classe BMap.RenderOptions fournit plusieurs propriétés qui contrôlent le rendu, où map spécifie l'instance de carte où les résultats sont affichés et panel spécifie l'élément conteneur de la liste de résultats.
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("天安门");De plus, BMap.LocalSearch fournit également les méthodes searchNearby et searchInBounds pour vous fournir des services de recherche environnante et de recherche de plage.
Configuration de la recherche
BMap.LocalSearch propose plusieurs méthodes de configuration grâce auxquelles vous pouvez personnaliser le comportement du service de recherche en fonction de vos besoins. Dans l'exemple ci-dessous, nous ajustons pour afficher 8 résultats par page, et ajustons automatiquement le champ de vision de la carte en fonction de la position du point résultat, sans afficher la fenêtre d'information du premier résultat :
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("中关村");Résultat Panel
En définissant la propriété BMap.LocalSearchOptions.renderOptions.panel peut fournir un conteneur de liste de résultats pour l'objet de recherche local, et les résultats de la recherche seront automatiquement ajoutés à l'élément conteneur. Veuillez consulter l'exemple ci-dessous :
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("中关村");Interface de données
En plus des résultats de recherche automatiquement ajoutés aux cartes et aux listes, vous pouvez également obtenir des informations détaillées sur les données via l'interface de données. En combinaison avec l'API de la carte, vous pouvez ajouter vous-même des annotations et des fenêtres d'informations à la carte. Les classes BMap.LocalSearch et BMap.LocalSearchOptions fournissent plusieurs interfaces pour définir des fonctions de rappel, via lesquelles les informations sur les données des résultats de recherche peuvent être obtenues. Par exemple, l'instance d'objet BMap.LocalResult peut être obtenue via le paramètre de fonction de rappel onSearchComplete, qui contient les informations sur les données de chaque résultat de recherche. Lorsque la fonction de rappel est exécutée, vous pouvez utiliser la méthode BMap.LocalSearch.getStatus() pour confirmer si la recherche a réussi ou pour obtenir les détails de l'erreur.
Dans l'exemple suivant, les informations sur le titre et l'adresse de chaque résultat sur la première page sont obtenues via la fonction de rappel onSearchComplete et affichées sur la page :
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("公园");Recherche périphérique
Grâce au service de recherche à proximité , vous pouvez effectuer une recherche à proximité d'un emplacement ou autour d'un point de résultat spécifique.
L'exemple suivant montre comment rechercher des collations près de la porte d'entrée :
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("小吃", "前门");Recherche de plage rectangulaire
La recherche de plage rectangulaire fournira des résultats de recherche en fonction du champ de vision que vous fournissez. Remarque : Lorsque la portée de la recherche est trop grande, il se peut qu'il n'y ait aucun résultat.
L'exemple suivant montre la recherche de banques dans le champ de vision actuel de la carte :
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());Transit navigation
BMap.TransitRoute class fournit des services de recherche de navigation de bus. Semblable à la recherche locale, vous devez spécifier la zone de recherche avant de lancer la recherche. Notez que la zone de navigation en bus ne peut être qu'une ville, pas une province. Si la zone de recherche est un objet BMap.Map, les résultats de l'itinéraire sont automatiquement ajoutés à la carte. Si vous fournissez un conteneur de résultats, la description de l'itinéraire correspondant sera également affichée sur la page.
L'exemple suivant montre comment utiliser le service de navigation de bus :
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("王府井", "西单");Panneau de résultats Vous pouvez fournir un élément conteneur pour afficher les résultats sous forme de texte, et les résultats du programme seront automatiquement affichés sur la page :
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("王府井", "西单");Interface de données
Vous pouvez obtenir des informations détaillées sur le plan de bus via l'interface de données. Les résultats de la recherche de navigation en bus sont représentés par BMap.TransitRouteResult, qui contient plusieurs plans de déplacement en bus (BMap.TransitRoutePlan). Chaque plan de déplacement se compose d'itinéraires pédestres et d'itinéraires de bus. Il y aura des itinéraires de marche entre le point de départ et le point d'embarquement, entre le point de descente et le point d'arrivée et entre chaque station de transfert. Si les deux points ci-dessus coïncident, alors la longueur de l'itinéraire de marche entre eux sera de 0.
Dans l'exemple ci-dessous, l'itinéraire du premier plan est ajouté à la carte via l'interface de données, et les informations de description de tous les plans sont affichées sur la page
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("中关村", "国贸桥");Navigation en voiture
fournie par BMap.DrivingRoute Services de navigation de conduite. Contrairement à la navigation en bus, la plage de recherche de la navigation en conduite peut être définie par province.
L'exemple suivant montre comment utiliser l'interface de navigation de conduite :
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("中关村", "天安门");Panneau de résultats
Dans l'exemple ci-dessous, nous fournissons les paramètres du panneau de résultats et la description de la solution sera automatiquement affichée sur la page. .
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("中关村", "天安门");Interface de données
Le service de navigation de conduite fournit également une interface de données riche. L'objet BMap.DrivingRouteResult peut être obtenu via la fonction de rappel onSearchComplete, qui contient les informations sur les données de résultat de navigation de conduite. Le résultat contiendra plusieurs plans de conduite (actuellement un seul plan est fourni), chaque plan contient plusieurs itinéraires de conduite (si le plan de navigation ne contient qu'une seule destination, alors le nombre d'itinéraires de conduite sera de 1, si le plan contient plusieurs destinations, le le nombre d'itinéraires routiers sera supérieur à 1. Actuellement, l'API ne prend pas en charge la navigation routière pour plusieurs destinations). Chaque itinéraire de conduite comprendra une série d'étapes clés (BMap.Step). Les étapes clés décrivent le plan de conduite spécifique et peuvent être obtenues via la méthode BMap.Step.getDescription().
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("中关村", "天安门");L'interface de navigation à pied est cohérente avec la navigation en voiture. Veuillez vous référer à la documentation de l'API pour plus de détails
Géocodage
Le géocodage peut convertir les informations d'adresse en informations de points de coordonnées géographiques.
Obtenir des coordonnées basées sur la description de l'adresse
L'API Baidu Map fournit la classe Geocoder pour la résolution d'adresse. Vous pouvez utiliser la méthode Geocoder.getPoint() pour convertir une description d'adresse en coordonnées. Dans l'exemple suivant, nous obtiendrons les coordonnées géographiques de l'adresse « No. 10, Shangdi 10th Street, Haidian District, Pékin » et ajouterons une étiquette à cet emplacement. Notez que lors de l'appel de la méthode Geocoder.getPoint(), vous devez fournir la ville où se trouve l'adresse (dans ce cas, « Pékin »).
var map = new BMap.Map("l-map");
map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);
// 创建地址解析器实例
var myGeo = new BMap.Geocoder();
// 将地址解析结果显示在地图上，并调整地图视野
myGeo.getPoint("北京市海淀区上地10街10号", function(point){
if (point) {
map.centerAndZoom(point, 16);
map.addOverlay(new BMap.Marker(point));
}
}, "北京市");Géocodage inversé
Le processus de géocodage inversé est tout le contraire. Il obtient une description d'une adresse basée sur un point de coordonnées. Vous pouvez obtenir la description de l'adresse via la méthode Geocoder.getLocation(). Une fois le travail d'analyse terminé, la fonction de rappel que vous avez fournie sera déclenchée. Si l'analyse réussit, le paramètre de la fonction de rappel est l'objet GeocoderResult, sinon il est nul.
var map = new BMap.Map("l-map");
map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);
// 创建地理编码实例
var myGeo = new BMap.Geocoder();
// 根据坐标得到地址描述
myGeo.getLocation(new BMap.Point(116.364, 39.993), function(result){
if (result){
alert(result.address);
}
});
