Skip to content
This repository has been archived by the owner on Oct 7, 2024. It is now read-only.

Adding example of using TurfTransformation#circle to create visual ring #1039

Merged
merged 1 commit into from
May 14, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -74,6 +74,7 @@
import com.mapbox.mapboxandroiddemo.examples.javaservices.SimplifyPolylineActivity;
import com.mapbox.mapboxandroiddemo.examples.javaservices.StaticImageActivity;
import com.mapbox.mapboxandroiddemo.examples.javaservices.TilequeryActivity;
import com.mapbox.mapboxandroiddemo.examples.javaservices.TurfRingActivity;
import com.mapbox.mapboxandroiddemo.examples.labs.AnimatedImageGifActivity;
import com.mapbox.mapboxandroiddemo.examples.labs.AnimatedMarkerActivity;
import com.mapbox.mapboxandroiddemo.examples.labs.CalendarIntegrationActivity;
Expand Down Expand Up @@ -934,6 +935,15 @@ private void initializeModels() {
null,
R.string.activity_java_services_tilequery_url, false, BuildConfig.MIN_SDK_VERSION));

exampleItemModels.add(new ExampleItemModel(
R.id.nav_java_services,
R.string.activity_java_turf_ring_title,
R.string.activity_java_turf_ring_description,
new Intent(MainActivity.this, TurfRingActivity.class),
null,
R.string.activity_java_turf_ring_url, false, BuildConfig.MIN_SDK_VERSION
));

exampleItemModels.add(new ExampleItemModel(
R.id.nav_snapshot_image_generator,
R.string.activity_image_generator_snapshot_notification_title,
Expand Down
8 changes: 8 additions & 0 deletions MapboxAndroidDemo/src/main/AndroidManifest.xml
Original file line number Diff line number Diff line change
Expand Up @@ -773,6 +773,14 @@
android:name="android.support.PARENT_ACTIVITY"
android:value="com.mapbox.mapboxandroiddemo.MainActivity" />
</activity>
<activity
android:name=".examples.javaservices.TurfRingActivity"
android:label="@string/activity_java_turf_ring_title"
android:screenOrientation="portrait">
<meta-data
android:name="android.support.PARENT_ACTIVITY"
android:value="com.mapbox.mapboxandroiddemo.MainActivity" />
</activity>
<activity
android:name=".examples.labs.ValueAnimatorIconAnimationActivity"
android:label="@string/activity_lab_animated_interpolator_icon_drop_title"
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,166 @@
package com.mapbox.mapboxandroiddemo.examples.javaservices;

import android.graphics.Color;
import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.v7.app.AppCompatActivity;
import android.widget.Toast;

import com.mapbox.geojson.LineString;
import com.mapbox.geojson.Point;
import com.mapbox.geojson.Polygon;
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.FillLayer;
import com.mapbox.mapboxsdk.style.sources.GeoJsonSource;
import com.mapbox.turf.TurfMeta;
import com.mapbox.turf.TurfTransformation;

import static com.mapbox.mapboxsdk.style.layers.PropertyFactory.fillColor;
import static com.mapbox.turf.TurfConstants.UNIT_MILES;

/**
* Use {@link TurfTransformation#circle(Point, double, int, String)} to draw a hollow circle
* (i.e. ring) around a center coordinate.
*/
public class TurfRingActivity extends AppCompatActivity implements MapboxMap.OnMapClickListener {
private static final String OUTER_CIRCLE_GEOJSON_SOURCE_ID = "OUTER_CIRCLE_GEOJSON_SOURCE_ID";
private static final String INNER_CIRCLE_GEOJSON_SOURCE_ID = "INNER_CIRCLE_GEOJSON_SOURCE_ID";
private static final String OUTER_CIRCLE_LAYER_ID = "OUTER_CIRCLE_LAYER_ID";
private static final String INNER_CIRCLE_LAYER_ID = "INNER_CIRCLE_LAYER_ID";
private static final int OUTER_CIRCLE_MILE_RADIUS = 1;
private static final double MILE_DIFFERENCE_BETWEEN_CIRCLES = .2;
private static final int CIRCLE_STEPS = 360;
private static final Point POINT_IN_MIDDLE_OF_CIRCLE = Point.fromLngLat(-115.150738, 36.16218);
private MapView mapView;
private MapboxMap mapboxMap;

@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_lab_hollow_circle);

mapView = findViewById(R.id.mapView);
mapView.onCreate(savedInstanceState);

mapView.getMapAsync(new OnMapReadyCallback() {
@Override
public void onMapReady(@NonNull MapboxMap mapboxMap) {
TurfRingActivity.this.mapboxMap = mapboxMap;
mapboxMap.setStyle(new Style.Builder()
.fromUrl(Style.LIGHT)
.withSource(new GeoJsonSource(OUTER_CIRCLE_GEOJSON_SOURCE_ID))
.withSource(new GeoJsonSource(INNER_CIRCLE_GEOJSON_SOURCE_ID))
.withLayer(new FillLayer(OUTER_CIRCLE_LAYER_ID, OUTER_CIRCLE_GEOJSON_SOURCE_ID).withProperties(
fillColor(Color.RED)
))
.withLayer(new FillLayer(INNER_CIRCLE_LAYER_ID, INNER_CIRCLE_GEOJSON_SOURCE_ID).withProperties(
fillColor(Color.RED)
)), new Style.OnStyleLoaded() {
@Override
public void onStyleLoaded(@NonNull Style style) {
moveRing(POINT_IN_MIDDLE_OF_CIRCLE);

TurfRingActivity.this.mapboxMap.addOnMapClickListener(TurfRingActivity.this);

Toast.makeText(TurfRingActivity.this, getString(R.string.tap_on_map),
Toast.LENGTH_SHORT).show();
}
}
);
}
});
}

@Override
public boolean onMapClick(@NonNull LatLng point) {

moveRing(Point.fromLngLat(point.getLongitude(), point.getLatitude()));

return true;
}

private void moveRing(Point centerPoint) {
if (mapboxMap.getStyle() != null) {
Style style = mapboxMap.getStyle();
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

just as fyi, alternatively to avoid nullability of a style you can use mapboxMap.getStyle(OnStyleLoadedCallback) this will give you a hook where style will always be non null.


// Use Turf to calculate the coordinates for the outer ring of the final Polygon
Polygon outerCirclePolygon = getTurfPolygon(OUTER_CIRCLE_MILE_RADIUS, centerPoint);

// Use Turf to calculate the coordinates for the inner ring of the final Polygon
Polygon innerCirclePolygon = getTurfPolygon(
OUTER_CIRCLE_MILE_RADIUS - MILE_DIFFERENCE_BETWEEN_CIRCLES, centerPoint);

GeoJsonSource outerCircleSource = style.getSourceAs(OUTER_CIRCLE_GEOJSON_SOURCE_ID);

if (outerCircleSource != null) {

// Use the two Polygon objects above to create the final Polygon that visually represents the ring.
outerCircleSource.setGeoJson(Polygon.fromOuterInner(
// Create outer LineString
LineString.fromLngLats(TurfMeta.coordAll(outerCirclePolygon, false)),
// Create inter LineString
LineString.fromLngLats(TurfMeta.coordAll(innerCirclePolygon, false))
));
}
}
}

private Polygon getTurfPolygon(@NonNull double radius, Point centerPoint) {
return TurfTransformation.circle(centerPoint, radius, CIRCLE_STEPS, UNIT_MILES);
}

// 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();
mapView.onDestroy();
}

