Skip to content

Commit

Permalink
Merge branch 'ordinal-axis' into release
Browse files Browse the repository at this point in the history
  • Loading branch information
@mbostock
mbostock committed Nov 23, 2011
2 parents 0404f35 + 532bf71 commit ee3954c
Show file tree
Hide file tree
Showing 11 changed files with 341 additions and 117 deletions.
75 changes: 51 additions & 24 deletions d3.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2323,6 +2323,10 @@ function d3_scaleExtent(domain) {
var start = domain[0], stop = domain[domain.length - 1];
return start < stop ? [start, stop] : [stop, start];
}

function d3_scaleRange(scale) {
return scale.rangeExtent ? scale.rangeExtent() : d3_scaleExtent(scale.range());
}
function d3_scale_nice(domain, nice) {
var i0 = 0,
i1 = domain.length - 1,
Expand Down Expand Up @@ -2694,6 +2698,10 @@ function d3_scale_ordinal(domain, ranger) {
return rangeBand;
};

scale.rangeExtent = function() {
return ranger.x;
};

scale.copy = function() {
return d3_scale_ordinal(domain, ranger);
};
Expand Down Expand Up @@ -3789,9 +3797,9 @@ d3.svg.axis = function() {
}
} : Object;

// Ticks.
var ticks = scale.ticks.apply(scale, tickArguments_),
tickFormat = tickFormat_ == null ? scale.tickFormat.apply(scale, tickArguments_) : tickFormat_;
// Ticks, or domain values for ordinal scales.
var ticks = scale.ticks ? scale.ticks.apply(scale, tickArguments_) : scale.domain(),
tickFormat = tickFormat_ == null ? (scale.tickFormat ? scale.tickFormat.apply(scale, tickArguments_) : String) : tickFormat_;

// Minor ticks.
var subticks = d3_svg_axisSubdivide(scale, ticks, tickSubdivide),
Expand All @@ -3808,14 +3816,15 @@ d3.svg.axis = function() {
tickTransform;

// Domain.
var range = d3_scaleExtent(scale.range()),
var range = d3_scaleRange(scale),
path = g.selectAll(".domain").data([0]),
pathEnter = path.enter().append("svg:path").attr("class", "domain"),
pathUpdate = transition(path);

// Stash the new scale and grab the old scale.
var scale0 = this.__chart__ || scale;
this.__chart__ = scale.copy();
// Stash a snapshot of the new scale, and retrieve the old snapshot.
var scale1 = scale.copy(),
scale0 = this.__chart__ || scale1;
this.__chart__ = scale1;

tickEnter.append("svg:line").attr("class", "tick");
tickEnter.append("svg:text");
Expand Down Expand Up @@ -3856,13 +3865,27 @@ d3.svg.axis = function() {
}
}

tickEnter.call(tickTransform, scale0);
tickUpdate.call(tickTransform, scale);
tickExit.call(tickTransform, scale);
// For quantitative scales:
// - enter new ticks from the old scale
// - exit old ticks to the new scale
if (scale.ticks) {
tickEnter.call(tickTransform, scale0);
tickUpdate.call(tickTransform, scale1);
tickExit.call(tickTransform, scale1);
subtickEnter.call(tickTransform, scale0);
subtickUpdate.call(tickTransform, scale1);
subtickExit.call(tickTransform, scale1);
}

subtickEnter.call(tickTransform, scale0);
subtickUpdate.call(tickTransform, scale);
subtickExit.call(tickTransform, scale);
// For ordinal scales:
// - any entering ticks are undefined in the old scale
// - any exiting ticks are undefined in the new scale
// Therefore, we only need to transition updating ticks.
else {
var dx = scale1.rangeBand() / 2, x = function(d) { return scale1(d) + dx; };
tickEnter.call(tickTransform, x);
tickUpdate.call(tickTransform, x);
}
});
}

