1

I'm trying to put together an animated map of population data for two different species on five different islands. I would like the population of each to be displayed as a standard marker whose width is proportional to the population of the species for the given year, animated over twenty years. When played, the animation should show 10 stationary bubbles, in concentric pairs located on each island expanding and contracting to reflect their annual populations.

I am having some difficulty though setting this up in Carto Builder CSS, such that marker-width is defined by different thresholds of the 'value' as produced by the torque-aggregation-function: "round(avg(population))". Perhaps I do not understand exactly what the 'value' is and how it changes, but I have followed examples such as this one: http://andrewxhill.com/blog/2015/04/17/torque-unknown/ but do not understand how the threshold values for marker-width graduations were determined.

The following code seems to work for a single species but the sizing thresholds don't seem to respond exactly to the population data. When I try to use the dataset for both species, using different colors with "marker-fill: ramp([value], (#5B3F95, #1D6996), (1, 2), "=");" the markers do not expand and contract in the same way as they do individually (generally much less responsive), and the markers show up unfilled with outlines only.

    Map {
  -torque-frame-count: 20;
  -torque-animation-duration: 10;
  -torque-time-attribute: "year";
  -torque-aggregation-function:"round(avg(population))";
  -torque-resolution: 1;
  -torque-data-aggregation: linear;
}
#layer {
  marker-fill: #d71500;
  marker-fill-opacity: 1;
  marker-line-width: 1;
  marker-line-color: #FFF;
  marker-line-opacity: 1;
  comp-op: lighter;
}
#layer{
[value>0]{marker-width: 7;}
[value>3]{marker-width: 7.5;}
[value>6]{marker-width: 8;}
[value>9]{marker-width: 8.5;}
[value>12]{marker-width: 9;}
[value>15]{marker-width: 9.5;}
[value>20]{marker-width: 10;}
....
[value>1650]{marker-width: 47;}
[value>1700]{marker-width: 47.5;}
}
1

First, Torque only works with values from 0 to 250. So your population field should be normalized. Also, I recommend not to use "round", I am not sure if It is supported. Finally, turbo carto ramps functions do not work fine with Torque. So your traditional CartoCSS approach is OK. Here you have a working example.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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