@Override
protected void onSaveInstanceState(Bundle outState) {
super.onSaveInstanceState(outState);
mapView.onSaveInstanceState(outState);
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".examples.labs.SpaceStationLocationActivity">

<com.mapbox.mapboxsdk.maps.MapView
android:id="@+id/mapView"
android:layout_width="match_parent"
mapbox:mapbox_cameraTargetLat=" 36.16218"
mapbox:mapbox_cameraTargetLng="-115.150738"
mapbox:mapbox_cameraZoom="11"
android:layout_height="match_parent"/>

</RelativeLayout>
3 changes: 3 additions & 0 deletions MapboxAndroidDemo/src/main/res/values/activity_strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -333,4 +333,7 @@

<!-- Polygon toggle -->
<string name="tap_on_neighborhood">Tap on a neighborhood area to toggle its color</string>

<!-- Turf circle ring-->
<string name="tap_on_map">Tap on the map to move the ring</string>
</resources>
Original file line number Diff line number Diff line change
Expand Up @@ -117,4 +117,5 @@
<string name="activity_dds_polygon_select_toggle_description">Tap on various polygons to "select" them and toggle their colors.</string>
<string name="activity_china_simple_china_mapview_description">Show an accurate and government-approved China map in your app using the Mapbox Maps SDK.</string>
<string name="activity_lab_home_screen_widget_description">Show the device\'s current location or other information in a homescreen widget.</string>
<string name="activity_java_turf_ring_description">Use Turf to calculate coordinates to eventually draw a ring around a center coordinate.</string>
</resources>
1 change: 1 addition & 0 deletions MapboxAndroidDemo/src/main/res/values/titles_strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -115,4 +115,5 @@
<string name="activity_dds_polygon_select_toggle_title">Polygon toggle</string>
<string name="activity_china_simple_china_mapview_title">China map view</string>
<string name="activity_lab_home_screen_widget_title">Homescreen geocoding widget</string>
<string name="activity_java_turf_ring_title">Hollow circle</string>
</resources>
1 change: 1 addition & 0 deletions MapboxAndroidDemo/src/main/res/values/urls_strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -117,4 +117,5 @@
<string name="activity_dds_polygon_select_toggle_url" translatable="false">https://i.imgur.com/gVIfE3G.png</string>
<string name="activity_china_simple_china_mapview_url" translatable="false">https://i.imgur.com/KwoEynZ.png</string>
<string name="activity_lab_home_screen_widget_url" translatable="false">https://i.imgur.com/H5N9jDn.png</string>
<string name="activity_java_turf_ring_url" translatable="false">https://i.imgur.com/nG8xeXH.png</string>
</resources>