Raincloud CartoCSS

last_hour.css

/** raincloud visualization */

@markerw: 2;
#last_1_hours{
  marker-fill: #0C2C84; 
  marker-width: 20;   
  marker-line-color: #FFF; 
  marker-line-width: 0; 
  marker-line-opacity: 0; 
  marker-opacity: 0.3; 
  marker-comp-op: multiply; 
  marker-type: ellipse; 
  marker-placement: point; 
  marker-allow-overlap: true; 
  marker-clip: false; 
  marker-multi-policy: largest; 
}
#last_1_hours{
  [globvalue <= 5] { 
    marker-fill: #225EA8;
  	marker-width: 1 + @markerw * 3;     
    [zoom>5]{ marker-width: @markerw * 7; } 
    [zoom>6]{ marker-width: @markerw * 14; } 
    [zoom>7]{ 
      marker-width: @markerw * 28;  
      marker-comp-op: src;
  } 
  }
  [globvalue <= 1] { 
    marker-fill: #1D91C0;
  	marker-width: @markerw * 3;     
    [zoom>5]{ marker-width: @markerw * 6; } 
    [zoom>6]{ marker-width: @markerw * 12; } 
    [zoom>7]{ 
      marker-width: @markerw * 24;  
      marker-comp-op: src;
    } 
  }
  [globvalue <= 0.5] { 
    marker-fill: #41B6C4;
  	marker-width: 1 + @markerw * 2; 
    [zoom>5]{ marker-width: @markerw * 5; }   
    [zoom>6]{ marker-width: @markerw * 10; } 
    [zoom>7]{ 
      marker-width: @markerw * 20;  
      marker-comp-op: src;
    }   
  }
  [globvalue <= 0.1] { 
    marker-fill: #7FCDBB;
  	marker-width: @markerw * 2;   
    [zoom>5]{ marker-width: @markerw * 4; }  
    [zoom>6]{ marker-width: @markerw * 8; } 
    [zoom>7]{ 
      marker-width: @markerw * 16;  
      marker-comp-op: src;
    }  
  }
  [globvalue <= 0.05] { 
    marker-fill: #D7FAF4;
  	marker-width: @markerw + 1; 
    [zoom>5]{ marker-width: @markerw * 3; }  
    [zoom>6]{ marker-width: @markerw * 6; } 
    [zoom>7]{ 
      marker-width: @markerw * 12;  
      marker-comp-op: src;
    }
  }
  [globvalue <= 0.01] { 
    marker-fill: #fbfeff ;
  	marker-width: @markerw; 
    [zoom>5]{ marker-width: @markerw * 2; } 
    [zoom>6]{ marker-width: @markerw * 4; } 
    [zoom>7]{ 
      marker-width: @markerw * 8; 
      marker-comp-op: src;
    } 
    marker-opacity: 0.2; 
  }
  [globvalue <= 0] { marker-fill: transparent;  }

}