Multiple layer type shapes like the circle

[SourceCipher]

Motivation

Currently we are testing the map to render 100k markers as circle shapes (with outgoing updates, drags etc). Works really well for the performance. We tried to add symbols but that reduces the performance by half, so symbols are off the charts.

Since circles are the best way to render the data and its the fastest way to do it, could we have multiple shapes like this or custom shapes added as a layer type?

Our goal is to have 100k markers but with various shapes displaying in them. We cant achieve good performance if we added symbols as a separate layer to draw the shapes inside the circles, but if we could render different layer on top as a separate markers of the type like the circle, it would be amazing.

Design Alternatives

Add multiple layer types like the circle (triangle, square, star etc) which has the same functionality as the existing circle or a property to pass custom canvas ctx shapes.

[rreusser]

It might not work for you, but is it possible to transition to a heatmap at lower zoom levels since that's presumably where you see too many symbols at once to maintain good performance? This page illustrates an example: https://docs.mapbox.com/mapbox-gl-js/example/heatmap-layer/

[SourceCipher]

@rreusser No, since we need to see markers with various shapes (or even better different marker shapes) at all times.

For example the best solution for us would be to have the layer as fast as of the type circle . What I would propose (I am not sure exactly how difficult it is to implement from looking at the source code), but having this 1 layer with multiple types of shapes would be the best way. Either by adding various shapes to the source or pass a custom.

Best way for usage and performance, to limit multiple layer creations would be smth like this:

map.addSource('test', {
  type: 'geojson',
  data: {
    type: 'FeatureCollection'  
    features: [
       { 
          type: 'circle' // or triangle, square etc
          properties: {}
       }
    ]
  }
});

map.addLayer({
  id: 'test',
  type: 'shapes', // instead of circle
  source: 'test'
});

OR

Still good performance but will have to create multiple layers for each different shape:

map.addLayer({
  id: 'test',
  type: 'circle', // or triangle, square, star etc
  source: 'test'
});

[SourceCipher]

@mourner Can I ask whats the process usually with the feature requests?

We are testing out the mapbox to see if it can handle our services for the big data and to see if its better than google maps which we currently use (which it is for now with current tests). But in order to switch the whole platform to mapbox is a big job and only can be done if we see a real improvement over gmaps. Without this feature I dont think its possible to achieve what we trying to do so it would be great to know if we should wait or just forget about this for some time?

[SourceCipher]

I am closing this off since there are no updates from anyone for almost half year.

I hope this will be looked into tho as this is the only thing which holds us from replacing gmaps and integrating into our project.

[SourceCipher]

I am reopening this since I managed to fork this repo and make the changes which now makes it possible to show the shapes within the markers.

I am sure the way I have done it is not the best solution and it could be recoded properly as I am not familiar with the source code.

You can see the changes I made and the example here https://github.com/SourceCipher/mapbox-gl-js-with-shapes

Can someone review the changes by comparing the repos and see if perhaps its possible to merge them and adapt this feature to the future releases?