Permalink
Browse files

Transition improvements.

By default, on enter and exit marks have transparent stroke, fill and text
colors. These properties can be overridden if fading is not desired.
  • Loading branch information...
1 parent 7fe370e commit 06c5078a847b9db74cd5ffe3ffccbfaecea12221 Mike Bostock committed Jun 10, 2010
Showing with 34 additions and 44 deletions.
  1. +2 −1 Makefile
  2. +2 −12 src/mark/Mark.js
  3. +6 −0 src/mark/Transient.js
  4. +20 −17 src/mark/Transition.js
  5. +4 −14 tests/mark/transition.html
View
@@ -52,7 +52,8 @@ JS_CORE_FILES = \
src/mark/Image.js \
src/mark/Wedge.js \
src/mark/Ease.js \
- src/mark/Transition.js
+ src/mark/Transition.js \
+ src/mark/Transient.js
JS_LAYOUT_FILES = \
src/physics/Particle.js \
View
@@ -1227,16 +1227,6 @@ pv.Mark.prototype.transition = function(ms) {
return arguments.length ? t.duration(ms) : t;
};
-pv.Mark.prototype.enter = function() {
- if (this.$enter) return this.$enter;
- var e = this.$enter = new pv.Mark();
- e.defaults = null;
- return e;
-};
-
-pv.Mark.prototype.exit = function() {
- if (this.$exit) return this.$exit;
- var e = this.$exit = new pv.Mark();
- e.defaults = null;
- return e;
+pv.Mark.prototype.on = function(state) {
+ return this["$" + state] = new pv.Transient();
};
View
@@ -0,0 +1,6 @@
+pv.Transient = function() {
+ pv.Mark.call(this);
+ this.fillStyle(null).strokeStyle(null).textStyle(null);
+};
+
+pv.Transient.prototype = pv.extend(pv.Mark);
View
@@ -26,6 +26,8 @@ pv.Transition = function(mark) {
textMargin: 1
};
+ var defaults = new pv.Transient();
+
var none = pv.Color.transparent;
that.ease = function(x) {
@@ -121,31 +123,32 @@ pv.Transition = function(mark) {
/** @private */
function override(scene, index, proto, target) {
-
var s = pv.extend(scene[index]),
m = scene.mark,
- r = m.root.scene;
-
- scene = pv.extend(scene);
- scene[index] = s;
- s.target = target;
-
- var properties = m.binds.optional;
- if (proto) {
- var seen = {};
- for (var i = 0; i < proto.$properties.length; i++) {
- seen[proto.$properties[i].name] = 1;
- }
- properties = properties
- .filter(function(p) { return !(p.name in seen); })
- .concat(proto.$properties);
+ r = m.root.scene,
+ p = (proto || defaults).$properties;
+
+ /* Correct the target reference, if this is an anchor. */
+ if (target) {
+ scene = pv.extend(scene);
+ scene[index] = s;
+ s.target = target;
}
+ /* Determine the set of properties to evaluate. */
+ var seen = {};
+ for (var i = 0; i < p.length; i++) seen[p[i].name] = 1;
+ p = m.binds.optional
+ .filter(function(p) { return !(p.name in seen); })
+ .concat(p);
+
+ /* Evaluate the properties and update any implied ones. */
m.context(scene, index, function() {
- this.buildProperties(s, properties);
+ this.buildProperties(s, p);
this.buildImplied(s);
});
+ /* Restore the root scene. This should probably be done by context(). */
m.root.scene = r;
return s;
}
View
@@ -69,23 +69,13 @@
.bottom(function(d) y1(d))
.strokeStyle("#ddd");
-var label = rule.anchor("left").add(pv.Label)
- .text(function(d) y1.tickFormat(d));
-
-rule.enter()
- .strokeStyle("transparent")
+rule.on("enter")
.bottom(function(d) y2(d));
-rule.exit()
- .strokeStyle("transparent");
-
-label.enter()
- .textStyle("transparent");
-
-label.exit()
- .textStyle("transparent");
+rule.anchor("left").add(pv.Label)
+ .text(function(d) y1.tickFormat(d));
-var bar = vis.add(pv.Bar)
+vis.add(pv.Bar)
.data(pv.range(20).map(function(d) (d >= 10 ? .55 : .05) + .45 * Math.random()))
.left(function() x(i & 1 ? ((this.index % 10) * 2 + (this.index >= 10)) : this.index))
.width(function() x.range().band)

0 comments on commit 06c5078

Please sign in to comment.