需要有关地图功能重新计算路线的帮助

Question

我在个人项目中重新计算路线时遇到问题。该项目应允许用户创建一条海上路线，以便随后通过与所选点相关的 API 调用接收气象数据。这个 Vue.js 组件负责显示地图，用户最初需要在地图上输入 2 个点，即出发地点和日期，以及到达地点和日期。随后，每小时间隔沿整个路线创建标记，可以拖动标记，以便用户可以修改要经过的点。移动所有标记后，单击按钮会触发此功能，该功能应重新计算精确经过起点、用户先前移动的点并最终到达目的地点的路线。以这种方式创建的每个标记还应该分配一个以小时为增量的日期和时间，以便在另一个组件中更快地可视化气象数据。

`异步函数 recalculateRoute() {

// Remove all previous markers from the map
for (let marker of markers) {
    marker.remove();
}
markerId = 0
markers = [];
//User-selected estimated departure date.
let etd = dates.value[0];
//User-selected estimated arrival date.
let eta = dates.value[dates.value.length - 1]
dates.value = [];

markers = [];
markerData.value = [];
locations.value = [];
lineCoordinates.value = [];

removeLine(map);

//newRouteLocation Array where at position 1 are the starting coordinates, 
//coordinates of the moved markers, and the last position coordinates of arrival.

// Calculate the total distance of the route.    
let totalDistance = 0;
for (let i = 0; i < newRouteLocations.value.length - 1; i++) {
    totalDistance += calculateDistance(newRouteLocations.value[i], newRouteLocations.value[i + 1]);
}

// Recalculate the speed based on the new total distance.
const totalTime = (new Date(eta) - new Date(etd)) / 1000 / 60 / 60;  // Tempo totale in ore
const speedCalculated = totalDistance / totalTime;
const speed = speedCalculated / 1852


// Create a new route that passes through all the points in newRouteLocations.
for (let i = 0; i < newRouteLocations.value.length - 1; i++) {
    const startLocation = newRouteLocations.value[i];
    const endLocation = newRouteLocations.value[i + 1];

    // Calculate the time between the two points.
    const segmentDistance = calculateDistance(startLocation, endLocation);
    const segmentTime = segmentDistance / speed;  // Tempo per il segmento in ore

    // Create markers along the segment every hour.
    let numMarkers = Math.floor(segmentTime / 3600);
    for (let j = 0; j <= numMarkers; j++) {
        if (numMarkers === 0) {
            numMarkers = 1;
        }
        let formattedDate;
        let lat, lng;
        // If it's the first or last point, use the existing coordinates.
        if (i === 0 && j === 0) {
            
            lat = startLocation.lat;
            lng = startLocation.lng;
            formattedDate = etd;
        } else if (i === newRouteLocations.value.length - 2 && j === numMarkers) {
            lat = endLocation.lat;
            lng = endLocation.lng;
            formattedDate = eta;
        } else {
            //Creation of a new intermediate marker.
            const t = j / (numMarkers + 1);
            lat = startLocation.lat + t * (endLocation.lat - startLocation.lat);
            lng = startLocation.lng + t * (endLocation.lng - startLocation.lng);

            console.log('j', j)
            console.log('numMarkers', numMarkers)
            console.log('t', t)

            const markerTime = new Date(dates.value[0]);
            markerTime.setHours(markerTime.getHours() + j);
            formattedDate = format(markerTime, "yyyy-MM-dd'T'HH:mm");
        }

        const marker = new Marker({ draggable: true })
            .setLngLat([lng, lat])
            .addTo(map.value);
        marker.id = markerId++;
        dates.value.splice(j, 0, formattedDate);
        const location = { id: marker.id, lat: lat, lng: lng };
        locations.value.push(location);
        lineCoordinates.value.push([lng, lat]);
    }
}
createLine(lineCoordinates);

}`

目前，我遇到了错误，特别是即使距离不到一小时也创建了标记，并且没有为它们分配正确的日期。事实上，尽管有增量，日期还是从初始日期重新开始，因此它们是不正确的。你能帮我吗？

Answer 1

我尝试更改一下您的代码，但您必须测试它是否适用于您的应用程序：

// Assume calculateDistance, createLine, and other utility functions are defined elsewhere.

// Updated section for creating markers with corrected time increment logic
let currentDateTime = new Date(etd); // Initialize with the estimated departure date

for (let i = 0; i < newRouteLocations.value.length - 1; i++) {
    const startLocation = newRouteLocations.value[i];
    const endLocation = newRouteLocations.value[i + 1];

    const segmentDistance = calculateDistance(startLocation, endLocation);
    const segmentTimeHours = segmentDistance / speed; // Time for the segment in hours

    let numMarkers = Math.floor(segmentTimeHours);
    if (numMarkers === 0) numMarkers = 1; // Ensure at least one marker per segment

    for (let j = 0; j <= numMarkers; j++) {
        let lat, lng, formattedDate;

        if (i === 0 && j === 0) {
            // First marker
            lat = startLocation.lat;
            lng = startLocation.lng;
            formattedDate = format(currentDateTime, "yyyy-MM-dd'T'HH:mm");
        } else if (i === newRouteLocations.value.length - 2 && j === numMarkers) {
            // Last marker
            lat = endLocation.lat;
            lng = endLocation.lng;
            currentDateTime = new Date(eta); // Ensure the last marker uses the ETA
            formattedDate = format(currentDateTime, "yyyy-MM-dd'T'HH:mm");
        } else {
            // Intermediate markers
            const t = j / numMarkers;
            lat = startLocation.lat + t * (endLocation.lat - startLocation.lat);
            lng = startLocation.lng + t * (endLocation.lng - startLocation.lng);
            currentDateTime.setHours(currentDateTime.getHours() + 1); // Increment by one hour for each marker
            formattedDate = format(currentDateTime, "yyyy-MM-dd'T'HH:mm");
        }

        // Marker creation and positioning logic remains the same...
    }
}
// Proceed with line creation and other necessary steps...
```