diff --git a/d2renderers/d2animate/d2animate.go b/d2renderers/d2animate/d2animate.go index b2f1b3074..7fca92dd7 100644 --- a/d2renderers/d2animate/d2animate.go +++ b/d2renderers/d2animate/d2animate.go @@ -14,23 +14,23 @@ import ( var transitionDurationMS = 1 -func makeKeyframe(delayMS, durationMS, totalMS, identifier int) string { +func makeKeyframe(delayMS, durationMS, totalMS, identifier int, diagramHash string) string { percentageBefore := (math.Max(0, float64(delayMS-transitionDurationMS)) / float64(totalMS)) * 100. percentageStart := (float64(delayMS) / float64(totalMS)) * 100. percentageEnd := (float64(delayMS+durationMS-transitionDurationMS) / float64(totalMS)) * 100. if int(math.Ceil(percentageEnd)) == 100 { - return fmt.Sprintf(`@keyframes d2Transition-%d { + return fmt.Sprintf(`@keyframes d2Transition-%s-%d { 0%%, %f%% { opacity: 0; } %f%%, %f%% { opacity: 1; } -}`, identifier, percentageBefore, percentageStart, math.Ceil(percentageEnd)) +}`, diagramHash, identifier, percentageBefore, percentageStart, math.Ceil(percentageEnd)) } percentageAfter := (float64(delayMS+durationMS) / float64(totalMS)) * 100. - return fmt.Sprintf(`@keyframes d2Transition-%d { + return fmt.Sprintf(`@keyframes d2Transition-%s-%d { 0%%, %f%% { opacity: 0; } @@ -40,7 +40,7 @@ func makeKeyframe(delayMS, durationMS, totalMS, identifier int) string { %f%%, 100%% { opacity: 0; } -}`, identifier, percentageBefore, percentageStart, percentageEnd, percentageAfter) +}`, diagramHash, identifier, percentageBefore, percentageStart, percentageEnd, percentageAfter) } func Wrap(rootDiagram *d2target.Diagram, svgs [][]byte, renderOpts d2svg.RenderOpts, intervalMS int) ([]byte, error) { @@ -99,13 +99,13 @@ func Wrap(rootDiagram *d2target.Diagram, svgs [][]byte, renderOpts d2svg.RenderO fmt.Fprint(buf, ``) for i, svg := range svgs { str := string(svg) - str = strings.Replace(str, "