Android端OpenStreetMap实现Polyline随Marker拖动同步更新方案问询

Hey there! I’ve dealt with this exact scenario before when building a map-based Android app, so let’s walk through how to get your Marker drag to update the Polyline in real time.

Core Idea #

When you drag a Marker, you need to:

1. Track which point in the Polyline’s coordinate list the Marker corresponds to
2. Update that specific coordinate in the list as the Marker moves
3. Refresh the Polyline on the map with the updated coordinates

Step-by-Step Implementation #

First, let’s cover the critical setup and code changes you need:

1. Maintain a Mutable Coordinate List

You’ll need a mutable list (like ArrayList<LatLng>) to store your Polyline’s points. Avoid immutable lists (e.g., List.of()) because you’ll need to modify points as Markers are dragged.

2. Enable Marker Drag & Tag Each Marker

When creating a Marker (on long press), make sure to enable dragging and tag it with the index of the corresponding point in your Polyline list. This lets you know which point to update later.

3. Add Marker Drag Listener

Use GoogleMap.OnMarkerDragListener to catch drag events, update the coordinate list, and refresh the Polyline.

Full Code Snippet #

Here’s how to put it all together (assuming you have a GoogleMap instance set up):

private ArrayList<LatLng> polylinePoints = new ArrayList<>();
private Polyline currentPolyline;
private GoogleMap mMap;

@Override
public void onMapReady(GoogleMap googleMap) {
    mMap = googleMap;
    
    // Initialize with sample points (replace with your own)
    polylinePoints.add(new LatLng(37.7749, -122.4194));
    polylinePoints.add(new LatLng(37.7895, -122.4010));
    
    // Create the initial Polyline
    currentPolyline = mMap.addPolyline(new PolylineOptions()
            .addAll(polylinePoints)
            .width(10)
            .color(Color.BLUE));

    // Handle long press to add Marker to Polyline
    mMap.setOnMapLongClickListener(latLng -> {
        // Add the new point to our list
        polylinePoints.add(latLng);
        // Update the Polyline immediately
        currentPolyline.setPoints(polylinePoints);
        
        // Create a draggable Marker for the new point
        Marker newMarker = mMap.addMarker(new MarkerOptions()
                .position(latLng)
                .draggable(true));
        // Tag the Marker with the index of its corresponding point
        newMarker.setTag(polylinePoints.size() - 1);
    });

    // Set up Marker drag listener
    mMap.setOnMarkerDragListener(new GoogleMap.OnMarkerDragListener() {
        @Override
        public void onMarkerDragStart(Marker marker) {
            // Optional: Add visual feedback here (e.g., change Marker color)
        }

        @Override
        public void onMarkerDrag(Marker marker) {
            // Update Polyline in real time as the Marker is dragged
            syncPolylineWithMarker(marker);
        }

        @Override
        public void onMarkerDragEnd(Marker marker) {
            // Final update after drag ends (you could also just use this instead of onMarkerDrag)
            syncPolylineWithMarker(marker);
        }
    });
}

// Helper method to sync Polyline with dragged Marker
private void syncPolylineWithMarker(Marker marker) {
    // Get the index of the point associated with this Marker
    Integer pointIndex = (Integer) marker.getTag();
    if (pointIndex == null || pointIndex < 0 || pointIndex >= polylinePoints.size()) {
        return; // Invalid index, skip update
    }

    // Update the coordinate in our list
    polylinePoints.set(pointIndex, marker.getPosition());
    // Refresh the Polyline on the map
    currentPolyline.setPoints(polylinePoints);
}

Common Pitfalls to Avoid #

• Using immutable lists: If you’re using List.of() or another unmodifiable list, polylinePoints.set() will throw an error. Stick with ArrayList.
• Forgetting to enable drag: Always call marker.setDraggable(true) when creating your Marker, otherwise the drag listener won’t trigger.
• Losing the Polyline reference: Make sure you keep a reference to the Polyline object you created (like currentPolyline here). Don’t recreate the Polyline every time you update points—just call setPoints() on the existing instance.
• Missing Marker tags: Without tagging each Marker with its point index, you won’t know which part of the Polyline to update.

内容的提问来源于stack exchange，提问作者Umer Mir