Expand Down Expand Up @@ -3991,12 +4014,12 @@ d3.svg.brush = function() {
// Initialize the background to fill the defined range.
// If the range isn't defined, you can post-process.
if (x) {
e = d3_scaleExtent(x.range());
e = d3_scaleRange(x);
bg.attr("x", e[0]).attr("width", e[1] - e[0]);
d3_svg_brushRedrawX(g, extent);
}
if (y) {
e = d3_scaleExtent(y.range());
e = d3_scaleRange(y);
bg.attr("y", e[0]).attr("height", e[1] - e[0]);
d3_svg_brushRedrawY(g, extent);
}
Expand Down Expand Up @@ -4073,11 +4096,13 @@ d3.svg.brush = function() {
// Invert the pixel extent to data-space.
if (!arguments.length) {
if (x) {
x0 = x.invert(extent[0][0]), x1 = x.invert(extent[1][0]);
x0 = extent[0][0], x1 = extent[1][0];
if (x.invert) x0 = x.invert(x0), x1 = x.invert(x1);
if (x1 < x0) t = x0, x0 = x1, x1 = t;
}
if (y) {
y0 = y.invert(extent[0][1]), y1 = y.invert(extent[1][1]);
y0 = extent[0][1], y1 = extent[1][1];
if (y.invert) y0 = y.invert(y0), y1 = y.invert(y1);
if (y1 < y0) t = y0, y0 = y1, y1 = t;
}
return x && y ? [[x0, y0], [x1, y1]] : x ? [x0, x1] : y && [y0, y1];
Expand All @@ -4087,14 +4112,14 @@ d3.svg.brush = function() {
if (x) {
x0 = z[0], x1 = z[1];
if (y) x0 = x0[0], x1 = x1[0];
x0 = x(x0), x1 = x(x1);
if (x.invert) x0 = x(x0), x1 = x(x1);
if (x1 < x0) t = x0, x0 = x1, x1 = t;
extent[0][0] = x0, extent[1][0] = x1;
}
if (y) {
y0 = z[0], y1 = z[1];
if (x) y0 = y0[1], y1 = y1[1];
y0 = y(y0), y1 = y(y1);
if (y.invert) y0 = y(y0), y1 = y(y1);
if (y1 < y0) t = y0, y0 = y1, y1 = t;
extent[0][1] = y0, extent[1][1] = y1;
}
Expand Down Expand Up @@ -4209,28 +4234,30 @@ function d3_svg_brushMove() {
}

function d3_svg_brushMove1(mouse, scale, i) {
var range = d3_scaleExtent(scale.range()),
var range = d3_scaleRange(scale),
r0 = range[0],
r1 = range[1],
offset = d3_svg_brushOffset[i],
size = d3_svg_brushExtent[1][i] - d3_svg_brushExtent[0][i],
min,
max;

// When dragging, reduce the range by the extent size and offset.
if (d3_svg_brushDrag) {
range[0] -= offset;
range[1] -= size + offset;
r0 -= offset;
r1 -= size + offset;
}

// Clamp the mouse so that the extent fits within the range extent.
min = Math.max(range[0], Math.min(range[1], mouse[i]));
min = Math.max(r0, Math.min(r1, mouse[i]));

// Compute the new extent bounds.
if (d3_svg_brushDrag) {
max = (min += offset) + size;
} else {

// If the ALT key is pressed, then preserve the center of the extent.
if (d3_svg_brushCenter) offset = Math.max(range[0], Math.min(range[1], 2 * d3_svg_brushCenter[i] - min));
if (d3_svg_brushCenter) offset = Math.max(r0, Math.min(r1, 2 * d3_svg_brushCenter[i] - min));

// Compute the min and max of the offset and mouse.
if (offset < min) {
Expand Down
4 changes: 2 additions & 2 deletions d3.min.js
View file

Large diffs are not rendered by default.

142 changes: 75 additions & 67 deletions examples/bar/bar.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,90 +3,98 @@
<head>
<title>Bar Chart</title>
<script type="text/javascript" src="../../d3.js"></script>
<script type="text/javascript" src="../../d3.csv.js"></script>
<style type="text/css">

body {
font: 10px sans-serif;
}

svg {
.bar rect {
fill: steelblue;
}

.bar text.value {
fill: white;
}

.axis {
shape-rendering: crispEdges;
}

.axis path {
fill: none;
}

.x.axis line {
stroke: #fff;
stroke-opacity: .8;
}

.y.axis path {
stroke: black;
}

</style>
</head>
<body>
<script type="text/javascript">

var data = d3.range(10).map(Math.random);
var m = [30, 10, 10, 30],
w = 960 - m[1] - m[3],
h = 930 - m[0] - m[2];

var format = d3.format(",.0f");

var x = d3.scale.linear().range([0, w]),
y = d3.scale.ordinal().rangeRoundBands([0, h], .1);

var w = 430,
h = 230,
x = d3.scale.linear().domain([0, 1]).range([0, w]),
y = d3.scale.ordinal().domain(d3.range(data.length)).rangeBands([0, h], .2);
var xAxis = d3.svg.axis().scale(x).orient("top").tickSize(-h),
yAxis = d3.svg.axis().scale(y).orient("left").tickSize(0);

var vis = d3.select("body")
.append("svg:svg")
.attr("width", w + 40)
.attr("height", h + 20)
var svg = d3.select("body").append("svg:svg")
.attr("width", w + m[1] + m[3])
.attr("height", h + m[0] + m[2])
.append("svg:g")
.attr("transform", "translate(20,0)");

var bars = vis.selectAll("g.bar")
.data(data)
.enter().append("svg:g")
.attr("class", "bar")
.attr("transform", function(d, i) { return "translate(0," + y(i) + ")"; });

bars.append("svg:rect")
.attr("fill", "steelblue")
.attr("width", x)
.attr("height", y.rangeBand());

bars.append("svg:text")
.attr("x", x)
.attr("y", y.rangeBand() / 2)
.attr("dx", -6)
.attr("dy", ".35em")
.attr("fill", "white")
.attr("text-anchor", "end")
.text(x.tickFormat(100));

bars.append("svg:text")
.attr("x", 0)
.attr("y", y.rangeBand() / 2)
.attr("dx", -6)
.attr("dy", ".35em")
.attr("text-anchor", "end")
.text(function(d, i) { return String.fromCharCode(65 + i); });

var rules = vis.selectAll("g.rule")
.data(x.ticks(10))
.enter().append("svg:g")
.attr("class", "rule")
.attr("transform", function(d) { return "translate(" + x(d) + ",0)"; });

rules.append("svg:line")
.attr("y1", h)
.attr("y2", h + 6)
.attr("stroke", "black");

rules.append("svg:line")
.attr("y1", 0)
.attr("y2", h)
.attr("stroke", "white")
.attr("stroke-opacity", .3);

rules.append("svg:text")
.attr("y", h + 9)
.attr("dy", ".71em")
.attr("text-anchor", "middle")
.text(x.tickFormat(10));

vis.append("svg:line")
.attr("y1", 0)
.attr("y2", h)
.attr("stroke", "black");
.attr("transform", "translate(" + m[3] + "," + m[0] + ")");

d3.csv("sample-data.csv", function(data) {

// Parse numbers, and sort by value.
data.forEach(function(d) { d.value = +d.value; });
data.sort(function(a, b) { return b.value - a.value; });

// Set the scale domain.
x.domain([0, d3.max(data, function(d) { return d.value; })]);
y.domain(data.map(function(d) { return d.name; }));

var bar = svg.selectAll("g.bar")
.data(data)
.enter().append("svg:g")
.attr("class", "bar")
.attr("transform", function(d) { return "translate(0," + y(d.name) + ")"; });

bar.append("svg:rect")
.attr("width", function(d) { return x(d.value); })
.attr("height", y.rangeBand());

bar.append("svg:text")
.attr("class", "value")
.attr("x", function(d) { return x(d.value); })
.attr("y", y.rangeBand() / 2)
.attr("dx", -3)
.attr("dy", ".35em")
.attr("text-anchor", "end")
.text(function(d) { return format(d.value); });

svg.append("svg:g")
.attr("class", "x axis")
.call(xAxis);

svg.append("svg:g")
.attr("class", "y axis")
.call(yAxis);
});

</script>
</body>
Expand Down
53 changes: 53 additions & 0 deletions examples/bar/sample-data.csv
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
name,value
AL,4708708
AK,698473
AZ,6595778
AR,2889450
CA,36961664
CO,5024748
CT,3518288
DE,885122
DC,599657
FL,18537969
GA,9829211
HI,1295178
ID,1545801
IL,12910409
IN,6423113
IA,3007856
KS,2818747
KY,4314113
LA,4492076
ME,1318301
MD,5699478
MA,6593587
MI,9969727
MN,5266214
MS,2951996
MO,5987580
MT,974989
NE,1796619
NV,2643085
NH,1324575
NJ,8707739
NM,2009671
NY,19541453
NC,9380884
ND,646844
OH,11542645
OK,3687050
OR,3825657
PA,12604767
RI,1053209
SC,4561242
SD,812383
TN,6296254
TX,24782302
UT,2784572
VT,621760
VA,7882590
WA,6664195
WV,1819777
WI,5654774
WY,544270
PR,3967288
Loading

0 comments on commit ee3954c

Please sign in to comment.