27:null 28:["$","title",null,{"children":"Indoor Factory Routing_with waypoint stops | NB.AI Solutions Team | Observable"}] 2d:T1a0e,viewof vehicleSelection = { const form = html`

Vehicle

Start

End

Driver Break

Break Start

Break Duration (min)

`; const style = html` `; document.head.appendChild(style); // Set default values const now = new Date(); const later = new Date(now.getTime() + 12 * 60 * 60 * 1000); // 1 hour later // Set default break time (2 hours after current time) const defaultBreakStart = new Date(now.getTime() + 2 * 60 * 60 * 1000); // 2 hours later // Format date for datetime-local input const formatDatetime = (date) => { return date.toISOString().slice(0, 19); }; const vehicleSelect = form.querySelector("#vehicle-type"); const startTimeInput = form.querySelector("#start-time"); const endTimeInput = form.querySelector("#end-time"); const breakStartInput = form.querySelector("#break-start-time"); const breakDurationInput = form.querySelector("#break-duration"); // Set default values startTimeInput.value = formatDatetime(now); endTimeInput.value = formatDatetime(later); breakStartInput.value = formatDatetime(defaultBreakStart); // Initialize the value object let value = { vehicleType: vehicleSelect.value, startTime: startTimeInput.value, endTime: endTimeInput.value, breakStartTime: breakStartInput.value, breakDuration: parseInt(breakDurationInput.value), // Add computed properties for Unix timestamps get startTimeUnix() { return new Date(this.startTime).getTime() / 1000; }, get endTimeUnix() { return new Date(this.endTime).getTime() / 1000; }, get breakStartTimeUnix() { return new Date(this.breakStartTime).getTime() / 1000; }, get breakEndTimeUnix() { return this.breakStartTimeUnix + this.breakDuration * 60; // Convert minutes to seconds } }; // Add event listeners vehicleSelect.addEventListener("change", () => { value.vehicleType = vehicleSelect.value; form.dispatchEvent(new CustomEvent("input")); }); startTimeInput.addEventListener("change", () => { value.startTime = startTimeInput.value; form.dispatchEvent(new CustomEvent("input")); }); endTimeInput.addEventListener("change", () => { value.endTime = endTimeInput.value; form.dispatchEvent(new CustomEvent("input")); }); breakStartInput.addEventListener("change", () => { value.breakStartTime = breakStartInput.value; form.dispatchEvent(new CustomEvent("input")); }); breakDurationInput.addEventListener("change", () => { value.breakDuration = parseInt(breakDurationInput.value); form.dispatchEvent(new CustomEvent("input")); }); // Define the value property Object.defineProperty(form, "value", { get: () => value, set: (v) => { value = v; if (v.vehicleType) vehicleSelect.value = v.vehicleType; if (v.startTime) startTimeInput.value = v.startTime; if (v.endTime) endTimeInput.value = v.endTime; if (v.breakStartTime) breakStartInput.value = v.breakStartTime; if (v.breakDuration) breakDurationInput.value = v.breakDuration; } }); return form; }2e:T1518,vehicleCapacity = { // Get the current vehicle type from the selection const vehicleType = vehicleSelection.vehicleType; // Define capacity data for each vehicle const capacities = { "Van 1": { fullPallets: 18, halfPallets: 36 }, "Van 2": { fullPallets: 9, halfPallets: 18 }, "Van 3": { fullPallets: 19, halfPallets: 28 } }; // Get capacity for the selected vehicle const capacity = capacities[vehicleType]; // Create the display element const container = html`

${vehicleType} Capacity: ${capacity.fullPallets} Full Pallets or ${capacity.halfPallets} Half Pallets

Daily Load

Full Pallets

Half Pallets

`; // Add styles const style = html` `; document.head.appendChild(style); // Get the input elements const fullPalletsInput = container.querySelector("#full-pallets"); const halfPalletsInput = container.querySelector("#half-pallets"); // Set default values (you can change these as needed) fullPalletsInput.value = capacity.fullPallets * 2; // Default to double capacity halfPalletsInput.value = capacity.halfPallets * 2; // Default to double capacity // Create a value object to store the current load let value = { fullPallets: parseInt(fullPalletsInput.value), halfPallets: parseInt(halfPalletsInput.value), vehicleType: vehicleType, capacity: capacity }; // Add event listeners to update the value when inputs change fullPalletsInput.addEventListener("input", () => { value.fullPallets = parseInt(fullPalletsInput.value) || 0; container.dispatchEvent(new CustomEvent("input")); }); halfPalletsInput.addEventListener("input", () => { value.halfPallets = parseInt(halfPalletsInput.value) || 0; container.dispatchEvent(new CustomEvent("input")); }); // Define the value property for the container Object.defineProperty(container, "value", { get: () => value, set: (v) => { value = v; if (v.fullPallets !== undefined) fullPalletsInput.value = v.fullPallets; if (v.halfPallets !== undefined) halfPalletsInput.value = v.halfPallets; } }); return container; }2f:T117c,vehiclePath = { // Get the current vehicle type from the selection const vehicleType = vehicleSelection.vehicleType; // Define path data for each vehicle const paths = { "Van 1": [ { type: "stop", name: "Loading Point V1", serviceTime: 5 }, { type: "travel", time: 7 }, { type: "stop", name: "Stop V", serviceTime: 2 }, { type: "travel", time: 1 }, { type: "stop", name: "Stop A", serviceTime: 1 }, { type: "travel", time: 1 }, { type: "stop", name: "Unloading Point V1", serviceTime: 5 } ], "Van 2": [ { type: "stop", name: "Loading Point V2", serviceTime: 5 }, { type: "travel", time: 7 }, { type: "stop", name: "Stop V", serviceTime: 2 }, { type: "travel", time: 1 }, { type: "stop", name: "Stop A", serviceTime: 1 }, { type: "travel", time: 1 }, { type: "stop", name: "Unloading Point V2", serviceTime: 5 } ], "Van 3": [ { type: "stop", name: "Loading Point V3", serviceTime: 5 }, { type: "travel", time: 7 }, { type: "stop", name: "Stop V", serviceTime: 2 }, { type: "travel", time: 1 }, { type: "stop", name: "Stop A", serviceTime: 1 }, { type: "travel", time: 1 }, { type: "stop", name: "Unloading Point V3", serviceTime: 5 } ] }; // Get path for the selected vehicle const path = paths[vehicleType]; // Create the diagram container const container = html`

`; // Build the path diagram path.forEach((segment, index) => { if (segment.type === "stop") { // Create stop node const stopNode = html`

${segment.name}

Service: ${segment.serviceTime} mins

`; container.appendChild(stopNode); } else if (segment.type === "travel" && index < path.length - 1) { // Create travel segment const travelSegment = html`

${segment.time} mins

`; container.appendChild(travelSegment); } }); // Add styles const style = html` `; document.head.appendChild(style); return container; }30:T15c8,optimizationPayload = { // Create a function that returns the payload with the selected vehicle's capacity function getPayload(vehicleType) { // Get capacity based on vehicle type let maxFullPallets, maxHalfPallets; switch (vehicleType) { case "Van 1": maxFullPallets = 18; maxHalfPallets = 36; break; case "Van 2": maxFullPallets = 9; maxHalfPallets = 18; break; case "Van 3": maxFullPallets = 19; maxHalfPallets = 28; break; default: maxFullPallets = 18; maxHalfPallets = 36; } // Generate alternative capacities const alternativeCapacities = generateAlternativeCapacities( maxFullPallets, maxHalfPallets ); // Convert start and end times to Unix timestamps (if vehicleSelection exists) let startTime = Math.floor(Date.now() / 1000); let endTime = startTime + 86400; // 24 hours later if (typeof vehicleSelection !== "undefined") { startTime = new Date(vehicleSelection.startTime).getTime() / 1000; endTime = new Date(vehicleSelection.endTime).getTime() / 1000; } // Get break times let breakStartTime = startTime + 7200; // Default: 2 hours after start let breakEndTime = breakStartTime + 1440; // Default: 24 minutes break if ( typeof vehicleSelection !== "undefined" && vehicleSelection.breakStartTimeUnix && vehicleSelection.breakEndTimeUnix ) { breakStartTime = vehicleSelection.breakStartTimeUnix; breakEndTime = vehicleSelection.breakEndTimeUnix; } // Get daily load from vehicleCapacity if available let fullPalletsLoad = 36; // Default let halfPalletsLoad = 72; // Default if (typeof vehicleCapacity !== "undefined" && vehicleCapacity.value) { fullPalletsLoad = vehicleCapacity.value.fullPallets || 0; halfPalletsLoad = vehicleCapacity.value.halfPallets || 0; } // Generate shipments based on daily load const shipments = generateShipments(fullPalletsLoad, halfPalletsLoad); const payload = { vehicles: [ { // Removed capacity field, only using alternative_capacities alternative_capacities: alternativeCapacities, id: vehicleType, start_index: 0, time_window: [startTime, endTime], break: { id: 1, time_windows: [[breakStartTime, breakEndTime]] } } ], shipments: shipments, options: { objective: { travel_cost: "duration" }, routing: { mode: "car" } }, duration_matrix: [ [0, 420, 840, 900], [660, 0, 420, 480], [240, 660, 0, 60], [180, 600, 1020, 0] ], locations: { id: 1, location: [ "59.1910,17.6300", "59.1875,17.6150", "59.1835,17.6090", "59.1905,17.6215" ] }, description: `${vehicleType}|${ new Date().toISOString().split("T")[0] }|Route Optimization|${fullPalletsLoad + halfPalletsLoad} items` }; // Log the full payload JSON that will be used in the request console.log("Request Payload:"); console.log(JSON.stringify(payload, null, 2)); return payload; } // FIXED FUNCTION: Generate alternative capacities correctly function generateAlternativeCapacities(maxFullPallets, maxHalfPallets) { const alternatives = []; // Each full pallet takes the space of 2 half pallets const totalHalfPalletSpaces = maxFullPallets * 2; // Generate all valid combinations for (let fullPallets = maxFullPallets; fullPallets >= 0; fullPallets--) { // Calculate how many half-pallet spaces are left const remainingHalfPalletSpaces = totalHalfPalletSpaces - fullPallets * 2; // This many half pallets can fit const halfPallets = Math.min(remainingHalfPalletSpaces, maxHalfPallets); // Add this combination alternatives.push([fullPallets, halfPallets]); // Also add the combination with one fewer half pallet if possible if (halfPallets > 0) { alternatives.push([fullPallets, halfPallets - 1]); } } return alternatives; } // Function to generate shipments based on daily load function generateShipments(fullPalletsCount, halfPalletsCount) { const shipments = []; // Generate shipments for full pallets for (let i = 0; i < fullPalletsCount; i++) { shipments.push({ pickup: { id: `Full_Pallet_${i + 1}`, location: "59.1910,17.6300", service: 300, location_index: 0 }, delivery: { id: `Full_Pallet_Delivery_${i + 1}`, location: "59.1905,17.6215", service: 120, location_index: 3 }, amount: [1, 0] // One full pallet, zero half pallets }); } // Generate shipments for half pallets for (let i = 0; i < halfPalletsCount; i++) { shipments.push({ pickup: { id: `Half_Pallet_${i + 1}`, location: "59.1910,17.6300", service: 300, location_index: 0 }, delivery: { id: `Half_Pallet_Delivery_${i + 1}`, location: "59.1905,17.6215", service: 120, location_index: 3 }, amount: [0, 1] // Zero full pallets, one half pallet }); } return shipments; } // Return the function so it can be called from other cells return getPayload; }31:T22c2,runOptimization = { // Create the UI container const container = html`

`; const button = container.querySelector(".optimize-button"); const progressBar = container.querySelector(".progress-bar"); const progressText = container.querySelector(".progress-text"); const resultsArea = container.querySelector(".results-area"); // Add styles const style = html` `; document.head.appendChild(style); // Update progress bar function updateProgress(value) { progressBar.style.width = `${value}%`; progressText.textContent = `${value}%`; } // Function to display results function displayResults(data) { resultsArea.innerHTML = ""; resultsArea.style.display = "block"; // Create success message const successMessage = document.createElement("div"); successMessage.className = "success-message"; successMessage.textContent = "Route optimization completed successfully!"; resultsArea.appendChild(successMessage); // Add full JSON response in a collapsible section const jsonResponse = document.createElement("details"); jsonResponse.innerHTML = `

View Full Response

${JSON.stringify(data, null, 2)}

`; resultsArea.appendChild(jsonResponse); } // Function to display error function displayError(error) { resultsArea.innerHTML = ""; resultsArea.style.display = "block"; const errorMessage = document.createElement("div"); errorMessage.className = "error-message"; errorMessage.textContent = `Error: ${ error.message || "Failed to optimize route" }`; resultsArea.appendChild(errorMessage); } // Implementation of mvrp function async function mvrp(data) { const url = "https://api.nextbillion.io/optimization/v2"; updateProgress(0); try { console.log("Sending initial optimization request..."); // Make the initial request const response = await fetch(`${url}?key=${apiKey}`, { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(data) }); if (!response.ok) { const errorText = await response.text(); throw new Error( `Initial request failed: ${response.status} ${response.statusText} - ${errorText}` ); } const optimizeRequest = await response.json(); const mvrpRequestId = optimizeRequest.id; console.log(`Optimization job created with ID: ${mvrpRequestId}`); console.log("Polling for results..."); let attempts = 0; while (attempts < 100) { console.log(`Polling attempt ${attempts + 1}/100`); updateProgress(attempts); try { const resultResponse = await fetch( `${url}/result?id=${mvrpRequestId}&key=${apiKey}`, { method: "GET" } ); if (!resultResponse.ok) { const errorText = await resultResponse.text(); console.warn( `Poll request error: ${resultResponse.status} ${resultResponse.statusText} - ${errorText}` ); attempts++; await new Promise((resolve) => setTimeout(resolve, 5000)); continue; } const result = await resultResponse.json(); if ( result.status === "Ok" && result.message !== "Job still processing" ) { console.log("Optimization completed successfully!"); // Add ID and KPIs result.id = mvrpRequestId; // Calculate KPIs let deliveryCount = 0; if (result.result && result.result.routes) { result.result.routes.forEach((rte) => { rte.steps.forEach((step) => { if (step.id && step.id != 99) { ++deliveryCount; } }); }); result.kpis = { totalDistance: `${( result.result.summary.distance / 1000 ).toFixed(1)} km`, totalTime: result.result.summary.duration, nbrRoutes: result.result.summary.routes, nbrOrders: deliveryCount, avgStops: ( deliveryCount / result.result.summary.routes ).toFixed(1), unassigned: result.result.summary.unassigned, planDate: result.description ? result.description.split("|")[1] : new Date().toISOString().split("T")[0], totalItems: result.description ? result.description.split("|")[3] : "N/A" }; } updateProgress(100); return result; } else { console.log(`Status: ${result.status}, Message: ${result.message}`); } } catch (error) { console.error(`Error during polling: ${error.message}`); } attempts++; updateProgress(attempts); await new Promise((resolve) => setTimeout(resolve, 5000)); } throw new Error("Optimization timed out after 100 polling attempts"); } catch (error) { console.error(`Error in mvrp function: ${error.message}`); throw error; } } // Add click event to the button button.addEventListener("click", async () => { // Check if API key is available if (!apiKey) { displayError({ message: "API key is required. Please set your NextBillion.ai API key." }); return; } // Show loading state resultsArea.innerHTML = '

Processing...

'; resultsArea.style.display = "block"; button.disabled = true; try { // Get the payload using the function from the other cell const payload = optimizationPayload(vehicleSelection.vehicleType); console.log("Using payload for vehicle:", vehicleSelection.vehicleType); // Run the optimization const result = await mvrp(payload); // Store the result globally so the summary can access it window.optimizationResults = result; // Update the summary if it exists if (typeof routeSummary !== "undefined" && routeSummary.updateSummary) { routeSummary.updateSummary(result); } // Display results displayResults(result); } catch (error) { displayError(error); } finally { button.disabled = false; } }); return container; }32:T759,routeSummary = { // Create simple text container const container = html`

`; // Minimal styling const style = html` `; document.head.appendChild(style); // Function to update the summary function updateSummary(data) { if (!data?.result?.routes?.[0]?.steps) { container.innerHTML = `

Waiting for optimization results...

`; return; } const steps = data.result.routes[0].steps; const loops = []; let currentLoop = null; let loopCounter = 1; steps.forEach((step) => { if (step.type === "pickup") { currentLoop = { id: loopCounter++, load: step.load ? [...step.load] : [0, 0] }; } else if (step.type === "delivery" && currentLoop) { loops.push(currentLoop); currentLoop = null; } }); let html = `

Delivery loops: ${loops.length}

`; loops.forEach((loop) => { const full = loop.load[0] || 0; const half = loop.load[1] || 0; html += `

Loop ${loop.id}: ${full} full, ${half} half

`; }); container.innerHTML = html; } // Check for results function checkForResults() { if (window.optimizationResults) { updateSummary(window.optimizationResults); } } checkForResults(); setInterval(checkForResults, 2000); container.updateSummary = updateSummary; return container; }33:T1c8f,loopBasedPayload = { // Create a function that returns the payload with jobs, shipments and relations function getPayload(vehicleType) { // Get capacity based on vehicle type let capacity; switch (vehicleType) { case "Van 1": capacity = [18, 36]; break; case "Van 2": capacity = [9, 18]; break; case "Van 3": capacity = [19, 28]; break; default: capacity = [18, 36]; } // Convert start and end times to Unix timestamps let startTime = Math.floor(Date.now() / 1000); let endTime = startTime + 86400; // 24 hours later if (typeof vehicleSelection !== "undefined") { startTime = new Date(vehicleSelection.startTime).getTime() / 1000; endTime = new Date(vehicleSelection.endTime).getTime() / 1000; } // Get break times let breakStartTime = startTime + 7200; // Default: 2 hours after start let breakEndTime = breakStartTime + 1440; // Default: 24 minutes break if ( typeof vehicleSelection !== "undefined" && vehicleSelection.breakStartTimeUnix && vehicleSelection.breakEndTimeUnix ) { breakStartTime = vehicleSelection.breakStartTimeUnix; breakEndTime = vehicleSelection.breakEndTimeUnix; } // Generate jobs, shipments and relations based on loop data const { jobs, shipments, relations } = generateLoopBasedData(); const payload = { vehicles: [ { capacity: capacity, id: vehicleType, start_index: 0, time_window: [startTime, endTime], break: { id: 1, time_windows: [[breakStartTime, breakEndTime]] } } ], jobs: jobs, shipments: shipments, relations: relations, options: { objective: { travel_cost: "duration" }, routing: { mode: "car" } }, duration_matrix: [ [0, 420, 840, 900], [660, 0, 420, 480], [240, 660, 0, 60], [180, 600, 1020, 0] ], locations: { id: 1, location: [ "59.1910,17.6300", "59.1875,17.6150", "59.1835,17.6090", "59.1905,17.6215" ] }, description: `${vehicleType}|${ new Date().toISOString().split("T")[0] }|Loop-Based Route Optimization|${shipments.length} loops` }; // Log the full payload JSON console.log("Loop-Based Request Payload with Jobs and Relations:"); console.log(JSON.stringify(payload, null, 2)); return payload; } // Function to calculate delivery loops and extract load data function calculateDeliveryLoops() { if (!window.optimizationResults?.result?.routes?.[0]?.steps) { return []; } const steps = window.optimizationResults.result.routes[0].steps; const loops = []; let currentLoop = null; let loopCounter = 1; steps.forEach((step) => { if (step.type === "pickup") { currentLoop = { id: loopCounter++, pickup: step, jobs: [], delivery: null, load: step.load ? [...step.load] : [0, 0] }; } else if (step.type === "job" && currentLoop) { currentLoop.jobs.push(step); } else if (step.type === "delivery" && currentLoop) { currentLoop.delivery = step; loops.push(currentLoop); currentLoop = null; } }); return loops; } // Function to generate jobs, shipments and relations based on loop data function generateLoopBasedData() { const loops = calculateDeliveryLoops(); const jobs = []; const shipments = []; const relations = []; if (loops.length === 0) { // Fallback: create default data if no optimization results available console.log("No optimization results available, using default data"); return generateDefaultData(); } loops.forEach((loop, index) => { const loopId = index + 1; const fullPallets = loop.load[0] || 0; const halfPallets = loop.load[1] || 0; // Skip if no load if (fullPallets === 0 && halfPallets === 0) { return; } // Create jobs for this loop const vJobId = `stop V_${loopId}`; const aJobId = `stop A_${loopId}`; jobs.push({ id: vJobId, service: 120, location_index: 1 }); jobs.push({ id: aJobId, service: 60, location_index: 2 }); // Create shipment for this loop const pickupId = `Loading Point V1_${loopId}`; const deliveryId = `Unloading Point V1_${loopId}`; shipments.push({ pickup: { id: pickupId, location: "59.1910,17.6300", service: 300, location_index: 0 }, delivery: { id: deliveryId, location: "59.1905,17.6215", service: 120, location_index: 3 }, amount: [fullPallets, halfPallets] // Use actual loop load }); // Create relation for this loop: pickup -> V job -> A job -> delivery relations.push({ type: "in_direct_sequence", steps: [ { type: "pickup", id: pickupId }, { type: "job", id: vJobId }, { type: "job", id: aJobId }, { type: "delivery", id: deliveryId } ] }); }); console.log( `Generated ${jobs.length} jobs, ${shipments.length} shipments, and ${relations.length} relations based on loops` ); return { jobs, shipments, relations }; } // Fallback function for default data when no optimization results function generateDefaultData() { let fullPalletsLoad = 18; let halfPalletsLoad = 0; if (typeof vehicleCapacity !== "undefined" && vehicleCapacity.value) { fullPalletsLoad = vehicleCapacity.value.fullPallets || 18; halfPalletsLoad = vehicleCapacity.value.halfPallets || 0; } const jobs = [ { id: "stop V_1", service: 120, location_index: 1 }, { id: "stop A_1", service: 60, location_index: 2 } ]; const shipments = [ { pickup: { id: "Loading Point V1_1", location: "59.1910,17.6300", service: 300, location_index: 0 }, delivery: { id: "Unloading Point V1_1", location: "59.1905,17.6215", service: 120, location_index: 3 }, amount: [fullPalletsLoad, halfPalletsLoad] } ]; const relations = [ { type: "in_direct_sequence", steps: [ { type: "pickup", id: "Loading Point V1_1" }, { type: "job", id: "stop V_1" }, { type: "job", id: "stop A_1" }, { type: "delivery", id: "Unloading Point V1_1" } ] } ]; return { jobs, shipments, relations }; } // Return the function so it can be called from other cells return getPayload; }34:T2560,runLoopOptimization = { // Create the UI container const container = html`

`; const button = container.querySelector(".loop-optimize-button"); const progressBar = container.querySelector(".progress-bar"); const progressText = container.querySelector(".progress-text"); const resultsArea = container.querySelector(".results-area"); // Add styles const style = html` `; document.head.appendChild(style); // Update progress bar function updateProgress(value) { progressBar.style.width = `${value}%`; progressText.textContent = `${value}%`; } // Function to display results function displayResults(data) { resultsArea.innerHTML = ""; resultsArea.style.display = "block"; // Create success message const successMessage = document.createElement("div"); successMessage.className = "success-message"; successMessage.textContent = "Loop-based route optimization completed successfully!"; resultsArea.appendChild(successMessage); // Add full JSON response in a collapsible section const jsonResponse = document.createElement("details"); jsonResponse.innerHTML = `

View Full Response

${JSON.stringify(data, null, 2)}

`; resultsArea.appendChild(jsonResponse); } // Function to display error function displayError(error) { resultsArea.innerHTML = ""; resultsArea.style.display = "block"; const errorMessage = document.createElement("div"); errorMessage.className = "error-message"; errorMessage.textContent = `Error: ${ error.message || "Failed to optimize loop-based route" }`; resultsArea.appendChild(errorMessage); } // Implementation of mvrp function for loop-based optimization async function mvrpLoopBased(data) { const url = "https://api.nextbillion.io/optimization/v2"; updateProgress(0); try { console.log("Sending loop-based optimization request..."); // Make the initial request const response = await fetch(`${url}?key=${apiKey}`, { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(data) }); if (!response.ok) { const errorText = await response.text(); throw new Error( `Initial request failed: ${response.status} ${response.statusText} - ${errorText}` ); } const optimizeRequest = await response.json(); const mvrpRequestId = optimizeRequest.id; console.log( `Loop-based optimization job created with ID: ${mvrpRequestId}` ); console.log("Polling for results..."); let attempts = 0; while (attempts < 100) { console.log(`Polling attempt ${attempts + 1}/100`); updateProgress(attempts); try { const resultResponse = await fetch( `${url}/result?id=${mvrpRequestId}&key=${apiKey}`, { method: "GET" } ); if (!resultResponse.ok) { const errorText = await resultResponse.text(); console.warn( `Poll request error: ${resultResponse.status} ${resultResponse.statusText} - ${errorText}` ); attempts++; await new Promise((resolve) => setTimeout(resolve, 5000)); continue; } const result = await resultResponse.json(); if ( result.status === "Ok" && result.message !== "Job still processing" ) { console.log("Loop-based optimization completed successfully!"); // Add ID and KPIs result.id = mvrpRequestId; // Calculate KPIs let deliveryCount = 0; if (result.result && result.result.routes) { result.result.routes.forEach((rte) => { rte.steps.forEach((step) => { if (step.id && step.id != 99) { ++deliveryCount; } }); }); result.kpis = { totalDistance: `${( result.result.summary.distance / 1000 ).toFixed(1)} km`, totalTime: result.result.summary.duration, nbrRoutes: result.result.summary.routes, nbrOrders: deliveryCount, avgStops: ( deliveryCount / result.result.summary.routes ).toFixed(1), unassigned: result.result.summary.unassigned, planDate: result.description ? result.description.split("|")[1] : new Date().toISOString().split("T")[0], totalItems: result.description ? result.description.split("|")[3] : "N/A" }; } updateProgress(100); return result; } else { console.log(`Status: ${result.status}, Message: ${result.message}`); } } catch (error) { console.error(`Error during polling: ${error.message}`); } attempts++; updateProgress(attempts); await new Promise((resolve) => setTimeout(resolve, 5000)); } throw new Error( "Loop-based optimization timed out after 100 polling attempts" ); } catch (error) { console.error(`Error in loop-based mvrp function: ${error.message}`); throw error; } } // Add click event to the button button.addEventListener("click", async () => { // Check if API key is available if (!apiKey) { displayError({ message: "API key is required. Please set your NextBillion.ai API key." }); return; } // Check if optimization results are available for loop-based payload if (!window.optimizationResults) { displayError({ message: "Please run the initial optimization first to generate loop data." }); return; } // Show loading state resultsArea.innerHTML = '

Processing loop-based optimization...

'; resultsArea.style.display = "block"; button.disabled = true; try { // Get the loop-based payload using the function from loopBasedPayload const payload = loopBasedPayload(vehicleSelection.vehicleType); console.log( "Using loop-based payload for vehicle:", vehicleSelection.vehicleType ); // Run the loop-based optimization const result = await mvrpLoopBased(payload); // Store the result globally with a different name window.loopOptimizationResults = result; // Update the summary if it exists (you might want to create a separate summary for loop results) if (typeof routeSummary !== "undefined" && routeSummary.updateSummary) { // Optionally update the existing summary or create a new one // routeSummary.updateSummary(result); } // Display results displayResults(result); } catch (error) { displayError(error); } finally { button.disabled = false; } }); return container; }35:T47b0,loopRouteSummary = { // Create the UI container const container = html`

Loop-Based Routing Summary

Waiting for loop-based optimization results...

`; const summaryContent = container.querySelector(".summary-content"); let currentActiveTab = "overview"; // Track the currently active tab let lastResultsProcessed = false; // Track if we've processed results // Add styles (same as before) const style = html` `; document.head.appendChild(style); // Helper functions (same as before) function formatTime(timestamp) { const date = new Date(timestamp * 1000); return date.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }); } function formatDuration(seconds) { const hours = Math.floor(seconds / 3600); const minutes = Math.floor((seconds % 3600) / 60); if (hours > 0) { return `${hours}h ${minutes}m`; } else { return `${minutes}m`; } } function identifyLoopSequences(steps) { const sequences = []; let currentSequence = null; let sequenceCounter = 1; steps.forEach((step) => { if (step.type === "pickup") { currentSequence = { id: sequenceCounter++, pickup: step, vJob: null, aJob: null, delivery: null, load: step.load ? [...step.load] : [0, 0] }; } else if (step.type === "job" && currentSequence) { if (step.id && step.id.includes("V_")) { currentSequence.vJob = step; } else if (step.id && step.id.includes("A_")) { currentSequence.aJob = step; } } else if (step.type === "delivery" && currentSequence) { currentSequence.delivery = step; sequences.push(currentSequence); currentSequence = null; } }); return sequences; } function setupTabSwitching() { const tabs = container.querySelectorAll(".summary-tab"); tabs.forEach((tab) => { tab.addEventListener("click", () => { currentActiveTab = tab.getAttribute("data-tab"); container .querySelectorAll(".summary-tab") .forEach((t) => t.classList.remove("active")); container .querySelectorAll(".tab-content") .forEach((c) => c.classList.remove("active")); tab.classList.add("active"); const tabContent = container.querySelector(`#${currentActiveTab}-tab`); if (tabContent) { tabContent.classList.add("active"); } }); }); } // Updated updateSummary function with V Stops and A Stops removed function updateSummary(data) { console.log("Updating loop summary with data:", data); if ( !data || !data.result || !data.result.routes || data.result.routes.length === 0 ) { summaryContent.innerHTML = `

No valid loop-based optimization results available

`; return; } lastResultsProcessed = true; const route = data.result.routes[0]; const steps = route.steps; const totalDuration = formatDuration(data.result.summary.duration); const totalServiceTime = formatDuration(data.result.summary.service); const totalTravelTime = formatDuration( data.result.summary.duration + data.result.summary.service ); const sequences = identifyLoopSequences(steps); const breakInfo = steps.find((step) => step.type === "break"); const breakTime = breakInfo ? formatTime(breakInfo.arrival) : "No break scheduled"; const tabsHtml = `

Overview

Timeline

Loop Sequences (${sequences.length})

`; // Updated overview HTML without V Stops and A Stops const overviewHtml = `

Total Duration

${totalDuration}

Travel Time

${totalTravelTime}

Service Time

${totalServiceTime}

Loop Sequences

${sequences.length}

Vehicle

${route.vehicle}

Start Time

${formatTime(steps[0].arrival)}

${ breakInfo ? `

Driver break scheduled at ${breakTime}

` : "" }

`; // Timeline tab content (same as before) let timelineHtml = `

`; steps.forEach((step) => { const arrivalTime = formatTime(step.arrival); const departureTime = formatTime(step.arrival + (step.service || 0)); let eventClass = step.type; let eventTitle = ""; let eventDescription = ""; if (step.type === "job" && step.id) { if (step.id.includes("V_")) { eventClass = "job-v"; eventTitle = "V Stop"; eventDescription = `Service at ${step.id}`; } else if (step.id.includes("A_")) { eventClass = "job-a"; eventTitle = "A Stop"; eventDescription = `Service at ${step.id}`; } else { eventTitle = "Job"; eventDescription = `Service at ${step.id}`; } } else { switch (step.type) { case "start": eventTitle = "Start"; eventDescription = `Route starts at depot`; break; case "pickup": eventTitle = "Pickup"; eventDescription = `Loading at ${step.id || "depot"}`; break; case "delivery": eventTitle = "Delivery"; eventDescription = `Unloading at ${step.id || "destination"}`; break; case "break": eventTitle = "Break"; eventDescription = `Driver break`; break; case "end": eventTitle = "End"; eventDescription = `Route ends at depot`; break; } } timelineHtml += `

${arrivalTime}${ step.service ? ` - ${departureTime}` : "" }

${eventTitle}: ${eventDescription}

${ step.service ? `

Service time: ${formatDuration( step.service )}

` : "" } ${ step.duration ? `

Travel time from previous: ${formatDuration( step.duration )}

` : "" } ${ step.load ? `

Load after stop: ${step.load[0]} full pallets, ${step.load[1]} half pallets

` : "" }

`; }); timelineHtml += `

`; // Sequences tab content (same as before) let sequencesHtml = `

`; if (sequences.length > 0) { sequences.forEach((sequence) => { const startTime = formatTime(sequence.pickup.arrival); const endTime = sequence.delivery ? formatTime( sequence.delivery.arrival + (sequence.delivery.service || 0) ) : "N/A"; sequencesHtml += `

Sequence ${ sequence.id }: ${startTime} - ${endTime}

Load: ${ sequence.load[0] } full, ${sequence.load[1]} half

${ sequence.pickup.id || "Pickup" }

→

${ sequence.vJob ? `

${sequence.vJob.id}

→

` : "" } ${ sequence.aJob ? `

${sequence.aJob.id}

→

` : "" }

${ sequence.delivery?.id || "Delivery" }

`; }); } else { sequencesHtml += `

No loop sequences identified

`; } sequencesHtml += `

`; summaryContent.innerHTML = tabsHtml + overviewHtml + timelineHtml + sequencesHtml; setupTabSwitching(); } function checkForResults() { if (window.loopOptimizationResults) { console.log( "Found loop optimization results:", window.loopOptimizationResults ); updateSummary(window.loopOptimizationResults); } } checkForResults(); setInterval(checkForResults, 2000); container.updateSummary = updateSummary; return container; }36:[] 2b:{"id":"cd6f26848bd06223","slug":null,"title":"Indoor Factory Routing_with waypoint stops","thumbnail":"a489ca641c80f80bfe33c62241261177fab09bf4ba67754f2459738860d0ccad","access_level":"unlisted","create_time":"$D2025-05-20T05:17:09.563Z","update_time":"$D2025-06-11T06:28:30.772Z","view_time":null,"first_public_time":null,"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":225,"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":"individual","id":"bcb6b2e256659128","login":"jim-welch","name":"Jim Welch","avatar_url":"https://avatars-next.observableusercontent.com/6334ed2ccd004bd8ab34e9f05c047bf4ef291dea914767f26079d7756d073607","tier":null,"role":"editor"},{"type":"team","id":"05baed136f9134c1","login":"nbai","name":"NB.AI Solutions Team","avatar_url":"https://avatars-next.observableusercontent.com/7a25d1b5deb9c5290b12e4e0914aacdbd4196bb5c3a94c63a0fda0fe706d28b2","tier":"starter_2024","role":"viewer"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":2,"collection":null,"type":"notebook","body":{"title":"Indoor Factory Routing_with waypoint stops","cells":[{"id":0,"value":"# Indoor Factory Routing_with waypoint stops","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":5,"value":"This notebook demonstrates the process of leveraging NextBillion's APIs to create an optimized route plan tailored for indoor order management within factory and warehouse settings. The goal is to efficiently manage order picking, movement, and delivery within confined and structured environments.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":8,"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})\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":22,"value":"## Optimisation","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":27,"value":"The notebook follows the below steps,\n- Select the type of vehicle for which the plane needs to be generated and its start and end time\n- Duration matrix is given as input which determines the duration to travel from one stop to another within the factory\n- Plan the stops. As the stop sequence is predefined, the API will follow the predefined path to compute the route plan\n- Input the number of Breaks and breaks time window for the day","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":83,"value":"### Vehicles Info","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":32,"value":"$2d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":78,"value":"$2e","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":93,"value":"This is the path the vehicle has to follow","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":87,"value":"$2f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":95,"value":"## Planning","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":99,"value":"$30","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":120,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":137,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":200,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":207,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":211,"value":"$35","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"## Dependencies","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":13,"value":"import {\n secret2,\n cities,\n nextbillion,\n parameters\n} from \"@nbai/nextbillion-ai-dependencies\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":70,"value":"html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W36","stdlib":"1","titling":"auto"}} 2c:"$2b:body"