Measure line distance
Note
This example is a part of the Mapbox Android Demo app. You can find the values for all referenced resources in the res directory. For example, see res/values/activity_strings.xml for R.string.* references used in this example. The dependencies can be found here.The examples use View binding.See setup documention if necessary.
activity_javaservices_turf_measure_line
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:mapbox="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/constraint_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".examples.javaservices.TurfLineDistanceActivity">
<com.mapbox.mapboxsdk.maps.MapView
android:id="@+id/mapView"
android:layout_width="match_parent"
android:layout_height="match_parent"
mapbox:mapbox_cameraTargetLat="21.3011229"
mapbox:mapbox_cameraTargetLng="-157.851376"
mapbox:mapbox_cameraZoom="12" />
<androidx.cardview.widget.CardView
android:id="@+id/cardView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|center"
android:layout_marginTop="8dp">
<TextView
android:id="@+id/line_length_textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="8dp"
android:text="@string/line_distance_textview" />
</androidx.cardview.widget.CardView>
</FrameLayout>
TurfLineDistanceActivity.java
package com.mapbox.mapboxandroiddemo.examples.javaservices;
import android.graphics.Color;
import android.os.Bundle;
import android.widget.TextView;
import android.widget.Toast;
import com.mapbox.geojson.Feature;
import com.mapbox.geojson.LineString;
import com.mapbox.geojson.Point;
import com.mapbox.mapboxandroiddemo.R;
import com.mapbox.mapboxsdk.Mapbox;
import com.mapbox.mapboxsdk.geometry.LatLng;
import com.mapbox.mapboxsdk.maps.MapView;
import com.mapbox.mapboxsdk.maps.MapboxMap;
import com.mapbox.mapboxsdk.maps.OnMapReadyCallback;
import com.mapbox.mapboxsdk.maps.Style;
import com.mapbox.mapboxsdk.style.layers.CircleLayer;
import com.mapbox.mapboxsdk.style.layers.LineLayer;
import com.mapbox.mapboxsdk.style.sources.GeoJsonSource;
import com.mapbox.turf.TurfMeasurement;
import java.util.ArrayList;
import java.util.List;
import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import static com.mapbox.mapboxsdk.style.layers.Property.LINE_JOIN_ROUND;
import static com.mapbox.mapboxsdk.style.layers.PropertyFactory.circleColor;
import static com.mapbox.mapboxsdk.style.layers.PropertyFactory.circleRadius;
import static com.mapbox.mapboxsdk.style.layers.PropertyFactory.lineColor;
import static com.mapbox.mapboxsdk.style.layers.PropertyFactory.lineJoin;
import static com.mapbox.mapboxsdk.style.layers.PropertyFactory.lineWidth;
import static com.mapbox.turf.TurfConstants.UNIT_KILOMETERS;
/**
* Use {@link com.mapbox.turf.TurfMeasurement#distance(Point, Point)} to measure the distance of a drawn line.
*/
public class TurfLineDistanceActivity extends AppCompatActivity implements MapboxMap.OnMapClickListener {
private static final String SOURCE_ID = "SOURCE_ID";
private static final String CIRCLE_LAYER_ID = "CIRCLE_LAYER_ID";
private static final String LINE_LAYER_ID = "LINE_LAYER_ID";
// Adjust private static final variables below to change the example's UI
private static final String STYLE_URI = "mapbox://styles/mapbox/cjv6rzz4j3m4b1fqcchuxclhb";
private static final int CIRCLE_COLOR = Color.RED;
private static final int LINE_COLOR = CIRCLE_COLOR;
private static final float CIRCLE_RADIUS = 6f;
private static final float LINE_WIDTH = 4f;
private static final String DISTANCE_UNITS = UNIT_KILOMETERS; // DISTANCE_UNITS must be equal to a String
// found in the TurfConstants class
private List<Point> pointList = new ArrayList<>();
private MapView mapView;
private MapboxMap mapboxMap;
private TextView lineLengthTextView;
private double totalLineDistance = 0;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// Mapbox access token is configured here. This needs to be called either in your application
// object or in the same activity which contains the mapview.
Mapbox.getInstance(this, getString(R.string.access_token));
// This contains the MapView in XML and needs to be called after the access token is configured.
setContentView(R.layout.activity_javaservices_turf_measure_line);
mapView = findViewById(R.id.mapView);
mapView.onCreate(savedInstanceState);
mapView.getMapAsync(new OnMapReadyCallback() {
@Override
public void onMapReady(@NonNull MapboxMap mapboxMap) {
lineLengthTextView = findViewById(R.id.line_length_textView);
// DISTANCE_UNITS must be equal to a String found in the TurfConstants class
lineLengthTextView.setText(String.format(getString(R.string.line_distance_textview),
DISTANCE_UNITS, String.valueOf(totalLineDistance)));
TurfLineDistanceActivity.this.mapboxMap = mapboxMap;
mapboxMap.setStyle(new Style.Builder()
.fromUri(STYLE_URI)
// Add the source to the map
.withSource(new GeoJsonSource(SOURCE_ID))
// Style and add the CircleLayer to the map
.withLayer(new CircleLayer(CIRCLE_LAYER_ID, SOURCE_ID).withProperties(
circleColor(CIRCLE_COLOR),
circleRadius(CIRCLE_RADIUS)
))
// Style and add the LineLayer to the map. The LineLayer is placed below the CircleLayer.
.withLayerBelow(new LineLayer(LINE_LAYER_ID, SOURCE_ID).withProperties(
lineColor(LINE_COLOR),
lineWidth(LINE_WIDTH),
lineJoin(LINE_JOIN_ROUND)
), CIRCLE_LAYER_ID), new Style.OnStyleLoaded() {
@Override
public void onStyleLoaded(@NonNull Style style) {
TurfLineDistanceActivity.this.mapboxMap.addOnMapClickListener(TurfLineDistanceActivity.this);
Toast.makeText(TurfLineDistanceActivity.this, getString(
R.string.line_distance_tap_instruction), Toast.LENGTH_SHORT).show();
}
}
);
}
});
}
@Override
public boolean onMapClick(@NonNull LatLng point) {
addClickPointToLine(point);
return true;
}
/**
* Handle the map click location and re-draw the circle and line data.
*
* @param clickLatLng where the map was tapped on.
*/
private void addClickPointToLine(@NonNull LatLng clickLatLng) {
mapboxMap.getStyle(new Style.OnStyleLoaded() {
@Override
public void onStyleLoaded(@NonNull Style style) {
// Get the source from the map's style
GeoJsonSource geoJsonSource = style.getSourceAs(SOURCE_ID);
if (geoJsonSource != null) {
pointList.add(Point.fromLngLat(clickLatLng.getLongitude(), clickLatLng.getLatitude()));
int pointListSize = pointList.size();
double distanceBetweenLastAndSecondToLastClickPoint = 0;
// Make the Turf calculation between the last tap point and the second-to-last tap point.
if (pointList.size() >= 2) {
distanceBetweenLastAndSecondToLastClickPoint = TurfMeasurement.distance(
pointList.get(pointListSize - 2), pointList.get(pointListSize - 1));
}
// Re-draw the new GeoJSON data
if (pointListSize >= 2 && distanceBetweenLastAndSecondToLastClickPoint > 0) {
// Add the last TurfMeasurement#distance calculated distance to the total line distance.
totalLineDistance += distanceBetweenLastAndSecondToLastClickPoint;
// Adjust the TextView to display the new total line distance.
// DISTANCE_UNITS must be equal to a String found in the TurfConstants class
lineLengthTextView.setText(String.format(getString(R.string.line_distance_textview), DISTANCE_UNITS,
String.valueOf(totalLineDistance)));
// Set the specific source's GeoJSON data
geoJsonSource.setGeoJson(Feature.fromGeometry(LineString.fromLngLats(pointList)));
}
}
}
});
}
// Add the mapView lifecycle to the activity's lifecycle methods
@Override
public void onResume() {
super.onResume();
mapView.onResume();
}
@Override
protected void onStart() {
super.onStart();
mapView.onStart();
}
@Override
protected void onStop() {
super.onStop();
mapView.onStop();
}
@Override
public void onPause() {
super.onPause();
mapView.onPause();
}
@Override
public void onLowMemory() {
super.onLowMemory();
mapView.onLowMemory();
}
@Override
protected void onDestroy() {
super.onDestroy();
if (mapboxMap != null) {
mapboxMap.removeOnMapClickListener(this);
}
mapView.onDestroy();
}
@Override
protected void onSaveInstanceState(Bundle outState) {
super.onSaveInstanceState(outState);
mapView.onSaveInstanceState(outState);
}
}
Was this example helpful?