mapbox / mapbox-gl-js

Interactive, thoroughly customizable maps in the browser, powered by vector tiles and WebGL
https://docs.mapbox.com/mapbox-gl-js/
Other
11.19k stars 2.22k forks source link

Add "TIN" or heatmap layer type #3994

Closed lucaswoj closed 7 years ago

lucaswoj commented 7 years ago

Note that we may decline to support these features being in core and use #281 to make them plugins

Continued from https://github.com/mapbox/DEPRECATED-mapbox-gl/issues/8 by @lucaswoj

We should start thinking about a blue-sky solution for rendering TINs, as suggested in https://github.com/mapbox/mapbox-gl-js/issues/1295#issuecomment-115181554. This feature would be very useful for drawing heatmaps and hillshades, potentially supplanting most of the use cases for custom shaders.

  • what should we call these layers?
  • what kind of data source should power these layers?
  • how should these layers be styled?

Continued from https://github.com/mapbox/DEPRECATED-mapbox-gl/issues/27 by @1ec5

This GL JS example and this Android SDK demo app activity claim to demonstrate “heat maps”, but in reality they’re hot spot maps. The “heat” only represents frequency, but not, say, a magnitude property in the GL JS example. The overlaid shapes can be blurred circles but not amorphous shapes, and the heat comes apart as you zoom in rather than spreading out.

Some of the requests we’ve gotten for heat maps (such as mapbox/mapbox-gl-native#3420, mapbox/mapbox-gl-native#6304) have turned out to be for actual heat maps. In the Google Maps JavaScript API, HeatmapLayer can work with WeightedLocations for this effect. The Google Maps SDK for Android supports heat maps as well using HeatmapTileProvider and WeightedLatLng. On iOS/macOS, there are a number of libraries based on MapKit (example) that implement heat maps using a custom-rendered MKOverlayView or the more modern MKOverlayRenderer.

The Android and iOS SDKs support something along the lines of these MapKit-based libraries, via an unsupported, undocumented OpenGL style layer API. But we should have a straightforward, officially supported solution for heat maps. As far as I can tell, we may need a new layer type that clusters nearby points of similar intensity into amorphous shapes (rather than collapsing them down into a single point). Please chime in if you think it’s doable with the existing layer types, though.

/cc @mourner @lucaswoj @danswick @noemiwalzebuck @johndpope

1ec5 commented 7 years ago

Note that we may decline to support these features being in core and use #281 to make them plugins

Note that the native SDKs don’t have a formal concept of a plugin, and the analogous CustomLayer (Android) and MGLOpenGLStyleLayer (iOS and macOS) APIs aren’t officially supported.

/cc @friedbunny

lucaswoj commented 7 years ago

@1ec5 As we build out #281 we hope to define a supported API for CustomLayers across all our SDKs

mourner commented 7 years ago

I was also initially under impression that we can implement heatmaps using TINs, but I was wrong. Heatmaps are conceptually different and TINs won't help us with proper heatmaps. For them, I opened a new ticket: #4756. We're also implementing hillshading through raster-based techniques (#4701). That means we no longer have an appealing immediate use for TINs (at least in the core), so we don't need an issue opened for it.