search

datamade / clearstreets-web

Website that tracks where Chicago plows have been during a snowstorm.
http://clearstreets.org
MIT License
7 stars 6 forks source link

Thinner line width at higher level zooms #6

Closed fgregg closed 10 years ago

fgregg commented 10 years ago

At higher level zooms, the line segments should be thinner so they visually clump into a rat's nest.

CartoDB, awesomely, supports zoom-based styles

http://developers.cartodb.com/examples/zoom-based-styles.html

derekeder commented 10 years ago

Already implemented this to some extent:

#clearstreets_live_2013_12_16 {
  line-width: 3;
  [zoom<=9] { line-width: .8; }
  [zoom=10] { line-width: 1; }
  [zoom=11] { line-width: 1.1; }
  [zoom=12] { line-width: 1.2; }
  line-color: #000000;
  line-opacity: 0.7;
}

Need more?

fgregg commented 10 years ago

I thought it was maybe there. But yeah, maybe a little bit more.

On Tue, Dec 17, 2013 at 10:01 AM, Derek Eder notifications@github.comwrote:

Already implemented this to some extent:

clearstreets_live_2013_12_16 {

line-width: 3; [zoom<=9] { line-width: .8; } [zoom=10] { line-width: 1; } [zoom=11] { line-width: 1.1; } [zoom=12] { line-width: 1.2; } line-color: #000000; line-opacity: 0.7;}

Need more?

— Reply to this email directly or view it on GitHubhttps://github.com/open-city/clearstreets-web/issues/6#issuecomment-30763239 .

773.888.2718 2231 N. Monticello Ave Chicago, IL 60647

derekeder commented 10 years ago

Ok tried this, its live: http://clearstreets.org/

#clearstreets_live_2013_12_17 {
  line-width: 3;
  [zoom<=6] { line-width: 0.6; }
  [zoom =7] { line-width: 0.7; }
  [zoom =8] { line-width: 0.8; }
  [zoom =9] { line-width: 0.9; }
  [zoom=10] { line-width: 1; }
  [zoom=11] { line-width: 1.1; }
  [zoom=12] { line-width: 1.2; }
  line-color: #000000;
  line-opacity: 0.7;
}