Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Adding a method to stack transitions in objects with several parts #149

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 10 commits into
base: main
Choose a base branch
from
Open

Adding a method to stack transitions in objects with several parts #149

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
a2316b1
Added stackTransition and temp dev file
carlosvpi Nov 8, 2024
eb97bdd
Stack transition works on barchart
carlosvpi Nov 9, 2024
0f7f181
adding area chart call
carlosvpi Nov 9, 2024
0e99173
Rename
carlosvpi Nov 9, 2024
fb93508
New rename
carlosvpi Nov 9, 2024
4c6e4e6
Added singleArea
carlosvpi Nov 10, 2024
39e07e5
Final form
carlosvpi Nov 11, 2024
4d3029b
remove comments
carlosvpi Nov 11, 2024
60f70f5
Removed testing file:
carlosvpi Nov 12, 2024
bdf7f52
Introduced delay
carlosvpi Nov 12, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions src/transition/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import transition_remove from "./remove.js";
import transition_select from "./select.js";
import transition_selectAll from "./selectAll.js";
import transition_selection from "./selection.js";
import transition_stackTransition from "./stackTransition.js";
import transition_style from "./style.js";
import transition_styleTween from "./styleTween.js";
import transition_text from "./text.js";
Expand Down Expand Up @@ -59,6 +60,7 @@ Transition.prototype = transition.prototype = {
attr: transition_attr,
attrTween: transition_attrTween,
style: transition_style,
stackTransition: transition_stackTransition,
styleTween: transition_styleTween,
text: transition_text,
textTween: transition_textTween,
Expand Down
19 changes: 19 additions & 0 deletions src/transition/stackTransition.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
export default function stackTransition(data) {
const total = d3.sum(data)
const scales = d3.stack()
.keys([...data.keys()])
([data])
.map(([[start, end]]) => d3.scaleLinear([start/total, end/total], [0, 1]))

return function (element) {
const ease = element.ease()
element.delay(element.delay())
.duration(element.duration())
.easeVarying((_, i, slices) => t => {
let variation = scales[i](ease(t))
if (variation <= 0 && i > 0) return 0
if (variation > 1 && i < slices.length - 1) return 1
return variation
})
}
}