I am new to CartoCSS and web mapping in general. I am working on a project with different sized points that represent populations in different locations around cities. What I want to do is have it such that the points do not overlap, especially at changing zoom levels. I played around a bit with the marker-overlap true/false, but that doesn't seem to help. I've used Jitter functions to do something similar in R and other data visualization things, but from my cursory search I did not see anything about this. Do I need to write instructions for different zoom levels in relation to this? I am hoping not to use a cluster function because the data in each dot represents different ethnic groups, something I want preserved at a larger scale.

EDIT: The problem is not points that share the same location - rather, the points are close by but "smush" together into one blob at higher zoom levels. I also want to retain the bubble size effect. See images : https://i.sstatic.net/6BhE0.jpg

EDIT: how to combine chloropleth, bubble and cluster designs in CARTO? <- this is a very similair problem, but again they have points that are on the same point rather than located close together.


   /** Nepal */

#diasporaoutreachinfo [ _1_country = "Nepal"]{
  marker-fill-opacity: 0.9;
  marker-line-color: #FFF;
  marker-line-width: 1;
  marker-line-opacity: 1;
  marker-placement: point;
  marker-multi-policy: largest;
  marker-type: ellipse;
  marker-fill: #41006D;
  marker-allow-overlap: true;
  marker-clip: false;
#diasporaoutreachinfo [ _1_country = "Nepal"][ _3_count <= 5700] {
  marker-width: 25.0;
  • Possible duplicate of carto.com when 2 points have the same location Commented Apr 1, 2018 at 9:50
  • thanks! I think my problem is more about points that are close to each other overlapping rather than points that are on the same location Commented Apr 1, 2018 at 23:11
  • 1
    Then you can do clustering as explained in this guide, and drag out the original points out. Then style based on zoom the layers in order to show the cluster/centroid in lower zoom levels and the original dots in higher ones. Commented Apr 3, 2018 at 9:00

1 Answer 1


If I understand you well, you want to offset bubbles so they don't overlap at all. That's not possible automatically with CartoCSS. What I would probably do is to limit the bubble effect to zoom levels where they don't overlap too much (with transparency you can have some overlapping and still the visualization is OK). For the lower zoom levels, you can change to other cartographic technique like using just the color value for your quantitative field or even aggregate those values into polygons or clustering.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.