javascript - Implementation of dragging route

Question

I did not find any example of draggable routing, an example that had a definite route, and I could click somewhere on the route, drag it and it fit. Could you put some sample code for me to take as a basis?

Answer 1

Please have a look at this example:

function createDragRoutes(alternatives){

    for(var i=0;i<alternatives;i++){
            dragRoute[i]=new Object();  
            dragRoute[i].routeHoverMarker = new H.map.Marker({lat: 50.126237073013314, lng: 8.627775069326162}, {
                icon: icon,
                visibility: false,
                zIndex: 1
            });
            dragRoute[i].routeHoverMarker.draggable = true;

            map.addObject(dragRoute[i].routeHoverMarker);

            dragRoute[i].pointermoveOnRouteHoverMarker = function(evt) {
            //  console.log(currentPolyline.routeNo);
                currentPolyline.dispatchEvent(evt);
                currentPolyline.setZIndex(zindex++);
            };

            dragRoute[i].dragstartOnRouteHoverMarker = function (evt) {
                //console.log(this);
                //console.log("routeHoverMarker dragstart:: ", evt, evt.target, currentPolyline);
                currentPolyline.dispatchEvent(evt);
            };

            dragRoute[i].dragOnRouteHoverMarker = function(evt) {

                //console.log(evt.target);

                var coord = map.screenToGeo((evt.pointers[0].viewportX), (evt.pointers[0].viewportY + 8));
                evt.target.setPosition(coord);

                currentPolyline.dispatchEvent(evt);
            };

            dragRoute[i].dragendOnRouteHoverMarker = function (evt) {

                currentPolyline.dispatchEvent(evt);
            };

            dragRoute[i].routeHoverMarker.addEventListener("pointermove", dragRoute[i].pointermoveOnRouteHoverMarker, false);
            dragRoute[i].routeHoverMarker.addEventListener("dragstart", dragRoute[i].dragstartOnRouteHoverMarker, true);
            dragRoute[i].routeHoverMarker.addEventListener("drag", dragRoute[i].dragOnRouteHoverMarker, false);
            dragRoute[i].routeHoverMarker.addEventListener("dragend", dragRoute[i].dragendOnRouteHoverMarker, false);


            dragRoute[i].calculateRouteParams = {


            };

        }

}