andy/planetary.js
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update quake example

Browse Source
This commit is contained in:
Brandon Tilley 2013-12-23 22:23:31 -08:00
parent 2c85e4d92e
commit 4bff52356c
2 changed files with 24 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
site/public/examples/quake.ejs
View File

@ -55,16 +55,19 @@
// Create a color scale for the various earthquake magnitudes; the // Create a color scale for the various earthquake magnitudes; the
// minimum magnitude in our data set is 2.5. // minimum magnitude in our data set is 2.5.
var colors = d3.scale.pow() var colors = d3.scale.pow()
.exponent(2) .exponent(3)
.domain([2, 6,10]) .domain([2, 6, 10])
.range(['rgb(255,255,204)', 'rgb(253,141,60)','rgb(128,0,38)']) .range(['yellow', 'orange', 'red']);
.clamp(true);
// Also create a scale for mapping magnitudes to ping angle sizes // Also create a scale for mapping magnitudes to ping angle sizes
var angles = d3.scale.pow() var angles = d3.scale.pow()
.exponent(2) .exponent(3)
.domain([2.5, 10]) .domain([2.5, 10])
.range([0.5, 15]) .range([0.5, 15]);
.clamp(true); // And finally, a scale for mapping magnitudes to ping TTLs
var ttls = d3.scale.pow()
.exponent(3)
.domain([2.5, 10])
.range([2000, 5000]);
// Create a key to show the magnitudes and their colors // Create a key to show the magnitudes and their colors
d3.select('#magnitudes').selectAll('li') d3.select('#magnitudes').selectAll('li')
@ -159,7 +162,8 @@
// Here we use the `angles` and `colors` scales we built earlier // Here we use the `angles` and `colors` scales we built earlier
// to convert magnitudes to appropriate angles and colors. // to convert magnitudes to appropriate angles and colors.
angle: angles(ping.mag), angle: angles(ping.mag),
color: colors(ping.mag) color: colors(ping.mag),
ttl: ttls(ping.mag)
}); });
} }

20
site/public/examples/quake/quake.js
View File

@ -32,16 +32,19 @@
// Create a color scale for the various earthquake magnitudes; the // Create a color scale for the various earthquake magnitudes; the
// minimum magnitude in our data set is 2.5. // minimum magnitude in our data set is 2.5.
var colors = d3.scale.pow() var colors = d3.scale.pow()
.exponent(2) .exponent(3)
.domain([2, 6,10]) .domain([2, 6, 10])
.range(['rgb(255,255,204)', 'rgb(253,141,60)','rgb(128,0,38)']) .range(['yellow', 'orange', 'red']);
.clamp(true);
// Also create a scale for mapping magnitudes to ping angle sizes // Also create a scale for mapping magnitudes to ping angle sizes
var angles = d3.scale.pow() var angles = d3.scale.pow()
.exponent(2) .exponent(3)
.domain([2.5, 10]) .domain([2.5, 10])
.range([0.5, 15]) .range([0.5, 15]);
.clamp(true); // And finally, a scale for mapping magnitudes to ping TTLs
var ttls = d3.scale.pow()
.exponent(3)
.domain([2.5, 10])
.range([2000, 5000]);
// Create a key to show the magnitudes and their colors // Create a key to show the magnitudes and their colors
d3.select('#magnitudes').selectAll('li') d3.select('#magnitudes').selectAll('li')
@ -136,7 +139,8 @@
// Here we use the `angles` and `colors` scales we built earlier // Here we use the `angles` and `colors` scales we built earlier
// to convert magnitudes to appropriate angles and colors. // to convert magnitudes to appropriate angles and colors.
angle: angles(ping.mag), angle: angles(ping.mag),
color: colors(ping.mag) color: colors(ping.mag),
ttl: ttls(ping.mag)
}); });
} }