29:null 2a:["$","title",null,{"children":"Optimizing EV Deliveries: Seamless Route Planning with Charging Stops | NB.AI Solutions Team | Observable"}] 2f:T91d,Businesses using electric vehicles (EVs) for deliveries face unique challenges. Limited range, charging station availability, and the need for optimized routes are critical factors that directly impact operational efficiency and customer satisfaction. This use case demonstrates how to leverage Route Optimization and Distance Matrix APIs to overcome these challenges. It provides a streamlined approach to ensure that EVs complete all assigned delivery jobs within their range while seamlessly integrating charging stops when needed. **Key Benefits:** 1. Enhanced Planning: Advanced tools for better decision-making and efficient fleet utilization. 2. Optimized Route Planning: Minimized travel distances and time, reducing energy consumption and costs. 3. Range Anxiety Resolution: Proactive identification of charging needs and seamless integration of charging stops. **Workflow Overview:** **Initial Route Optimization:** 1. Start by running the Route Optimization API without a distance constraint. This assigns jobs to vehicles without limiting their travel range, ensuring comprehensive job coverage. **Identifying Charging Points:** 1. Monitor the planned routes to identify when vehicles approach 80 km of travel distance (to account for a 100 km range limit). 2. Use the Distance Matrix API to locate the nearest charging stations from the vehicle's position at the ~80 km mark. 3. The API response provides the optimal charging station based on distance and feasibility. **Post-Processing and Adjustment:** 1. Update the route plan to include the identified charging station at the right location. 2. Re-run the Route Optimization API with the updated vehicle start locations and remaining jobs, ensuring uninterrupted delivery operations. **Why This Matters:** For businesses using EV fleets, Route Optimization and Distance Matrix APIs address critical pain points like range limitations and charging logistics. By automating the process of finding the nearest charging stations and adjusting delivery routes dynamically, businesses can: 1. Reduce delivery delays. 2. Maximize fleet utilization. 3. Lower operational costs while maintaining sustainability goals. This solution bridges the gap between EV constraints and delivery demands, empowering businesses to deliver efficiently, sustainably, and confidently.30:T44e,tempVRPProblem = { let loc_index = 0; let jobs = []; let job = {}; let vehicle = {}; let vehicles = []; let locations = []; let relations = []; Jobs.forEach((row) => { locations.push(`${row.Latitude},${row.Longitude}`); job = { id: row.id, service: row.Service_time, description: row.area, time_windows: [ [Date.parse(row.start) / 1000, Date.parse(row.end) / 1000] ], delivery: [row.Load], location_index: loc_index++ }; jobs.push(job); }); // Process vehicles Vehicles.forEach((row) => { locations.push(`${row.lat},${row.long}`); vehicle = { id: row.Vehicle_Identifier, description: row.Manufacturer, capacity: [row.Max_Payload], max_distance: 240000, start_index: loc_index, end_index: loc_index++, time_window: [ Date.parse(row.Start_time) / 1000, Date.parse(row.end_time) / 1000 ] }; vehicles.push(vehicle); }); return { locations: locations, location_index: loc_index, jobs: jobs, vehicles: vehicles }; }31:Tc6e,function findLocationsInRange(plan, minDistance = 70000, maxDistance = 90000) { if (!plan?.result?.routes || plan.result.routes.length === 0) { console.error("Invalid or empty routing plan"); return { error: "No route data available" }; } const results = []; for (const route of plan.result.routes) { // If total route distance < 100000, no charging needed if (route.distance < 100000) { results.push({ vehicle: route.vehicle, distance: route.distance, message: `Route completed @ ${route.distance} meters, no charging station is required` }); continue; } let chargingStation = null; let farthestStopInRange = null; // 1. Search steps between 70-90 km for (const step of route.steps) { if (step.distance >= minDistance && step.distance <= maxDistance) { // If step is a charging station, return it immediately if (step.description && step.description.endsWith("ChargingStn")) { chargingStation = { vehicle: route.vehicle, distance: step.distance, location: step.location, load: step.load, arrival: step.arrival, description: step.description }; break; // Found a charging station } // Track the farthest stop in 70–90 km if no charging station if ( !farthestStopInRange || step.distance > farthestStopInRange.distance ) { farthestStopInRange = { vehicle: route.vehicle, distance: step.distance, location: step.location, load: step.load, arrival: step.arrival, description: step.description || "No description available" }; } } } // 2. If no station or farthest stop found, route > 100000 => second-to-last step let result; if (!chargingStation && !farthestStopInRange && route.distance > 100000) { if (route.steps.length >= 2) { const secondToLastStep = route.steps[route.steps.length - 2]; result = { vehicle: route.vehicle, distance: secondToLastStep.distance, location: secondToLastStep.location, load: [0], // or whatever default; will handle below arrival: secondToLastStep.arrival, description: secondToLastStep.description || "No description available" }; } } // 3. Decide final result if (!result) { result = chargingStation || farthestStopInRange || { error: "No stops found in the specified range" }; } // 4. If load is zero, set to 500 // Check whether load is an array or a number. if (result.load !== undefined) { if (Array.isArray(result.load)) { // e.g. load: [0] if (result.load.length === 1 && parseInt(result.load[0]) === 0) { result.load = [500]; } } else if (parseInt(result.load) === 0) { // e.g. load: 0 result.load = 500; } } results.push(result); } console.log("Analysis Results:", results); return results; }32:T8f7,// Function to fetch closest charging stations using DM API async function fetchClosestChargingStations( routesWithoutCharging, chargingStations, apiKey ) { const results = []; // Initialize an array to collect results for (const route of routesWithoutCharging) { const origin = `${route.location[0]},${route.location[1]}`; const destinations = chargingStations .map((cs) => `${cs.Latitude},${cs.Longitude}`) .join("|"); const url = `https://api.nextbillion.io/distancematrix/json?origins=${origin}&destinations=${destinations}&key=${apiKey}`; console.log(`Fetching DM for ${route.vehicle} from URL:`, url); try { const response = await fetch(url); const data = await response.json(); if (data.status === "Ok" && data.rows?.length > 0) { // Ensure the data is structured properly const distances = data.rows[0].elements.map((el, idx) => ({ chargingStation: chargingStations[idx], distance: el.distance?.value || Infinity, // Handle missing distances duration: el.duration?.value || Infinity // Handle missing durations })); // Find the closest charging station by distance distances.sort((a, b) => a.distance - b.distance); const closest = distances[0]; if (closest.distance < Infinity) { results.push({ vehicle: route.vehicle, origin: route.location, closestChargingStation: closest.chargingStation, distance: closest.distance, duration: closest.duration }); } else { results.push({ vehicle: route.vehicle, origin: route.location, error: "No valid distances found in the DM response" }); } } else { console.error(`Invalid DM response for ${route.vehicle}:`, data); results.push({ vehicle: route.vehicle, error: "Invalid DM response", details: data }); } } catch (error) { console.error(`Error fetching DM for ${route.vehicle}:`, error); results.push({ vehicle: route.vehicle, error: "Fetch error", details: error }); } } return results; // Return the array of results }33:Tb43,function combineData(locationsNear70to90km, closestCS) { return locationsNear70to90km .filter( (location) => !( // Filter out vehicles with no valid charging station ( !location.description?.includes("ChargingStn") && !closestCS.find((cs) => cs.vehicle === location.vehicle) ?.closestChargingStation ) ) ) .map((location) => { // Find matching closestCS entry const closestData = closestCS.find( (cs) => cs.vehicle === location.vehicle ); // Set default lat/long values let chargingStationLat = "N/A"; let chargingStationLong = "N/A"; // If it's a charging station, use the location's lat/long if (location.description?.includes("ChargingStn")) { chargingStationLat = location.location[0]?.toFixed(4); chargingStationLong = location.location[1]?.toFixed(4); } // Otherwise, use the lat/long from closestData else if (closestData?.closestChargingStation) { chargingStationLat = closestData.closestChargingStation.Latitude?.toFixed(4); chargingStationLong = closestData.closestChargingStation.Longitude?.toFixed(4); } // Calculate the raw Unix timestamp (in seconds) // - +5 hours (5 * 3600 = 18000) // - For non-charging station, also add closestData.duration const rawTimestamp = location.description?.includes("ChargingStn") ? location.arrival + 5 * 3600 : location.arrival + 5 * 3600 + (closestData?.duration || 0); // Convert that timestamp to "YYYY-MM-DD HH:mm:ss" const formattedStartTime = formatTimestamp(rawTimestamp); return { vehicle: location.vehicle, // Convert array load to integer load: Array.isArray(location.load) && location.load.length > 0 ? parseInt(location.load[0], 10) : 0, // or "N/A" // Convert distance from meters -> km (rounded to 1 decimal) distance_travelled: location.distance ? `${(location.distance / 1000).toFixed(1)} km` : "N/A", // If "ChargingStn" in description, use it; otherwise, fallback chargingStation: location.description?.includes("ChargingStn") ? location.description : closestData?.closestChargingStation?.Postcode || "Not Required", // If charging station, distanceToCS = "0 km" // Otherwise, convert closestData.distance from meters -> km distanceToCS: location.description?.includes("ChargingStn") ? "0 km" : closestData ? `${(closestData.distance / 1000).toFixed(1)} km` : "N/A", // Formatted date-time string starttime: formattedStartTime, chargingStationLat, chargingStationLong }; }); }34:T420,function integrateVehicles(Vehicles, vehicles_afterCS) { // Filter and map to return matched data const integratedData = vehicles_afterCS .map((vh) => { // Find the matching job in Vehicles using id and jobId const matchedJob = Vehicles.find( (allvehicle) => allvehicle.Vehicle_Identifier === vh.vehicle ); // If no match is found, skip this job if (!matchedJob) return null; // Combine data from both tables for matched jobs return { vehicle: vh.vehicle, load: vh.load, distance_travelled: vh.distance_travelled, chargingStation: vh.chargingStation, distanceToCS: vh.distanceToCS, chargingStationLat: vh.chargingStationLat, chargingStationLong: vh.chargingStationLong, end_time: matchedJob.end_time, end_lat: matchedJob.end_lat, end_long: matchedJob.end_long, strattime: vh.starttime }; }) .filter((entry) => entry !== null); // Filter out nulls (non-matching jobs) return integratedData; }35:T5a9,// Function to extract jobs after specific locations function extractJobsAfterLocations(checkStatus, locationsNear70to90km) { const jobsAfterLocations = []; // Iterate through each route in the routing plan for (const route of checkStatus.result.routes) { // Find the corresponding location for the current vehicle const locationInfo = locationsNear70to90km.find( (loc) => loc.vehicle === route.vehicle && loc.distance ); if (!locationInfo) { // Skip if no location information for this vehicle continue; } let isAfterLocation = false; // Iterate through steps in the route for (const step of route.steps) { // Mark when we reach or pass the specified location if (!isAfterLocation && step.distance >= locationInfo.distance) { isAfterLocation = true; // Start collecting jobs after this continue; // Skip the current step } // Collect jobs after the specified location if (isAfterLocation && step.type === "job") { jobsAfterLocations.push({ vehicle: route.vehicle, jobId: step.id, description: step.description, latitude: step.location ? step.location[0] : null, // Extract latitude longitude: step.location ? step.location[1] : null, // Extract longitude distance: step.distance, arrival: step.arrival }); } } } return jobsAfterLocations; }36:T430,function integrateTables(alljobs, JobsToBeCompleted) { // Filter and map to return matched data const integratedData = JobsToBeCompleted.map((job) => { // Find the matching job in alljobs using id and jobId const matchedJob = alljobs.find((allJob) => allJob.id === job.jobId); // If no match is found, skip this job if (!matchedJob) return null; // Combine data from both tables for matched jobs return { vehicle: job.vehicle, jobId: job.jobId, description: job.description, latitude: job.latitude, longitude: job.longitude, service_time: matchedJob.Service_time || "N/A", start: matchedJob.start || "N/A", end: matchedJob.end || "N/A", load: matchedJob.Load || "N/A", area: matchedJob.area || "N/A", postcode: matchedJob.Postcode || "N/A" //priority: matchedJob.Priority || "N/A", //charger_availability: matchedJob["Charger availability"] || "N/A" }; }).filter((entry) => entry !== null); // Filter out nulls (non-matching jobs) return integratedData; }37:T56c,tempVRPProblem2 = { let loc_index = 0; let jobs = []; let job = {}; let vehicle = {}; let vehicles = []; let locations = []; let relations = []; pendingjobs.forEach((row) => { locations.push(`${row.latitude},${row.longitude}`); job = { id: row.jobId, service: row.service_time, description: row.area, time_windows: [ [Date.parse(row.start) / 1000, Date.parse(row.end) / 1000] ], delivery: [row.load], location_index: loc_index++ }; jobs.push(job); }); // Process vehicles charged_vehicles.forEach((row) => { // Push the vehicle's start location locations.push(`${row.chargingStationLat},${row.chargingStationLong}`); const startIdx = loc_index++; // Push the vehicle's end location locations.push(`${row.end_lat},${row.end_long}`); const endIdx = loc_index++; vehicle = { id: row.vehicle, description: row.chargingStation, capacity: [row.load], time_windows: [ [Date.parse(row.strattime) / 1000, Date.parse(row.end_time) / 1000] ], max_distance: 100000, start_index: startIdx, // Use the start location index end_index: endIdx // Use the end location index }; vehicles.push(vehicle); }); return { locations: locations, location_index: loc_index, jobs: jobs, vehicles: vehicles }; }38:T3103,viewof mapRoutes = { const mapInstance = mapContainer.map; const visibleVehicles = new Set(); // Track visible vehicles let markers = []; // Store all markers function cleanup() { // Remove existing legend if it exists const existingLegend = document.querySelector(".route-legend"); if (existingLegend) existingLegend.remove(); // Remove existing markers const existingMarkers = document.querySelectorAll(".route-marker"); existingMarkers.forEach((marker) => marker.remove()); } // Get the map instance and check if it exists if (!mapInstance) return html`

