2b:null 2c:["$","title",null,{"children":"LTL Shipping: A Developer's Guide to NextBillion.ai APIs | Texoport's Workspace | Observable"}] 31:T41b,### Methodology * Using the *Flexible Directions* API, we find optimal paths for trucks from each of the manufacturers to the Columbus Shipping Hub * We allocate ${inputs.nTrucksAtOriginHub} long haul trucks to the Columbus Shipping Hub, and use the *Route Optimization API* to find optimal paths and item distributions for each of the trucks. The capacity of each long haul truck is **${inputs.longHaulTruckCapacity} pounds**. * We allocate ${inputs.nTrucksAtDestinationHubs} short haul trucks to each of the Destination Hubs, and the capacity of each short haul truck is **${inputs.shortHaulTruckCapacity} pounds**. We randomly decide if a truck has a liftgate. * Once the items have made their way to the Destination Hubs, we use the *Route Optimization API* once again to distribute them to short haul trucks, to be taken to the respective stores. * 20% of these short haul trucks do not have a lift gate, and all orders that are either fridges or washing machines require one, and we specify that in the route optimization requests.32:T450,mvrpInputs = { const locations = []; const pickupLocationIndex = 0; locations.push(transformPoint(ORIGIN_HUB.location)); let locationIndex = 1; const jobs = []; const shipments = []; const hubLocationIndices = {}; for (const hub of DESTINATION_HUBS) { hubLocationIndices[hub.city] = locationIndex++; locations.push(transformPoint(hub.location)); } for (let orderId = 0; orderId < ORDERS.length; orderId++) { const order = ORDERS[orderId]; const deliveryLocationIndex = hubLocationIndices[order.city]; jobs.push({ id: orderId, location_index: deliveryLocationIndex, // delivery: [PRODUCTS[order.itemId].weight], pickup: [PRODUCTS[order.itemId].weight] }); } const vehicles = []; for (const truck of TRUCKS_AT_ORIGIN_HUB) { vehicles.push({ id: truck.id, capacity: [truck.capacity], start_index: 0, max_tasks: 20 }); } return { depots: [{ id: 0, location_index: 0 }], locations: { id: 1, location: locations.join("|") }, jobs, // shipments, vehicles }; }33:T44b,{ const parsedGeometry = { type: "LineString", coordinates: nextbillion.utils.polyline .decode(selectedLongHaulRoute.geometry, 5) .map((c) => c.reverse()) }; const centroid = parsedGeometry.coordinates[ Math.floor(parsedGeometry.coordinates.length / 2) ]; const nbmap = new nextbillion.maps.Map({ container: document.getElementById("long-haul-mvrp-result"), center: { lat: centroid[1], lng: centroid[0] }, zoom: 5, maxZoom: 15, minZoom: 0, style: "https://api.nextbillion.io/maps/streets/style.json", scrollZoom: true }); nbmap.on("load", () => { drawRoute(nbmap.map, "route", selectedLongHaulRoute); function getUniqueCoordinates(coords) { const uniqueCoords = new Set(coords.map(JSON.stringify)); return Array.from(uniqueCoords).map(JSON.parse); } const uniqueSteps = getUniqueCoordinates( selectedLongHaulRoute.steps.map((s) => s.location) ); uniqueSteps.forEach((location, idx) => { drawStepIdx(nbmap.map, location.slice().reverse(), idx); }); }); }34:T582,mvrpFromDestinationHubs = { async function performMVRP(cityCode) { const orders = ORDERS.filter((order) => order.city === cityCode); const locations = [ transformPoint( DESTINATION_HUBS.find((hub) => hub.city === cityCode).location ) ]; const hubLocationIndex = 0; let jobId = 0; const jobs = []; let locationIndex = 1; for (let i = 0; i < orders?.length; i++) { const order = orders[i]; const store = STORES[order.storeId]; jobs.push({ id: jobId++, delivery: [PRODUCTS[order.itemId].weight], location_index: locationIndex++, skills: PRODUCTS[order.itemId].skills }); locations.push(transformPoint(store.location)); } let vehicles = []; for (const vehicle of shortHaulTrucks[cityCode]) { vehicles.push({ id: vehicle.id, skills: _.random() < 0.2 ? [] : [0], start_index: hubLocationIndex, capacity: [inputs.shortHaulTruckCapacity], end_index: hubLocationIndex, description: vehicle.description }); } const result = await MVRP({ locations: { id: 1, location: locations.join("|") }, jobs, vehicles }); return { cityCode, ...result }; } return Promise.all( _.map( DESTINATION_HUBS.map((hub) => hub.city), performMVRP ) ); }35:T5ad,function drawRoute(map, source, data, color = "#7e22ce", width = 5) { const { distance, duration, geometry } = data; const parsedGeometry = { type: "LineString", coordinates: nextbillion.utils.polyline .decode(geometry, 5) .map((c) => c.reverse()) }; const popupLngLat = parsedGeometry.coordinates[ Math.floor(parsedGeometry.coordinates.length / 2) ]; if (!map.getSource(source)) { map.addSource(source, { type: "geojson", data: { type: "Feature", geometry: { type: "LineString", coordinates: nextbillion.utils.polyline .decode(geometry, 5) .map((c) => c.reverse()) } } }); map.addLayer({ id: source, type: "line", source, layout: { "line-join": "round", "line-cap": "round" }, paint: { "line-color": color, "line-width": width // "line-dasharray": [1, 2] } }); // const element = document.createElement("div"); // element.innerHTML = ` //

