vroom-project/vroom-frontend

Web frontend for VROOM

vroom-frontend's Issues

Improve error reporting

Despite previous efforts in #22, error handling is still very rudimentary. In most error cases we get a Error: 0 alert that is not helpful at all. We should display an explicit message based on:

• status code returned by vroom-express, see VROOM-Project/vroom-express#13 (comment)
• error message in json output.

Display solution on the map

Missing skills error

The exact same issue described in #32 for amount/capacity arises when loading a problem that contains skills for vehicle and jobs and then manually adding a (skill-less) job through the UI. This result in an expected Missing skills error.

A fix for this would be very similar to what was done back in #33.

Add locations by clicking on the map

File input is broken

The problem won't load with a file due to javascript errors.

Allow to limit the map bounding box

Useful when routing over a non-planet OSM dataset to avoid defining jobs that will be snapped to far-away places.

Fit view to problem

Add a control to allow the view to be set to match the problem bounds.

Tiles not rendering

When I try to change var initCenter = L.latLng(48.8579,2.3494); to coordinates in another country the map tiles will no longer load.

Simplify control handling

Currently a callback function is passed around to check which controls should be displayed (upon deletion for example). This is overly complicated and introduces unwanted dependencies.

Clear problem

Add a leaflet control to remove everything added so far using features in #3 and #4.

Option to change leaflet geocoder

Hi!

A feature I think would enhance this project is the ability to change the leaflet default geocoder, in order to avoid getting soft and/or hard banned from Nominatim. This could be handled by hosting your own Nominatim-server and pointing leaflet to that instead of the default one.

The defaults works wonderfully with a hosted vroom and osrm server (which I've pointed the frontend to in /src/config/api.js) when using the point-and-click interface, but I've run into soft bans when trying to add locations by using files with one coordinate per line. The routes I'm trying to optimize are a little under 1000 stops, so it's understandable that a soft ban is triggered when all those requests are sent in short order when uploading a file.

Perhaps a workaround is using json-formatted files? Is the geocoder called then?

Setup package and build environment

front-end does not work on windows

Following the instruction we installed vroom-frontend on a PC running windows 10 through a powershell. After the command "npm run serve" we have this error. The npm works well on a linux server though.

beefy (v2.1.8) is listening on http://127.0.0.1:9966
200 91ms 592B /
events.js:187
throw er; // Unhandled 'error' event
^

Error: spawn ./node_modules/.bin/browserify ENOENT
at Process.ChildProcess._handle.onexit (internal/child_process.js:264:19)
at onErrorNT (internal/child_process.js:456:16)
at processTicksAndRejections (internal/process/task_queues.js:80:21)
Emitted 'error' event on ChildProcess instance at:
at Process.ChildProcess._handle.onexit (internal/child_process.js:270:12)
at onErrorNT (internal/child_process.js:456:16)
at processTicksAndRejections (internal/process/task_queues.js:80:21) {
errno: 'ENOENT',
code: 'ENOENT',
syscall: 'spawn ./node_modules/.bin/browserify',
path: './node_modules/.bin/browserify',
spawnargs: [
'C:\project\vroom-frontend-master\vroom-frontend-master\src\map.js'
]
}
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] serve: beefy src/map.js --browserify ./node_modules/.bin/browserify --live
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] serve script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\yongs\AppData\Roaming\npm-cache_logs\2020-05-21T13_43_51_206Z-debug.log

Improve "Options" interface

This is just a feature suggestion.

If you select a location and then use Options to set it as a Start for a vehicle, you are unable to set that same location as the End. (to create a round trip) It only gives you the Del option.

Reload on insufficient capacity

Is there a possible to go back to the depot to reload the vehicle to delivery more items if the capacity of the vehicle is smaller than the amount of items that should be delivered?

Tooling

• use beefy for dev
• update dependencies

Basic map setup

Remove amount key

The amount key is now marked as deprecated as of VROOM v1.5. We should replace it with delivery.

Invalid description value

When using an external Overpass query to generate jobs from an OSM key/value pair, sometimes there is no valid name for the object and we end up using the OSM node id as description. For example:

    {
      "id": 418142038,
      "description": 418142038,
      "location": [
        2.3798456,
        48.8687076
      ]
    }

So far this was not a problem as description keys where not parsed at all on the backend side. Now as of v1.8.0-rc.1, vroom allows using description keys to enrich the route[].steps[] output, but expect descriptions to be strings.

On the frontend side, this shows up as a 400 Bad request error.

We should simply convert node ids to a string on the frontend side.

Add solution information

After solving, a summary of the solution indicators should be displayed.

Add vehicles in addition to locations via one address per line

When uploading locations from a file with one location on each line, is it possible to also add vehicles from that same file?

Add a changelog

Because this repo does not have one and https://keepachangelog.com.

Error executing the solver

Hi

I am trying to implement the VROOM project in ubuntu but when I run it I get the following error

I'll be doing something wrong, you can help me.

I greatly appreciate any comments

Add node collection from Overpass

To ease the handling of the frontend, it may be useful to a way to generate simple instances directly from a small description. similarly to the following script: https://github.com/VROOM-Project/vroom-scripts/blob/master/src/overpass_to_json.py

It requires to have at least one point defined as depot.
Then:

• Add two new fields : key and value (corresponding to overpass tags, with a default value ex: amenity:pharmacy)
• Add a link to openstreetmap wiki
• Perform a request to Overpass API within the current bounding box
• removed: Reverse geocode the obtained nodes
• Get node name from Overpass
• Add the obtained nodes to the current node list