Map not initialized

`; cleanup(); function addRoutes() { // Remove existing sources and layers first checkStatus.result.routes.forEach((_, index) => { try { if (mapInstance.getLayer(`route-${index}`)) mapInstance.removeLayer(`route-${index}`); if (mapInstance.getSource(`route-source-${index}`)) mapInstance.removeSource(`route-source-${index}`); } catch (e) { console.log("Cleanup error:", e); } }); checkStatus2.result.routes.forEach((_, index) => { try { if (mapInstance.getLayer(`route2-${index}`)) mapInstance.removeLayer(`route2-${index}`); if (mapInstance.getSource(`route2-source-${index}`)) mapInstance.removeSource(`route2-source-${index}`); } catch (e) { console.log("Cleanup error:", e); } }); const markerLocations = new Map(); function getOffsetForOverlap(coord, count) { const baseOffset = 0.0003; if (count === 0) return { lat: 0, lng: 0 }; const angle = (count * Math.PI) / 2; return { lat: Math.cos(angle) * baseOffset, lng: Math.sin(angle) * baseOffset }; } function createMarker( point, color, isStart, routeNum, route, overlapCount, index ) { const offset = getOffsetForOverlap(point, overlapCount); const adjustedPoint = [point[0] + offset.lat, point[1] + offset.lng]; const baseScale = 0.7; const scaleMultiplier = overlapCount > 0 ? 1.2 : 1; const marker = new nextbillion.maps.Marker({ scale: baseScale * scaleMultiplier, color: color, className: "route-marker" }) .setLngLat([adjustedPoint[1], adjustedPoint[0]]) .setPopup( new nextbillion.maps.Popup().setHTML(`