distance: ${_.round(distance / 1000, 1)} Km

duration: ${_.round(duration / 3600, 1)} Hours

// `; // element.style.fontSize = "12"; // element.style.backgroundColor = color; // element.style.color = "white"; // element.style.fontWeight = "600"; // new nextbillion.maps.Marker({ element }).setLngLat(popupLngLat).addTo(map); } }36:T448,async function MVRP(data) { const optimizeRequestUrl = `https://api.nextbillion.io/optimise-mvrp?` + `key=${API_KEY}`; const optimizeRequest = await axios .post(optimizeRequestUrl, { ...data, options: { objective: { minimise_num_depots: false, travel_cost: "distance" }, routing: { mode: "truck" } } }) .then((res) => res.data); const mvrpRequestId = optimizeRequest.id; const previewurl = `https://nb-playground-staging.netlify.app/optimization-tester?apiKey=${API_KEY}&requestID=${mvrpRequestId}`; const getResultUrl = `https://api.nextbillion.io/optimise-mvrp/result?id=${mvrpRequestId}&key=${API_KEY}`; // Wait until the Route Optimization result is ready let attempts = 0; while (attempts < 10) { const result = await axios({ url: getResultUrl, method: "GET" }); if ( result.data && result.data.status === "Ok" && result.data.message == "" ) { console.log(result); return result.data; } attempts++; await new Promise((resolve) => setTimeout(resolve, 5 * 1000)); } }37:T732,STORES = { return [ { name: "Smitham Inc", city: "austin", location: [-97.67775, 30.22351], postalCode: "78742-2811", id: 0 }, { name: "Goyette, Stroman and Schiller", city: "austin", location: [-97.75569, 30.25644], postalCode: "78704-1614", id: 1 }, { name: "Feest and Hermann", city: "austin", location: [-97.85122, 30.40729], postalCode: "78726", id: 2 }, { name: "Bashirian and Sons", city: "austin", location: [-97.77488, 30.53963], postalCode: "78613-6923", id: 3 }, { name: "Jones - Durgan", city: "la", location: [-118.12816, 34.09664], postalCode: "91801-3547", id: 4 }, { name: "Larson - Schowalter", city: "la", location: [-118.29751, 33.9826], postalCode: "90044-2731", id: 5 }, { name: "Baumbach, Gutkowski and Schinner", city: "la", location: [-118.08295, 33.94231], postalCode: "90670-3643", id: 6 }, { name: "Stark Inc", city: "la", location: [-118.39707, 33.99065], postalCode: "90230-5358", id: 7 }, { name: "Casper, Bashirian and Bogisich", city: "detroit", location: [-83.26847, 42.44302], postalCode: "48219-1122", id: 8 }, { name: "Keeling Inc", city: "detroit", location: [-82.91314, 42.38731], postalCode: "48230-1504", id: 9 }, { name: "Mueller - Bosco", city: "detroit", location: [-83.23414, 42.34304], postalCode: "48228-4940", id: 10 }, { name: "Rice - MacGyver", city: "detroit", location: [-82.96492, 42.4793], postalCode: "48021-1008", id: 11 } ]; }38:[{"id":"8f783c230ec93ee77502eefb6d83e71ca6476054e55202d6e85554d0d30b77c4006884544bc40cfdcf3197cad26dc3d56b16fa363719fb9d994829662adc9b1c","href":"https://static.observableusercontent.com/files/8f783c230ec93ee77502eefb6d83e71ca6476054e55202d6e85554d0d30b77c4006884544bc40cfdcf3197cad26dc3d56b16fa363719fb9d994829662adc9b1c","name":"volume ltl.png","type":"image/png","lastModified":1692783130536.455,"size":1230860},{"id":"c0ef0d229b76e2d3155cbca8c29829bea4c2aad2fba7b6dab49fe27e1b51486decec19f6a3325c7be4ac610b1ce7e8b6c38fe62623bf31afbe69b149674c2a75","href":"https://static.observableusercontent.com/files/c0ef0d229b76e2d3155cbca8c29829bea4c2aad2fba7b6dab49fe27e1b51486decec19f6a3325c7be4ac610b1ce7e8b6c38fe62623bf31afbe69b149674c2a75","name":"volume ltl@1.png","type":"image/png","lastModified":1693983209779.073,"size":1235902}] 2f:{"id":"02e0236725f014e5","slug":null,"title":"LTL Shipping: A Developer's Guide to NextBillion.ai APIs","thumbnail":"f66ddb1ca51ef3c09fa6e123fef13fee9be04d486687c62555ba70c7d1d73ae2","access_level":"public","create_time":"$D2023-08-23T09:32:10.536Z","update_time":"$D2023-09-07T15:11:10.115Z","view_time":null,"first_public_time":"$D2023-08-23T09:32:10.536Z","has_unpublished_edits":null,"fork":{"id":"d633d99b4ae87962","slug":null,"title":"LTL Shipping (forked v2)","owner":{"id":"787ce1766e2f8353","login":"texoslab","name":"Texoport's Workspace"}},"stars":0,"starred":false,"owner":{"type":"team","id":"787ce1766e2f8353","login":"texoslab","name":"Texoport's Workspace","avatar_url":"https://avatars-next.observableusercontent.com/c682b2e46f70c9b6b07bd1cb3e910d7f8e5a9c164a6363b06edaf7bb932301ff","tier":"starter_2024"},"version":3601,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"3a4237a77d0ee063","login":"texoport","name":"Texoport","avatar_url":"https://avatars-next.observableusercontent.com/cc7f2661bbd43a7d4b462619d45c31c6398091f9b8e8b000546719e1bdf9cc36","tier":null}],"members":[{"type":"individual","id":"3a4237a77d0ee063","login":"texoport","name":"Texoport","avatar_url":"https://avatars-next.observableusercontent.com/cc7f2661bbd43a7d4b462619d45c31c6398091f9b8e8b000546719e1bdf9cc36","tier":null,"role":"editor"},{"type":"team","id":"787ce1766e2f8353","login":"texoslab","name":"Texoport's Workspace","avatar_url":"https://avatars-next.observableusercontent.com/c682b2e46f70c9b6b07bd1cb3e910d7f8e5a9c164a6363b06edaf7bb932301ff","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"LTL Shipping: A Developer's Guide to NextBillion.ai APIs","cells":[{"id":0,"value":"# LTL Shipping: A Developer's Guide to NextBillion.ai APIs","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1864,"value":"## Background\nIn this notebook, we showcase an implementation of Volume LTL using several of NextBillion.ai's APIs, including the Route Optimization API, the Flexible Directions API, and the Web Maps SDK.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1875,"value":"## Problem Statement\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":2808,"value":"Appliance manufacturers in Columbus need to efficiently deliver bulk store orders to three cities in the US, LA, Austin, and Detroit. The final delivery from destination hubs to these stores has a skill constraint, as some products require trucks with liftgates. The goal is to optimize the delivery process and ensure efficient transportation of the products to the stores.\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":3588,"value":"## Approach","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1883,"value":"### Setup\n* We pick four cities in the USA, Columbus, Los Angeles, Detroit, and Austin, for our example, and select Columbus as the origin city\n* For each of the above cities, we randomly pick the location for a shipping hub.\n* For the source city of Columbus, we pick 4 random locations to serve as manufacturers. Each manufacturer produces exactly one type of item, and item could be a fridge, a washing machine, an AC, or a dish washer.\n* Similarly, for the rest of the cities, we pick 4 random locations each to denote electronics stores, and each store orders **between ${ordersPerStore.LOWER_LIMIT} and ${ordersPerStore.UPPER_LIMIT} products from each manufacturer**\n* We specify that both fridges and washing machines require the use of liftgates to dismount, so they must be assigned to trucks that have them once they are at the destination hubs.\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":3592,"value":"$31","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":3561,"value":"volumeLtl1 = FileAttachment(\"volume ltl@1.png\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1982,"value":"## Constraints\nFor the sake of simplicity, we make the following assumptions in this solution. Please note that the Route Optimization API is capable of handling more complex scenarios\n* We only take into account the weight of items, and not their volume. The *Route Optimization API* is [capable of handling multi-dimensional quantities](https://docs.nextbillion.ai/docs/optimization/api/route-optimization-v2).","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1994,"value":"Note: this demo has the possibility of generating a large number of Route Optimization transactions against the key being used and should only be used with evaluation/demo API keys.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":45,"value":"viewof API_KEY = 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":1999,"value":"## Parameters","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1055,"value":"viewof inputs = {\n return guard(({ template, ...rest }) => {\n return Inputs.form(\n {\n nTrucksAtOriginHub: Inputs.select([5, 10, 15], {\n label: \"Number of trucks (long haul) at Origin hub\",\n value: 10\n }),\n nTrucksAtDestinationHubs: Inputs.select([5, 10, 15, 20], {\n label: \"Number of trucks (short haul) at the Destination hubs (each)\",\n value: 10\n }),\n longHaulTruckCapacity: Inputs.select(\n [10000, 15000, 20000, 30000, 40000],\n {\n label: \"Long haul truck capacity\",\n value: 30000\n }\n ),\n shortHaulTruckCapacity: Inputs.select(\n [2000, 3000, 4000, 5000, 6000, 7000],\n {\n label: \"Final delivery truck (short haul) capacity\",\n value: 5000\n }\n )\n },\n { template }\n );\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3297,"value":"ordersPerStore = {\n return {\n LOWER_LIMIT: 0,\n UPPER_LIMIT: 5\n };\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1058,"value":"---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":2006,"value":"## Data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":2693,"value":"### Manufacturers","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":2552,"value":"manufacturersTable = MANUFACTURERS.map((manufacturer) => ({\n Id: manufacturer.id,\n Name: manufacturer.name,\n Item: PRODUCTS[manufacturer.item].name,\n City: CITIES[manufacturer.city].name,\n Coordinates: manufacturer.location.join(\", \"),\n \"Postal Code\": `${manufacturer.postalCode}`\n}))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2555,"value":"manufacturersTable","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":2040,"value":"### Orders","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":3304,"value":"ordersTable = {\n const ordersPerStore = _.groupBy(ORDERS, \"storeId\");\n return Object.values(ordersPerStore).map((orders) => {\n const result = _.groupBy(orders, \"itemId\");\n const productNames = _.keys(PRODUCTS);\n const productCounts = _.mapValues(\n PRODUCTS,\n (product) => result[product.id]?.length ?? 0\n );\n\n return {\n Store: STORES[orders[0].storeId].name,\n City: CITIES[STORES[orders[0].storeId].city].name,\n ...productCounts\n };\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3372,"value":"\ntrucks -> city","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":2303,"value":"ordersTable","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":621,"value":"### Origin Companies to Origin Hub","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":768,"value":"companiesToOriginHubDirections = Promise.all(\n MANUFACTURERS.map((manufacturer) =>\n getDirection(manufacturer.location, ORIGIN_HUB.location)\n )\n)","pinned":false,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3096,"value":"

