This version pulls out Flubber, which was a major aspect of implementing separate marks but made the semiotic-mark
have a much larger footprint than it should have. At the same time, the transitions, while fun, weren't really useful, since a straight geometric shape transition would still have weird graphical effects. I'll revisit ways to transition disparate shapes in the future, if there's interest.
Features
- Flubber was removed.
- A simple function to compare the number of control points in a path to the number of control points in the new path determines whether or not a path is graphically transitioned
- All
<Mark>
elements now have atransitionDuration
property that allows you to set the timing of the duration either as a simple global number or an object that defines an optionaldefault
and then specific values for any style or attribute tags so if you wanted you shape to transition 500ms for everything but 2000ms forfill
and 3000ms forstroke
you would send the following:
<Mark
...otherProps
transitionDuration={{ default: 500, fill: 2000, stroke: 3000 }}
/>
Whereas if you wanted to set all the transitions to 750ms you could just do this:
<Mark
...otherProps
transitionDuration={750}
/>
The default duration is still 1000ms if nothing is set.
Fixes
- More attributes can be used as styles than I knew so now the whitelist checks them all (hopefully) for instance, before if you sent
r
as a style to a<circle>
(or equivalent) it wouldn't update because it expectedr
to only be sent as an attribute.