${ isStart ? "Start" : "End" } Point (Route ${routeNum})
Vehicle: ${route.vehicle} ${ isStart ? `
Distance: ${(route.distance / 1000).toFixed( 2 )} km
Duration: ${(route.duration / 60).toFixed( 2 )} mins` : "" }

`) ); marker.getElement().style.border = "2px solid white"; marker.getElement().style.borderRadius = "50%"; marker.getElement().style.boxShadow = "0 0 4px rgba(0,0,0,0.4)"; const markerObj = marker.addTo(mapInstance); markers.push({ marker: markerObj, vehicle: route.vehicle, routeNum: routeNum, routeIndex: index }); return markerObj; } // Add first set of routes checkStatus.result.routes.forEach((route, index) => { if (route.geometry) { const coordinates = decodePolyline(route.geometry); mapInstance.addSource(`route-source-${index}`, { type: "geojson", data: { type: "Feature", properties: {}, geometry: { type: "LineString", coordinates: coordinates } } }); mapInstance.addLayer({ id: `route-${index}`, type: "line", source: `route-source-${index}`, layout: { "line-join": "round", "line-cap": "round" }, paint: { "line-color": "#0066FF", "line-width": 3, "line-opacity": 0.7 } }); if (route.steps?.length > 0) { const startPoint = route.steps[0].location; const startCoord = `${startPoint[0]},${startPoint[1]}`; const endPoint = route.steps[route.steps.length - 1].location; const endCoord = `${endPoint[0]},${endPoint[1]}`; const startOverlapCount = markerLocations.has(startCoord) ? markerLocations.get(startCoord).count : 0; const endOverlapCount = markerLocations.has(endCoord) ? markerLocations.get(endCoord).count : 0; markerLocations.set(startCoord, { count: startOverlapCount + 1, type: "start" }); markerLocations.set(endCoord, { count: endOverlapCount + 1, type: "end" }); createMarker( startPoint, "#00FF00", true, 1, route, startOverlapCount, index ); createMarker( endPoint, "#0000FF", false, 1, route, endOverlapCount, index ); } } }); // Add second set of routes checkStatus2.result.routes.forEach((route, index) => { if (route.geometry) { const coordinates = decodePolyline(route.geometry); mapInstance.addSource(`route2-source-${index}`, { type: "geojson", data: { type: "Feature", properties: {}, geometry: { type: "LineString", coordinates: coordinates } } }); mapInstance.addLayer({ id: `route2-${index}`, type: "line", source: `route2-source-${index}`, layout: { "line-join": "round", "line-cap": "round" }, paint: { "line-color": "#FF3366", "line-width": 3, "line-opacity": 0.7 } }); if (route.steps?.length > 0) { const startPoint = route.steps[0].location; const startCoord = `${startPoint[0]},${startPoint[1]}`; const endPoint = route.steps[route.steps.length - 1].location; const endCoord = `${endPoint[0]},${endPoint[1]}`; const startOverlapCount = markerLocations.has(startCoord) ? markerLocations.get(startCoord).count : 0; const endOverlapCount = markerLocations.has(endCoord) ? markerLocations.get(endCoord).count : 0; markerLocations.set(startCoord, { count: startOverlapCount + 1, type: "start" }); markerLocations.set(endCoord, { count: endOverlapCount + 1, type: "end" }); createMarker( startPoint, "#FFFF00", true, 2, route, startOverlapCount, index ); createMarker( endPoint, "#8B4513", false, 2, route, endOverlapCount, index ); } } }); // Create vehicle toggle controls const toggleContainer = document.createElement("div"); toggleContainer.style.cssText = ` position: absolute; top: 20px; left: 20px; background: white; padding: 10px; border-radius: 4px; box-shadow: 0 2px 4px rgba(0,0,0,0.2); z-index: 1000; `; // Get unique vehicle types const vehicles = new Set([ ...checkStatus.result.routes.map((r) => r.vehicle), ...checkStatus2.result.routes.map((r) => r.vehicle) ]); // Add title const title = document.createElement("div"); title.textContent = "Filter by Vehicle Type"; title.style.fontWeight = "bold"; title.style.marginBottom = "8px"; toggleContainer.appendChild(title); vehicles.forEach((vehicle) => { const label = document.createElement("label"); label.style.cssText = "display: block; margin-bottom: 5px; cursor: pointer;"; const checkbox = document.createElement("input"); checkbox.type = "checkbox"; checkbox.checked = true; checkbox.style.marginRight = "8px"; visibleVehicles.add(vehicle); checkbox.addEventListener("change", () => { if (checkbox.checked) { visibleVehicles.add(vehicle); } else { visibleVehicles.delete(vehicle); } // Update routes and their associated markers [1, 2].forEach((routeSet) => { const routes = routeSet === 1 ? checkStatus.result.routes : checkStatus2.result.routes; routes.forEach((route, index) => { const layerId = `route${routeSet === 2 ? "2-" : "-"}${index}`; const isVisible = visibleVehicles.has(route.vehicle); // Update route visibility if (mapInstance.getLayer(layerId)) { mapInstance.setLayoutProperty( layerId, "visibility", isVisible ? "visible" : "none" ); } // Update associated markers markers .filter( (m) => m.vehicle === route.vehicle && m.routeNum === routeSet && m.routeIndex === index ) .forEach(({ marker }) => { marker.getElement().style.display = isVisible ? "block" : "none"; }); }); }); }); label.appendChild(checkbox); label.appendChild(document.createTextNode(vehicle)); toggleContainer.appendChild(label); }); // Add legend const legend = document.createElement("div"); legend.className = "route-legend"; legend.style.cssText = ` position: absolute; bottom: 20px; right: 20px; background: white; padding: 10px; border-radius: 4px; box-shadow: 0 2px 4px rgba(0,0,0,0.2); z-index: 1000; `; legend.innerHTML = `

