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

Commit

Permalink
disabling collision transition for clustering examples
Browse files Browse the repository at this point in the history
  • Loading branch information
@langsmith
langsmith committed Nov 19, 2019
1 parent 621a3af commit 05ba150
Show file tree
Hide file tree
Showing 2 changed files with 75 additions and 59 deletions.
91 changes: 47 additions & 44 deletions ...rc/main/java/com/mapbox/mapboxandroiddemo/examples/dds/CircleLayerClusteringActivity.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@
import com.mapbox.mapboxsdk.style.expressions.Expression;
import com.mapbox.mapboxsdk.style.layers.CircleLayer;
import com.mapbox.mapboxsdk.style.layers.SymbolLayer;
import com.mapbox.mapboxsdk.style.layers.TransitionOptions;
import com.mapbox.mapboxsdk.style.sources.GeoJsonOptions;
import com.mapbox.mapboxsdk.style.sources.GeoJsonSource;
import com.mapbox.mapboxsdk.utils.BitmapUtils;
Expand Down Expand Up @@ -58,7 +59,6 @@ public class CircleLayerClusteringActivity extends AppCompatActivity {
private MapView mapView;
private MapboxMap mapboxMap;


@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Expand All @@ -82,6 +82,11 @@ public void onMapReady(@NonNull MapboxMap map) {
map.setStyle(Style.LIGHT, new Style.OnStyleLoaded() {
@Override
public void onStyleLoaded(@NonNull Style style) {

// Disable any type of fading transition when icons collide on the map. This enhances the visual
// look of the data clustering together and breaking apart.
style.setTransition(new TransitionOptions(0, 0, false));

mapboxMap.animateCamera(CameraUpdateFactory.newLatLngZoom(new LatLng(
12.099, -79.045), 3));

Expand All @@ -100,49 +105,6 @@ public void onStyleLoaded(@NonNull Style style) {
});
}

@Override
public void onStart() {
super.onStart();
mapView.onStart();
}

@Override
public void onResume() {
super.onResume();
mapView.onResume();
}

@Override
public void onPause() {
super.onPause();
mapView.onPause();
}

@Override
public void onStop() {
super.onStop();
mapView.onStop();
}

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


private void addClusteredGeoJsonSource(@NonNull Style loadedMapStyle) {

// Add a new source from the GeoJSON data and set the 'cluster' option to true.
Expand Down Expand Up @@ -224,6 +186,47 @@ private void addClusteredGeoJsonSource(@NonNull Style loadedMapStyle) {
textAllowOverlap(true)
);
loadedMapStyle.addLayer(count);
}

@Override
public void onStart() {
super.onStart();
mapView.onStart();
}

@Override
public void onResume() {
super.onResume();
mapView.onResume();
}

@Override
public void onPause() {
super.onPause();
mapView.onPause();
}

@Override
public void onStop() {
super.onStop();
mapView.onStop();
}

@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);
}
}
43 changes: 28 additions & 15 deletions ...Demo/src/main/java/com/mapbox/mapboxandroiddemo/examples/dds/ImageClusteringActivity.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@
import com.mapbox.mapboxsdk.maps.Style;
import com.mapbox.mapboxsdk.style.expressions.Expression;
import com.mapbox.mapboxsdk.style.layers.SymbolLayer;
import com.mapbox.mapboxsdk.style.layers.TransitionOptions;
import com.mapbox.mapboxsdk.style.sources.GeoJsonOptions;
import com.mapbox.mapboxsdk.style.sources.GeoJsonSource;
import com.mapbox.mapboxsdk.utils.BitmapUtils;
Expand Down Expand Up @@ -41,10 +42,14 @@
import static com.mapbox.mapboxsdk.style.layers.PropertyFactory.textSize;

