نقل البيانات إلى فئة Route

المطوّرون في المنطقة الاقتصادية الأوروبية

تتضمّن مكتبة Routes الجديدة في Maps JavaScript API الفئة Route التي تحلّ محل خدمة Directions القديمة. توضّح هذه الصفحة الاختلافات بين خدمة الاتجاهات القديمة وفئة Route الجديدة، كما تقدّم بعض الرموز للمقارنة.

خدمة "الاتجاهات" (الإصدار القديم) مقابل فئة "الطريق" (الإصدار التجريبي)

مَعلمات الطلب

يقارن الجدول التالي بين مَعلمات الطلب لخدمة "الاتجاهات" القديمة وفئة Route.

خدمة "الاتجاهات" (الإصدار القديم) Route (إصدار تجريبي)
طريقة DirectionsService.route() طريقة Route.computeRoutes()

المَعلمات المطلوبة
origin origin
destination destination
travelMode travelMode (اختياري)

المَعلمات الاختيارية
optimizeWaypoints optimizeWaypointOrder
provideRouteAlternatives computeAlternativeRoutes
‫avoidFerries وavoidHighways وavoidTolls routeModifiers
drivingOptions departureTime، trafficModel
region region
transitOptions transitPreference
arrivalTime arrivalTime
unitSystem units
waypoints intermediates

مقارنة الطرق

يقارن الجدول التالي بين الطرق الرئيسية لخدمة Directions القديمة وفئة Route.

خدمة "الاتجاهات" (الإصدار القديم) Route (إصدار تجريبي)
طريقة route() طريقة computeRoutes()
طريقة DirectionsRenderer.setDirections() طريقة createPolylines()، طريقة createWaypointAdvancedMarkers()

مقارنة الرموز

يقارن هذا القسم بين جزأين متشابهَين من الرمز لتوضيح الاختلافات بين خدمة Directions القديمة وفئة Route الجديدة. تعرض مقتطفات الرموز البرمجية الرمز المطلوب في كل واجهة برمجة تطبيقات لإجراء طلب للحصول على اتجاهات، ثم استخدام النتيجة لرسم خط متعدد الأضلاع وعلامات على الخريطة.

في خدمة "الاتجاهات" القديمة، يتم استخدام الكائن DirectionsRenderer لعرض الخطوط المتعددة والمؤشرات لتمثيل نتائج الاتجاهات على الخريطة. في مكتبة Routes، تم استبدال العنصر DirectionsRenderer بالطريقتَين createPolylines() وcreateWaypointAdvancedMarkers(). توضّح هذه الصفحة الاختلافات بين خدمة "الاتجاهات" القديمة وفئة Route الجديدة، كما تقدّم بعض الرموز للمقارنة.

الحصول على اتجاهات القيادة

خدمة الاتجاهات (الإصدار القديم)

يحصل الرمز التالي على اتجاهات القيادة باستخدام خدمة "الاتجاهات" القديمة، ثم يستخدم DirectionsRenderer لرسم خط متعدد الأضلاع وعلامات على الخريطة: 

// Define a simple request.
var request = {
  origin: 'Mountain View, CA',
  destination: 'San Francisco, CA',
  travelMode: 'DRIVING'
};
// Call the Directions Service to get the directions.
directionsService.route(request, function(result, status) {
  if (status == 'OK') {
    directionsRenderer.setDirections(result); // Add polyline and markers to the map.
  }
});

فئة المسار (إصدار تجريبي)

يحصل الرمز التالي على اتجاهات القيادة باستخدام فئة Route الجديدة، ثم يستخدم الطريقة createPolylines لرسم خط متعدد الأضلاع على الخريطة، والطريقة createWaypointAdvancedMarkers لرسم علامات على الخريطة.

لا يعرض صف Route الجديد العلامات تلقائيًا. يجب الاتصال بـ createWaypointAdvancedMarkers لعرض العلامات.

TypeScript

// Define a routes request.
const request = {
  origin: 'Mountain View, CA',
  destination: 'San Francisco, CA',
  travelMode: 'DRIVING',
  fields: ['path'], // Request fields needed to draw polylines.
};

// Call computeRoutes to get the directions.
const {routes, fallbackInfo, geocodingResults} = await Route.computeRoutes(request);

// Use createPolylines to create polylines for the route.
mapPolylines = routes[0].createPolylines();
// Add polylines to the map.
mapPolylines.forEach((polyline) => polyline.setMap(map));

// Create markers to start and end points.
const markers = await routes[0].createWaypointAdvancedMarkers();
// Add markers to the map
markers.forEach((marker) => marker.setMap(map));
index.ts

JavaScript

// Define a routes request.
const request = {
    origin: 'Mountain View, CA',
    destination: 'San Francisco, CA',
    travelMode: 'DRIVING',
    fields: ['path'], // Request fields needed to draw polylines.
};
// Call computeRoutes to get the directions.
const { routes, fallbackInfo, geocodingResults } = await Route.computeRoutes(request);
// Use createPolylines to create polylines for the route.
mapPolylines = routes[0].createPolylines();
// Add polylines to the map.
mapPolylines.forEach((polyline) => polyline.setMap(map));
// Create markers to start and end points.
const markers = await routes[0].createWaypointAdvancedMarkers();
// Add markers to the map
markers.forEach((marker) => marker.setMap(map));
index.js