Route Set 1

Route Set 2

Start Point (Route 1)

End Point (Route 1)

Start Point (Route 2)/charging stn

End Point (Route 2)

`; // Add controls document.getElementById("map").appendChild(toggleContainer); document.getElementById("map").appendChild(legend); } if (mapInstance.loaded()) { addRoutes(); } else { mapInstance.on("load", addRoutes); } // Use Promise to handle map loading const loadRoutes = new Promise((resolve, reject) => { if (mapInstance.loaded()) { addRoutes(); resolve(true); } else { mapInstance.once("load", () => { addRoutes(); resolve(true); }); } }); // Add error handling loadRoutes.catch((error) => { console.error("Error loading routes:", error); return html`

Error loading routes

`; }); return true; }39:Ta8d,viewof chargerpoints = { const mapInstance = mapContainer.map; function addChargingStations() { // Remove existing charging station markers if any const existingMarkers = document.querySelectorAll( ".charging-station-marker" ); existingMarkers.forEach((marker) => marker.remove()); // Create unique charging stations map to avoid duplicates const uniqueStations = new Map(); charged_vehicles.forEach((station) => { const stationKey = `${station.chargingStationLat},${station.chargingStationLong}`; if (!uniqueStations.has(stationKey)) { uniqueStations.set(stationKey, { name: station.chargingStation, lat: station.chargingStationLat, long: station.chargingStationLong, vehicles: [] }); } uniqueStations.get(stationKey).vehicles.push({ vehicle: station.vehicle, distanceToCS: station.distanceToCS, load: station.load }); }); // Add markers for each unique charging station uniqueStations.forEach((station, key) => { const marker = new nextbillion.maps.Marker({ scale: 0.4, color: "#FF4500", // Orange-red color for charging stations className: "charging-station-marker" }) .setLngLat([station.long, station.lat]) .setPopup( new nextbillion.maps.Popup().setHTML(`