/**
* Use GeoJson data with SymbolLayers to create a data clustering effect.
* Use GeoJSON data with SymbolLayers to create a data clustering effect with icons rather than circles.
*/
public class ImageClusteringActivity extends AppCompatActivity implements OnMapReadyCallback {

private static final String CLUSTER_EARTHQUAKE_TRIANGLE_ICON_ID = "quake-triangle-icon-id";
private static final String SINGLE_EARTHQUAKE_TRIANGLE_ICON_ID = "single-quake-icon-id";
private static final String EARTHQUAKE_SOURCE_ID = "earthquakes";
private static final String POINT_COUNT = "point_count";
private MapView mapView;

@Override
Expand All @@ -67,6 +72,11 @@ public void onMapReady(@NonNull MapboxMap mapboxMap) {
mapboxMap.setStyle(Style.LIGHT, new Style.OnStyleLoaded() {
@Override
public void onStyleLoaded(@NonNull Style style) {

// Disable any type of fading transition when icons collide on the map. This enhances the visual
// look of the data clustering together and breaking apart.
style.setTransition(new TransitionOptions(0, 0, false));

initLayerIcons(style);
addClusteredGeoJsonSource(style);
Toast.makeText(ImageClusteringActivity.this, R.string.zoom_map_in_and_out_instruction,
Expand All @@ -76,9 +86,9 @@ public void onStyleLoaded(@NonNull Style style) {
}

private void initLayerIcons(@NonNull Style loadedMapStyle) {
loadedMapStyle.addImage("single-quake-icon-id", BitmapUtils.getBitmapFromDrawable(
loadedMapStyle.addImage(SINGLE_EARTHQUAKE_TRIANGLE_ICON_ID, BitmapUtils.getBitmapFromDrawable(
getResources().getDrawable(R.drawable.single_quake_icon)));
loadedMapStyle.addImage("quake-triangle-icon-id", BitmapUtils.getBitmapFromDrawable(
loadedMapStyle.addImage(CLUSTER_EARTHQUAKE_TRIANGLE_ICON_ID, BitmapUtils.getBitmapFromDrawable(
getResources().getDrawable(R.drawable.earthquake_triangle)));
}

Expand All @@ -88,7 +98,7 @@ private void addClusteredGeoJsonSource(@NonNull Style loadedMapStyle) {
loadedMapStyle.addSource(
// Point to GeoJSON data. This example visualizes all M1.0+ earthquakes from
// 12/22/15 to 1/21/16 as logged by USGS' Earthquake hazards program.
new GeoJsonSource("earthquakes",
new GeoJsonSource(EARTHQUAKE_SOURCE_ID,
new URI("https://www.mapbox.com/mapbox-gl-js/assets/earthquakes.geojson"),
new GeoJsonOptions()
.withCluster(true)
Expand All @@ -100,34 +110,37 @@ private void addClusteredGeoJsonSource(@NonNull Style loadedMapStyle) {
Timber.e("Check the URL %s" , uriSyntaxException.getMessage());
}

//Creating a SymbolLayer icon layer for single data/icon points
loadedMapStyle.addLayer(new SymbolLayer("unclustered-points", "earthquakes").withProperties(
iconImage("single-quake-icon-id"),
SymbolLayer unclusteredSymbolLayer = new SymbolLayer("unclustered-points", EARTHQUAKE_SOURCE_ID).withProperties(
iconImage(SINGLE_EARTHQUAKE_TRIANGLE_ICON_ID),
iconSize(
division(
get("mag"), literal(4.0f)
)
)
));
);
unclusteredSymbolLayer.setFilter(has("mag"));

//Creating a SymbolLayer icon layer for single data/icon points
loadedMapStyle.addLayer(unclusteredSymbolLayer);

// Use the earthquakes GeoJSON source to create three point ranges.
int[] layers = new int[] {150, 20, 0};

for (int i = 0; i < layers.length; i++) {
//Add clusters' SymbolLayers images
SymbolLayer symbolLayer = new SymbolLayer("cluster-" + i, "earthquakes");
SymbolLayer symbolLayer = new SymbolLayer("cluster-" + i, EARTHQUAKE_SOURCE_ID);

symbolLayer.setProperties(
iconImage("quake-triangle-icon-id")
iconImage(CLUSTER_EARTHQUAKE_TRIANGLE_ICON_ID)
);
Expression pointCount = toNumber(get("point_count"));
Expression pointCount = toNumber(get(POINT_COUNT));

// Add a filter to the cluster layer that hides the icons based on "point_count"
symbolLayer.setFilter(
i == 0
? all(has("point_count"),
? all(has(POINT_COUNT),
gte(pointCount, literal(layers[i]))
) : all(has("point_count"),
) : all(has(POINT_COUNT),
gte(pointCount, literal(layers[i])),
lt(pointCount, literal(layers[i - 1]))
)
Expand All @@ -136,8 +149,8 @@ private void addClusteredGeoJsonSource(@NonNull Style loadedMapStyle) {
}

//Add a SymbolLayer for the cluster data number point count
loadedMapStyle.addLayer(new SymbolLayer("count", "earthquakes").withProperties(
textField(Expression.toString(get("point_count"))),
loadedMapStyle.addLayer(new SymbolLayer("count", EARTHQUAKE_SOURCE_ID).withProperties(
textField(Expression.toString(get(POINT_COUNT))),
textSize(12f),
textColor(Color.BLACK),
textIgnorePlacement(true),
Expand Down

0 comments on commit 05ba150

Please sign in to comment.