\n ${MANUFACTURERS.map((manufacturer, idx) => {\n const box = `

`;\n const route = companiesToOriginHubDirections[idx][0];\n const { distance, duration } = route;\n return html`\n

\n ${manufacturer.name}\n \n

distance: ${_.round(\n distance / 1000,\n 1\n )} Km

duration: ${_.round(\n duration / 3600,\n 1\n )} Hours

\n `;\n })}\n

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":891,"value":"{\n const container = html`\n

\n `;\n yield container;\n\n const nbmap = new nextbillion.maps.Map({\n container: document.getElementById(\"map-2\"),\n center: {\n lat: CITIES.columbus.centroid[1],\n lng: CITIES.columbus.centroid[0]\n },\n zoom: 10,\n maxZoom: 15,\n minZoom: 0,\n style: \"https://api.nextbillion.io/maps/streets/style.json\",\n scrollZoom: true\n });\n\n nbmap.on(\"load\", () => {\n drawHub(nbmap.map, ORIGIN_HUB);\n MANUFACTURERS.forEach((manufacturer) =>\n drawManufacturer(nbmap.map, manufacturer)\n );\n companiesToOriginHubDirections.forEach((directions, i) => {\n drawRoute(nbmap.map, `route-${i}`, directions[0], COLORS[i]);\n });\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1028,"value":"### MVRP from the Origin Hub to the Destination Hubs","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1361,"value":"TRUCKS_AT_ORIGIN_HUB = {\n const trucks = [];\n\n for (let i = 0; i < inputs.nTrucksAtOriginHub; i++) {\n trucks.push({\n id: i,\n name: LONG_HAUL_TRUCKS[i],\n vin: faker.vehicle.vin(),\n capacity: inputs.longHaulTruckCapacity\n });\n }\n\n return trucks;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1034,"value":"$32","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1402,"value":"mvrpLongHaul = {\n const result = await MVRP(mvrpInputs);\n return result;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1485,"value":"longHaulRoutes = mvrpLongHaul.result.routes","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2055,"value":"### Long Haul Trucks Info","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":2640,"value":"longHaulTrucksTable = {\n const locationIdsMap = _.fromPairs(\n DESTINATION_HUBS.map((h, idx) => [idx + 1, h.city])\n );\n\n return longHaulRoutes.map((route) => {\n const orders = route.steps\n .filter((s) => s.type === \"job\")\n .map((s) => ORDERS[s.id]);\n let itemsCount = { fridge: 0, ac: 0, dish_washer: 0, washing_machine: 0 };\n for (let order of orders) {\n itemsCount[order.itemId] += order.quantity;\n }\n\n return {\n vehicle: LONG_HAUL_TRUCKS[route.vehicle],\n \"Destination City\":\n CITIES[locationIdsMap[route.steps.at(-1).location_index]].name,\n duration: _.round(route.duration / 3600, 1),\n distance: _.round(route.distance / 1000, 1),\n \"# Fridges\": itemsCount[\"fridge\"],\n \"# ACs\": itemsCount[\"ac\"],\n \"# Dish Washers\": itemsCount[\"dish_washer\"],\n \"# Washing Machines\": itemsCount[\"washing_machine\"]\n };\n });\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2652,"value":"longHaulTrucksTable","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1492,"value":"viewof selectedLongHaulRoute = Inputs.select(longHaulRoutes, {\n format: (route) => TRUCKS_AT_ORIGIN_HUB[route.vehicle].name\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2537,"value":"{\n const container = html`\n

\n `;\n yield container;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1495,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1612,"value":"### Delivering orders from the Destination Hub to Stores","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":3142,"value":"shortHaulTrucks = {\n const destinationCities = [\"austin\", \"la\", \"detroit\"];\n let vehicleIdx = 0;\n const randomVehicles = () => {\n let vehicles = [];\n for (let i = 0; i < inputs.nTrucksAtDestinationHubs; i++) {\n vehicles.push({\n description: `Truck ${vehicleIdx}`,\n id: vehicleIdx,\n hasLiftgate: _.random()\n });\n vehicleIdx++;\n }\n return vehicles;\n };\n return Object.fromEntries(\n destinationCities.map((city) => [city, randomVehicles()])\n );\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1640,"value":"$34","pinned":false,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3555,"value":"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1707,"value":"viewof selectedDestination = Inputs.select(mvrpFromDestinationHubs, {\n format: (r) => CITIES[r.cityCode].name\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3173,"value":"selectedCityTrucksTable = shortHaulTrucks[selectedDestination.cityCode].map(\n (truck) => {\n return {\n Name: truck.description,\n \"Has Lift Gate\": truck.hasLiftgate === 1 ? \"Yes\" : \"No\",\n \"# Orders\":\n selectedDestinationTrucks\n .find((t) => t.vehicle === truck.id)\n ?.steps?.filter((s) => s.type === \"job\")?.length ?? 0\n };\n }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3425,"value":"After Route Optimization, ${selectedCityTrucksTable.reduce((acc, c) => acc + c[\"# Orders\"], 0)} out of ${ORDERS.filter((o) => o.city === selectedDestination.cityCode).length} total orders received at the ${CITIES[selectedDestination.cityCode].name} hub were delivered by ${selectedCityTrucksTable.filter(t => t['# Orders']> 0).length} out of ${inputs.nTrucksAtDestinationHubs} trucks","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":3181,"value":"selectedCityTrucksTable","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":3530,"value":"Select any of the trucks below to view their routes","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1835,"value":"viewof selectedDestinationTrucks = Inputs.checkbox(\n selectedDestination.result.routes,\n {\n format: (r) => `Truck ${r.vehicle}`,\n value: selectedDestination.result.routes\n }\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3374,"value":"null","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":2506,"value":"{\n const container = html`\n

\n `;\n yield container;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1759,"value":"{\n const center = CITIES[selectedDestination.cityCode].centroid;\n\n const nbmap = new nextbillion.maps.Map({\n container: document.getElementById(\"destination-map\"),\n center: {\n lat: center[1],\n lng: center[0]\n },\n zoom: 10,\n maxZoom: 15,\n minZoom: 0,\n style: \"https://api.nextbillion.io/maps/streets/style.json\",\n scrollZoom: true\n });\n\n nbmap.on(\"load\", () => {\n STORES.filter((store) => store.city === selectedDestination.cityCode).map(\n (store) => drawStore(nbmap.map, store)\n );\n drawHub(\n nbmap.map,\n DESTINATION_HUBS.find((hub) => hub.city === selectedDestination.cityCode)\n );\n selectedDestinationTrucks.forEach((route, i) => {\n drawRoute(\n nbmap.map,\n `route-${i}`,\n route,\n COLORS[route.vehicle % COLORS.length]\n );\n });\n });\n}","pinned":false,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":463,"value":"# Functions","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":818,"value":"async function getDirection(\n origin,\n destination,\n options = {\n mode: \"truck\",\n option: \"flexible\",\n route_type: \"shortest\",\n truck_size: \"200,210,600\"\n }\n) {\n const baseUrl = \"https://api.nextbillion.io/directions/json\";\n const from = `origin=${transformPoint(origin)}`;\n const to = `destination=${transformPoint(destination)}`;\n const mode = `mode=${options.mode}`;\n const option = `option=${options.option}`;\n const truck_size = `truck_size=${option.truck_size}`;\n const routeType = `route_type=${options.route_type}`;\n const url = `${baseUrl}?${from}&${to}&${mode}&${routeType}&${option}&key=${API_KEY}`;\n const result = await fetch(url);\n return result.json().then((r) => r.routes);\n}","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":894,"value":"$35","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":815,"value":"function transformPoint(p) {\n return [p[1], p[0]].join(\",\");\n}","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":770,"value":"$36","pinned":false,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":588,"value":"function drawHub(map, hub) {\n const hubLocation = { lat: hub.location[1], lng: hub.location[0] };\n const element = document.createElement(\"div\");\n element.innerHTML = `

🏢

Hub: ${hub.name}

`;\n element.style.fontSize = \"15px\";\n element.style.color = \"black\";\n element.style.fontWeight = \"600\";\n new nextbillion.maps.Marker({ element }).setLngLat(hubLocation).addTo(map);\n}","pinned":false,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1538,"value":"function drawStepIdx(map, location, stepIdx) {\n const stepIdxLocation = { lat: location[1], lng: location[0] };\n const element = document.createElement(\"div\");\n element.innerText = NUMBER_EMOJIS[stepIdx];\n element.style.fontSize = \"15px\";\n new nextbillion.maps.Marker({ element })\n .setLngLat(stepIdxLocation)\n .addTo(map);\n}","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":590,"value":"function drawManufacturer(map, company) {\n const element = document.createElement(\"div\");\n element.innerHTML = `

🏭

Company: ${company.name}

`;\n element.style.color = \"black\";\n element.style.fontWeight = \"600\";\n element.style.fontSize = \"15px\";\n new nextbillion.maps.Marker({ element })\n .setLngLat({\n lat: company.location[1],\n lng: company.location[0]\n })\n .addTo(map);\n}","pinned":false,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2526,"value":"function drawStore(map, store) {\n const element = document.createElement(\"div\");\n element.innerHTML = `

🏬

Store: ${store.name}

`;\n element.style.color = \"black\";\n element.style.fontWeight = \"600\";\n element.style.fontSize = \"15px\";\n new nextbillion.maps.Marker({ element })\n .setLngLat({\n lat: store.location[1],\n lng: store.location[0]\n })\n .addTo(map);\n}","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":466,"value":"function* createMap(id, center, zoom = 10, onLoad) {\n const container = html`\n

\n `;\n yield container;\n\n const nbmap = new nextbillion.maps.Map({\n container: document.getElementById(id),\n center: {\n lat: center[1],\n lng: center[0]\n },\n zoom,\n maxZoom: 15,\n minZoom: 0,\n style: \"https://api.nextbillion.io/maps/streets/style.json\",\n scrollZoom: true\n });\n\n nbmap.on(\"load\", () => {\n onLoad(nbmap);\n });\n}","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":457,"value":"---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":57,"value":"### Constants","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":2173,"value":"ORIGIN_HUB = {\n return {\n name: \"Columbus Shipping Corp\",\n city: \"columbus\",\n location: [-82.99876, 39.9869],\n postalCode: \"43201-2816\"\n };\n}","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2262,"value":"PRODUCTS = {\n return {\n ac: {\n id: \"ac\",\n name: \"AC\",\n weight: 300,\n skills: []\n },\n fridge: {\n id: \"fridge\",\n name: \"Frige\",\n weight: 1000,\n skills: [0]\n },\n dish_washer: {\n id: \"dish_washer\",\n name: \"Dish Washer\",\n weight: 500,\n skills: []\n },\n washing_machine: {\n id: \"washing_machine\",\n name: \"Washing Machine\",\n weight: 800,\n skills: [0]\n }\n };\n}","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2145,"value":"MANUFACTURERS = {\n return [\n {\n name: \"Best AC Company\",\n item: \"ac\",\n city: \"columbus\",\n location: [-82.92288, 40.09587],\n postalCode: \"43081\",\n id: 0\n },\n {\n name: \"Cool Fridges\",\n item: \"fridge\",\n city: \"columbus\",\n location: [-82.84959, 39.89277],\n postalCode: \"43110\",\n id: 1\n },\n {\n name: \"Dishy Dish Washers Corp\",\n item: \"dish_washer\",\n city: \"columbus\",\n location: [-83.1163, 39.90666],\n postalCode: \"43123\",\n id: 2\n },\n {\n name: \"Wishing Machines\",\n item: \"washing_machine\",\n city: \"columbus\",\n location: [-83.34013, 40.1381],\n postalCode: \"43064\",\n id: 3\n }\n ];\n}","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2177,"value":"DESTINATION_HUBS = {\n return [\n {\n name: \"Austin Hub\",\n city: \"austin\",\n location: [-97.73751, 30.32101],\n postalCode: \"78756-2625\"\n },\n {\n name: \"Los Angeles Hub\",\n city: \"la\",\n location: [-118.24741, 34.04014],\n postalCode: \"90014-2417\"\n },\n {\n name: \"Detroit Hub\",\n city: \"detroit\",\n location: [-83.07939, 42.38504],\n postalCode: \"48202\"\n }\n ];\n}","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2224,"value":"ORDERS = STORES.flatMap((store) => {\n const orders = [];\n for (const manufacturer of MANUFACTURERS) {\n const quantity = _.random(\n ordersPerStore.LOWER_LIMIT,\n ordersPerStore.UPPER_LIMIT\n );\n for (let i = 0; i < quantity; i++) {\n orders.push({\n storeId: store.id,\n itemId: manufacturer.item,\n quantity: 1,\n city: store.city\n });\n }\n }\n return orders;\n})","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3244,"value":"lol = STORES.flatMap((store) => {\n const orders = [];\n for (const manufacturer of MANUFACTURERS) {\n if (_.random()) {\n const quantity = _.random(0, 30);\n for (let i = 0; i < quantity; i++) {\n orders.push({\n storeId: store.id,\n itemId: manufacturer.item,\n quantity: 1,\n city: store.city\n });\n }\n }\n }\n return orders;\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2136,"value":"$37","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1380,"value":"LONG_HAUL_TRUCKS = [\n \"T680\",\n \"579\",\n \"Cascadia\",\n \"VNL\",\n \"LT\",\n \"Anthem\",\n \"5700XE\",\n \"T880\",\n \"389\",\n \"Coronado\",\n \"VNR\",\n \"LoneStar\",\n \"Pinnacle\",\n \"4900\",\n \"W990\"\n]","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2608,"value":"NUMBER_EMOJIS[0]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2606,"value":"NUMBER_EMOJIS = [\"1️⃣\", \"2️⃣\", \"3️⃣\", \"4️⃣\", \"5️⃣\", \"6️⃣\", \"7️⃣\", \"8️⃣\", \"9️⃣\"]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1524,"value":"USA_CENTROID = [-99.0909, 39.8355]","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":130,"value":"CITIES = {\n return {\n columbus: {\n name: \"Columbus\",\n state: \"Ohio\",\n centroid: [-83.001647, 39.963483]\n },\n austin: {\n name: \"Austin\",\n state: \"Texas\",\n centroid: [-97.7431, 30.2672]\n },\n la: {\n name: \"Los Angeles\",\n state: \"California\",\n centroid: [-118.243683, 34.052235]\n },\n detroit: {\n name: \"Detroit\",\n state: \"Michigan\",\n centroid: [-83.045753, 42.331429]\n }\n };\n}","pinned":false,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1829,"value":"COLORS = [\n \"#FF6633\",\n \"#FF33FF\",\n \"#00B3E6\",\n \"#E6B333\",\n \"#3366E6\",\n \"#B34D4D\",\n \"#E666FF\",\n \"#4DB3FF\",\n \"#CC80CC\",\n \"#809900\" \n]","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":53,"value":"---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":629,"value":"### Imports","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":469,"value":"nextbillion.setApiKey(API_KEY)","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":418,"value":"faker = require(\"https://unpkg.com/faker@5.3.1/dist/faker.min.js\")","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":775,"value":"axios = {\n let axios = await require(\"axios\");\n return axios;\n}","pinned":false,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":453,"value":"import {\n guard,\n colors,\n renderPolygon,\n d3Delaunay,\n findExtremeCoordinates\n} from \"@texoslab/nbai-helpers\"","pinned":false,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"import {\n nextbillion,\n secret2,\n styles,\n routeStyles\n} from \"@nbai/nextbillion-ai-dependencies\"","pinned":false,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2468,"value":"d3 = require(\"d3-selection\")","pinned":true,"hidden":true,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":533,"value":"html`Add the stylesheet for the NB.ai SDK
<link href=\"https://maps-gl.nextbillion.io/maps/v2/api/css\" rel=\"stylesheet\">`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":554,"value":"","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":2584,"value":"","pinned":false,"hidden":true,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":2829,"value":"geoviewer = require(\"https://d12qcqjlhp2ahm.cloudfront.net/index_alltrans.min.js\").then(\n (f) => f.view\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2870,"value":"milestones = require(\"d3-milestones\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W38","stdlib":"1","titling":"auto"}} 30:"$2f:body"