${station.name}

Vehicles assigned:

${v.vehicle} (${v.distanceToCS} away)
Load: ${v.load} units

`) ); // Add custom styling marker.getElement().style.border = "2px solid white"; marker.getElement().style.borderRadius = "50%"; marker.getElement().style.boxShadow = "0 0 4px rgba(0,0,0,0.4)"; // Add charging station icon const el = marker.getElement(); el.innerHTML = "⚡"; el.style.display = "flex"; el.style.alignItems = "center"; el.style.justifyContent = "center"; el.style.fontSize = "16px"; el.style.backgroundColor = "#FF4500"; el.style.color = "white"; marker.addTo(mapInstance); }); } if (mapInstance.loaded()) { addChargingStations(); } else { mapInstance.on("load", addChargingStations); } return true; }3a:T6ad,async function mvrp( data, options = { objective: { minimise_num_depots: false, travel_cost: "distance" } } ) { let url = ""; if (0) { url = `https://api.nextbillion.io/optimization/v2`; } else { url = `https://api.nextbillion.io/optimise-mvrp`; } //url = `https://api.nextbillion.io/optimization/v2`; const optimizeRequest = await axios .post(`${url}` + `?key=opensesame`, { ...data, options }) .then((res) => res.data); const mvrpRequestId = optimizeRequest.id; let attempts = 0; while (attempts < 50) { const result = await axios({ url: `${url}/result?id=${mvrpRequestId}&key=opensesame`, method: "GET", headers: {} }); if ( result.data && result.data.status === "Ok" && result.data.message == "" ) { result.data.id = mvrpRequestId; // KPIs let deliveryCount = 0; result.data.result.routes.forEach((rte, rteidx) => { rte.steps.forEach((step, index) => { if (step.id && step.id != 99) { ++deliveryCount; } }); }); result.data.kpis = { totalDistance: `${(result.data.result.summary.distance / 1000).toFixed( 1 )} km`, totalTime: `${(result.data.result.summary.duration / 60).toFixed( 1 )} mn`, nbrRoutes: result.data.result.summary.routes, avgStops: (deliveryCount / result.data.result.summary.routes).toFixed( 1 ), unassigned: result.data.result.summary.unassigned }; return result.data; } attempts++; await new Promise((resolve) => setTimeout(resolve, 5 * 1000)); } }3b:[{"id":"a5d71f33413081faac27f2a03c4dd8e919f5799f21e7c68f24fe57cd756e91d7e6dcc38c5a7438d0e0171e438e9e16488a59824bbf171ef18aea28df3f8b69e0","href":"https://static.observableusercontent.com/files/a5d71f33413081faac27f2a03c4dd8e919f5799f21e7c68f24fe57cd756e91d7e6dcc38c5a7438d0e0171e438e9e16488a59824bbf171ef18aea28df3f8b69e0","name":"Dynamon - Charger_Availability.csv","type":"text/csv","lastModified":1739248238229.116,"size":1226},{"id":"59f07dd07232cc9c57795fbb72ab8750221b05f8f3eff927cbf290b12b75fbfd3e52a51d9463da5aadf40c8ac7e6dc5025d3122c08bd5a560711e77878a95cd2","href":"https://static.observableusercontent.com/files/59f07dd07232cc9c57795fbb72ab8750221b05f8f3eff927cbf290b12b75fbfd3e52a51d9463da5aadf40c8ac7e6dc5025d3122c08bd5a560711e77878a95cd2","name":"Dynamon - Charger_Availability@1.csv","type":"text/csv","lastModified":1737979925930.939,"size":1100},{"id":"a0044f4cd546dfefe86dbfbcf5020d9dcd82c16bef72c3eee8e2a2bc2c33356f264cc41957c666f7c2a9ca7eb03ca886ac7fe27eb110d622b342d8ec7176ef23","href":"https://static.observableusercontent.com/files/a0044f4cd546dfefe86dbfbcf5020d9dcd82c16bef72c3eee8e2a2bc2c33356f264cc41957c666f7c2a9ca7eb03ca886ac7fe27eb110d622b342d8ec7176ef23","name":"Dynamon - vehicles.csv","type":"text/csv","lastModified":1737979925930.939,"size":2357},{"id":"d676c57b6941810ef90706119f31a5d1d8a9eb35829a3f979cdfe42153dc81fc2a9355d086b29351c08b1c3329095f768bc2268b65b84e022303dcfb7e9f80c0","href":"https://static.observableusercontent.com/files/d676c57b6941810ef90706119f31a5d1d8a9eb35829a3f979cdfe42153dc81fc2a9355d086b29351c08b1c3329095f768bc2268b65b84e022303dcfb7e9f80c0","name":"alljobs.csv","type":"text/csv","lastModified":1738048510252.004,"size":32431}] 2d:{"id":"78b980e5b0ee2ddd","slug":"optimizing-ev-deliveries-seamless-route-planning-w","title":"Optimizing EV Deliveries: Seamless Route Planning with Charging Stops","thumbnail":"adf56c36308e12d73b5f79c9c8a655b660a68bc85db9d7f194694965a80064e3","access_level":"unlisted","create_time":"$D2025-01-27T12:12:05.930Z","update_time":"$D2025-03-27T05:55:06.100Z","view_time":null,"first_public_time":"$D2025-01-28T10:32:54.447Z","has_unpublished_edits":null,"fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"05baed136f9134c1","login":"nbai","name":"NB.AI Solutions Team","avatar_url":"https://avatars-next.observableusercontent.com/7a25d1b5deb9c5290b12e4e0914aacdbd4196bb5c3a94c63a0fda0fe706d28b2","tier":"starter_2024"},"version":2203,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"53e0d2bd94fa8912","login":"dhivya-s","name":"Dhivya Selvarajan","avatar_url":"https://avatars-next.observableusercontent.com/c2ddc5b79da0e63c190a3f3ac91670f23f26b4bc0b1be30699fe67082ccb4f0b","tier":null}],"members":[{"type":"team","id":"05baed136f9134c1","login":"nbai","name":"NB.AI Solutions Team","avatar_url":"https://avatars-next.observableusercontent.com/7a25d1b5deb9c5290b12e4e0914aacdbd4196bb5c3a94c63a0fda0fe706d28b2","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":true,"trashed":false,"lapsed":null,"subscribed":null,"forks":2,"collection":{"id":"73d557bcc8a3ebc8","slug":"solutions","title":"Solutions","owner":{"id":"05baed136f9134c1","login":"nbai","name":"NB.AI Solutions Team"}},"type":"notebook","body":{"title":"Optimizing EV Deliveries: Seamless Route Planning with Charging Stops","cells":[{"id":0,"value":"# Optimizing EV Deliveries: Seamless Route Planning with Charging Stops","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1906,"value":"$2f","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":19,"value":"viewof apiKey = secret2(\"apiKey\", {\n title: \"NextBillion.ai API Key\",\n submit: \"Set\",\n description:\n \"Contact support@nextbillion.ai to get your API key\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1889,"value":"## Jobs","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1476,"value":"Jobs = await FileAttachment(\"alljobs.csv\").csv({typed: \"auto\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"Jobs","database":"$undefined"},{"id":1701,"value":"alljobs = Jobs","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":731,"value":"## Vehicles\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1442,"value":"Vehicles = await FileAttachment(\"Dynamon - vehicles.csv\").csv({typed: \"auto\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"Vehicles","database":"$undefined"},{"id":728,"value":"## Route Optimisation","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":742,"value":"$30","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":790,"value":"vrpID = {\n let locations = Object({});\n\n let url = `https://api.nextbillion.io/optimization/v2?key=${apiKey}`;\n\n let bodyData = {\n description: `EV Routing Plan}`,\n locations: {\n id: 2,\n location: tempVRPProblem.locations\n },\n // set vehicles information\n vehicles: tempVRPProblem.vehicles,\n jobs: tempVRPProblem.jobs,\n options: {\n travel_cost: \"duration\"\n }\n };\n console.log(\"Request Body Data:\", JSON.stringify(bodyData, null, 2));\n\n const response = await fetch(url, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\"\n },\n body: JSON.stringify(bodyData)\n });\n const jsonResponse = await response.json(); // Parse the response to JSON\n return jsonResponse;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":839,"value":"html`