Turn-by-turn instructions

Is there an easy way to get turn-by-turn instructions after a problem is solved? If that is outside the scope of vroom, would appreciate any thoughts you have on how to handle this.

Collapsible right panel

On small displays, the right panel containing locations is quite annoying because it covers most of the map. It should be made collapsible.

Start/end overwrite

Situation: clicking for a second spot before the first geocoding callback has been executed.

Problem: the second callback still wants to add a start and an end, so it overrides the previous place.

Sending routes to frontend

I would appreciate if you would please help me understand if it is possible to do the following:

1. Take an output solution like the example here https://github.com/VROOM-Project/vroom/blob/master/docs/API.md#using-osrm

2. Pass this to and render on the vroom-frontend.

So instead of adding locations by the options listed in the picture below, I want to just use the optimized route I already have from my controller and render it on frontend

Multiple vehicles

It would be useful to expose the multiple vehicle feature from the frontend. Exposing the whole API (skills, various amounts etc.) with a full user interface is out of scope here. I see two simpler use-cases:

1. import any json file and use the full problem description for solving (the frontend is then just a convenient way to visualize and fire requests)
2. describe a multi-vehicle problem by clicking around, without being able to fine-tune amounts.

Point 1. should be straightforward but requires refactoring the way job and vehicle objects are created and stored. For 2., we need to allow to create several vehicles from the UI (e.g. clone an existing vehicle or convert an existing location to a new vehicle). Then I'm thinking of simply forcing an amount of 1 on all jobs and assigning the same capacity to all vehicles, enough to serve all jobs overall.

Route animation

Once the solution is displayed, allow to animate the route using Leaflet.Polyline.SnakeAnim.

Pan to geocoded point

When a new vehicle/job is defined with the geocoding control and is outside the current view, we should pan the map to the new added location. This behaviour is currently buggy as the map does pan close, but is not centered on the new location.

Ready-to-use standalone version

The frontend can be served directly using npm run serve, which makes use of beefy to trigger updates whenever source files are touched. This is really convenient for dev and debugging but we should ease the generation of a standalone version with a minified js bundle that would be ready to copy to any server.

Handle solving request

Request error handling

In case the POST request to get the solution doesn't succeed for some reason, like e.g. server timeout, the throbber keeps spinning and nothing is reported to the user.

Label collision detection

When a solution is displayed, the stops numbering using Leaflet labels gets ugly if points are packed.

We should try to not display all of them, using e.g. https://github.com/Geovation/labelgun.

Handle shipments

The frontend code was written before the shipment objects were added to the VROOM API, and was never upgraded to handle them. It would actually be a nice addition to the demo to be able to include shipments.

I see this as a two-step work:

1. adding the notion of shipments in the code logic and have them added to the problem/request when directly submitting a json file as input while adjusting the solution display accordingly;
2. actually allowing defining shipments through the UI.

The latter is probably useful too but more subject to design choices questions. And then also it would raise the question on how to manually define amounts, which we don't do in the UI for now.

Change path opacity onclick

When there are many paths in the same general area, the map starts to get cluttered and hard to read. It would be awesome if clicking on a path increased its opacity while decreasing the opacity of all others.

Setting map.maxBounds doesn't work

Handle file input

Upload and parse a local file with a list of lon,lat coordinates or addresses to geocode. Better to implement after #4 so the geocoding context will be set.

Load json-formatted problem

Loading from a file currently only expect a csv file and performs geocoding.

It could be handy to load problems that are already json-formatted, as this is the "usual" way to describe a problem. Also we can then avoid the geocoding altogether, especially if the problem has already been built using https://github.com/VROOM-Project/vroom-scripts/blob/master/src/overpass_to_json.py, were we usually get nice names for places instead of raw addresses.

Display vehicle start and end

Geocoder javascript error

When using the geocoding field, everything seems to work as expected, yet some errors are logged in the console:

TypeError: this.options.geocoder[i] is not a function

Add geocoder

Order jobs in panel display

When solving, the list of places should be re-ordered to match the visit rank in the solution (same as the route display on the map).

Add waiting icon

Inconsistent amount/capacity

Steps to reproduce

• upload a json-formatted input problem with hard-coded capacity constraints
• manually add a job by clicking/geocoding via the UI
• try to solve and get an error alert that looks like: Inconsistent amount/capacity lengths: 0 and 1.

What happens

When everything is defined manually through the UI, no capacity/amounts are provided. In order to easily demo multiple-vehicle problems, load-balancing is then enforced here. But when mixing an input file and manual additions, we have an inconsistent state where not all capacity/amounts are defined.

Fix

We should have some kind of flag to know whether the current underlying instance has capacity constraints or not (regardless of how it was defined) in order to:

• rely on this flag to known whether enforced load-balancing is required (above link)
• force a consistent state when adding an amount-less job, probably by deleting all existing capacity/amount information (and reporting this to the user).

Fit view after clearing the solution

When computing a solution, the bounds are cleared. So when the problem is updated with a new job, fitting the view will only show this job.

Problem size limitation

Allow to fix a (customizable) limit on the number of input locations on the client side.

Improve data entry by user

hi,

this an optimal frontend to interact with vroom, but I think that
it would be interesting to join this project with this other project

ongoing discussion here:
GIScience/ors-map-client#34

Right panel event propagation

Click events are captured on the right panel to stop propagation to the underlying map. But when trying to scroll over the list of locations (when it's long enough), events are propagated so the map moves around.