@@ -128,19 +128,43 @@ attribute defintion (*e.g.*, *right* = *width* - *x*).
128128
129129The next big difference is that D3 code describes * transformations* of scenes
130130(scene changes), whereas Protovis describes * representations* (the scenes
131- themselves). This means you may write more code with D3—where Protovis would
132- automatically re-evaluate all properties to update the scene, D3 needs explicit
133- instruction. However, it also eliminates the substantial overhead discussed in
134- the previous section. And it's not a matter of deficient implementation—Protovis
135- is not given enough information, in terms of dependencies between properties and
136- data, to update the scene efficiently.
137-
138- In conjunction with transformations, D3's data-binding allows [ enter &
139- exit] ( ../#enter_and_exit ) selections, which control which elements are added or
140- removed, and what happens to them during enter and exit. You can even bind data
141- to existing documents, decoupling transformation from generation. D3 supports
142- automatic * transitions* , where attributes or styles are smoothly interpolated
143- over time. Transitions were
131+ themselves). For example, to create a set of labels in Protovis:
132+
133+ {% highlight js linenos %}
134+ var l = vis.add(pv.Label)
135+ .data([ 4, 8, 15, 16, 23, 42] )
136+ .text(String);
137+ {% endhighlight %}
138+
139+ If the data changed, Protovis would automatically re-evaluate the text property,
140+ and add or remove labels as necessary, on re-render. D3, in contrast, requires
141+ more explicit instruction. However, by specifying transformations explicitly,
142+ you can control which elements are added or removed, and what happens to them:
143+
144+ {% highlight js linenos %}
145+ // Update…
146+ var l = vis.selectAll("svg: text ")
147+ .data([ 4, 8, 15, 16, 23, 42] )
148+ .text(String);
149+
150+ // Enter…
151+ l.enter().append("svg: text ")
152+ .text(String);
153+
154+ // Exit…
155+ l.exit().remove();
156+ {% endhighlight %}
157+
158+ This approach eliminates the substantial overhead discussed in the previous
159+ section, and offers greater expressiveness. Performance is not just a matter of
160+ implementation—Protovis does not have enough information, in terms of
161+ dependencies, to update the scene efficiently. D3 can even bind data to existing
162+ documents, decoupling transformation from generation. For more on
163+ transformations, see the [ enter & exit] ( ../#enter_and_exit ) section of the
164+ overview, and [ part 2] ( bar-2.html ) of the bar chart tutorial.
165+
166+ Perhaps the sexiest change is that D3 supports automatic * transitions* , where
167+ attributes or styles are smoothly interpolated over time. Transitions were
144168[ experimented] ( https://github.com/mbostock/protovis/tree/transition ) with
145169Protovis, but without direct control over transformations, the Protovis model
146170became unwieldy for dynamic scenes.
0 commit comments