If you get a status message indicating Job still processing just wait a few seconds and press this button.

${viewof requestResult}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":892,"value":"checkStatus = {\n vrpID;\n requestResult;\n let url = `https://api.nextbillion.io/optimization/v2/result?key=${apiKey}&id=${vrpID.id}`;\n let retval = null;\n\n yield Promises.delay(5000).then(() => {\n retval = fetch(url).then((response) => response.json());\n return retval;\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":863,"value":" \n ","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":909,"value":"ncc_url = {\n const result = await axios({\n url: `https://api.nextbillion.io/optimization/v2/create_shared_result?key=${apiKey}&id=${vrpID.id}`,\n method: \"GET\",\n headers: {}\n });\n return `console.nextbillion.ai/route-planner-viewer?id=${vrpID.id}&host=api.nextbillion.io`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1894,"value":"## Charging Stations","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1512,"value":"chargingStations = await FileAttachment(\"Dynamon - Charger_Availability.csv\").csv({typed: \"auto\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"chargingStations","database":"$undefined"},{"id":1525,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1551,"value":"locationsNear70to90km = findLocationsInRange(checkStatus)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1611,"value":"// Filter routes without charging stations\nroutesWithoutCharging = locationsNear70to90km.filter(\n (route) => !route.description?.endsWith(\"ChargingStn\") && !route.message\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1613,"value":"fetchClosestChargingStations(routesWithoutCharging, chargingStations, apiKey)\n .then((results) => {\n console.log(\"Closest Charging Stations Array:\", results); // Logs the result array\n })\n .catch((error) => {\n console.error(\"Error during DM API execution:\", error);\n })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1618,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1647,"value":"closestCS = await fetchClosestChargingStations(\n routesWithoutCharging,\n chargingStations,\n apiKey\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1833,"value":"function formatTimestamp(timestampInSeconds) {\n if (!timestampInSeconds) return \"N/A\";\n // Convert seconds to milliseconds\n const dateObj = new Date(timestampInSeconds * 1000);\n\n // Extract and format each component\n const year = dateObj.getFullYear();\n const month = String(dateObj.getMonth() + 1).padStart(2, \"0\");\n const day = String(dateObj.getDate()).padStart(2, \"0\");\n const hours = String(dateObj.getHours()).padStart(2, \"0\");\n const minutes = String(dateObj.getMinutes()).padStart(2, \"0\");\n const seconds = String(dateObj.getSeconds()).padStart(2, \"0\");\n\n return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1659,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1662,"value":"vehicles_afterCS = combineData(locationsNear70to90km, closestCS)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1780,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1786,"value":"updated_vehicles = integrateVehicles(Vehicles, vehicles_afterCS)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1896,"value":"## Vehicles and their Charging stops along the Route","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1797,"value":"charged_vehicles = updated_vehicles","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"charged_vehicles","database":"$undefined"},{"id":1682,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1685,"value":"JobsToBeCompleted = extractJobsAfterLocations(\n checkStatus,\n locationsNear70to90km\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1718,"value":"$36","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1723,"value":"integratedData = integrateTables(alljobs, JobsToBeCompleted)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1899,"value":"## Jobs to be Completed after Charging","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1726,"value":"pendingjobs = integratedData","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"pendingjobs","database":"$undefined"},{"id":1732,"value":"$37","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1746,"value":"vrpID2 = {\n let locations = Object({});\n\n let url = `https://api.nextbillion.io/optimization/v2?key=${apiKey}`;\n\n let bodyData = {\n description: `EV Routing Plan}`,\n locations: {\n id: 2,\n location: tempVRPProblem2.locations\n },\n // set vehicles information\n vehicles: tempVRPProblem2.vehicles,\n jobs: tempVRPProblem2.jobs,\n options: {\n travel_cost: \"duration\",\n custom: {\n type: \"min\",\n value: \"vehicles\"\n }\n }\n };\n console.log(\"Request Body Data:\", JSON.stringify(bodyData, null, 2));\n\n const response = await fetch(url, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\"\n },\n body: JSON.stringify(bodyData)\n });\n const jsonResponse = await response.json(); // Parse the response to JSON\n return jsonResponse;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1750,"value":"\ncheckStatus2 = {\n vrpID2;\n let url = `https://api.nextbillion.io/optimization/v2/result?key=${apiKey}&id=${vrpID2.id}`;\n let retval = null;\n\n yield Promises.delay(5000).then(() => {\n retval = fetch(url).then((response) => response.json());\n return retval;\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1758,"value":" \n ","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1754,"value":"ncc_url2 = {\n const result = await axios({\n url: `https://api.nextbillion.io/optimization/v2/create_shared_result?key=${apiKey}&id=${vrpID2.id}`,\n method: \"GET\",\n headers: {}\n });\n return `console.nextbillion.ai/route-planner-viewer?id=${vrpID2.id}&host=api.nextbillion.io`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1961,"value":"{\n nextbillion.setApiKey(apiKey);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1957,"value":"// Create the map view\nviewof mapContainer = {\n // Wait for API key\n apiKey;\n await visibility();\n\n // Create container\n const container = html`

`;\n\n yield container;\n\n // Initialize map center\n const nbmap = (container.value = new nextbillion.maps.Map({\n container: document.getElementById(\"map\"),\n center: { lat: 52.4862, lng: -1.8904 }, //-1.8904, 52.4862\n zoom: 11,\n maxZoom: 15,\n minZoom: 5,\n style: \"https://api.nextbillion.io/maps/streets/style.json\",\n scrollZoom: true\n }));\n\n return container;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2044,"value":"// Utility function to decode polylines\ndecodePolyline = function (str, precision = 5) {\n let index = 0,\n lat = 0,\n lng = 0,\n coordinates = [],\n shift = 0,\n result = 0,\n byte = null,\n latitude_change,\n longitude_change,\n factor = Math.pow(10, precision);\n\n while (index < str.length) {\n byte = null;\n shift = 0;\n result = 0;\n\n do {\n byte = str.charCodeAt(index++) - 63;\n result |= (byte & 0x1f) << shift;\n shift += 5;\n } while (byte >= 0x20);\n\n latitude_change = result & 1 ? ~(result >> 1) : result >> 1;\n\n shift = result = 0;\n\n do {\n byte = str.charCodeAt(index++) - 63;\n result |= (byte & 0x1f) << shift;\n shift += 5;\n } while (byte >= 0x20);\n\n longitude_change = result & 1 ? ~(result >> 1) : result >> 1;\n\n lat += latitude_change;\n lng += longitude_change;\n\n coordinates.push([lng / factor, lat / factor]);\n }\n\n return coordinates;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2191,"value":"$38","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2175,"value":"$39","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":86,"value":"## Dependencies","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":89,"value":"clusters = [\"2\", \"3\", \"4\", \"5\"]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":91,"value":"inputs = {\n const inputs = {\n clusters: Inputs.select(clusters, {\n label: \"No of Clusters\",\n value: \"5\"\n }),\n day: Inputs.select(day, {\n label: \"select the day\",\n value: \"Monday\"\n }),\n month: Inputs.select(month, {\n label: \"select the month\",\n value: \"Jan\"\n }),\n year: Inputs.select(year, {\n label: \"select the year\",\n value: \"2025\"\n })\n };\n return inputs;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":100,"value":"mutable inputData_a = null","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":102,"value":"mutable run_optimization = false","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":159,"value":"html`${viewof requestResult}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":163,"value":"viewof requestResult = Inputs.button(\"Request Result\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":114,"value":"axios = {\n let axios = await require(\"axios\");\n return axios;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":519,"value":"year = [\"2025\", \"2026\", \"2027\"]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":517,"value":"month = [\n \"Jan\",\n \"Feb\",\n \"Mar\",\n \"Apr\",\n \"May\",\n \"Jun\",\n \"Jul\",\n \"Aug\",\n \"Sep\",\n \"Oct\",\n \"Nov\",\n \"Dec\"\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":510,"value":"day = [\"Monday\", \"Tuesday\", \"Wednesday\", \"Thursday\", \"Friday\"]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":548,"value":"// A `template` callback for Inputs.form() that displays all inputs inline.\nfunction filterBar(inputs) {\n const scope = DOM.uid().id;\n return htl.html`

${Object.values(inputs)}\n