«کتابخانه مسیرهای» جدید، Maps JavaScript API شامل کلاس Route است که جایگزین
سرویس مسیرهای قدیمی میشود. این
صفحه تفاوتهای بین سرویس مسیرهای قدیمی و کلاس جدید Route را توضیح میدهد
و کدهایی را برای مقایسه ارائه میدهد.
سرویس «مسیرها» (قدیمی) درمقابل کلاس «مسیر»
پارامترهای درخواست
جدول زیر پارامترهای درخواست را برای سرویس قدیمی «مسیرها» و کلاس
Route مقایسه میکند.
مقایسه روشها
جدول زیر روشهای کلیدی سرویس قدیمی «مسیرها» و کلاس Route را مقایسه میکند.
| سرویس مسیرها (قدیمی) | Route |
|---|---|
روش route() |
روش computeRoutes() |
روش DirectionsRenderer.setDirections() |
روش createPolylines()،
روش createWaypointAdvancedMarkers()
|
مقایسه کد
این بخش دو قطعه کد مشابه را باهم مقایسه میکند تا تفاوتهای بین سرویس قدیمی «مسیرها» و کلاس جدید 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. } });
کلاس مسیر
کد زیر مسیرهای رانندگی را بااستفاده از کلاس جدید «مسیر» دریافت میکند، سپس
از روش createPolylines برای ترسیم چندخطی روی نقشه، و از روش
createWaypointAdvancedMarkers برای ترسیم نشانگرها روی نقشه استفاده میکند.
کلاس جدید Route نشانگرها را بهطور خودکار رندر نمیکند. برای ارائه نشانگرها باید
createWaypointAdvancedMarkers را فراخوانی کنید.
TypeScript
// Define a routes request. const request: google.maps.routes.ComputeRoutesRequest = { 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 } = await Route.computeRoutes(request); // Use createPolylines to create polylines for the route. if (!routes) { console.warn('No routes found.'); return; } 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.map = map; });
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 } = await Route.computeRoutes(request); // Use createPolylines to create polylines for the route. if (!routes) { console.warn('No routes found.'); return; } 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.map = map; });