Component | Chord Diagram | Fix inconsistent transitions

#0
f5 · Feb 27, 2024 · 851d8f9 · 851d8f9
1 parent 1dae778
commit 851d8f9
Showing 2 changed files with 2 additions and 1 deletion.
diff --git a/packages/ts/src/components/chord-diagram/modules/label.ts b/packages/ts/src/components/chord-diagram/modules/label.ts
@@ -104,6 +104,7 @@ export function updateLabel<N extends ChordInputNode, L extends ChordInputLink>
   label.selectAll('textPath').remove()
 
   label.text(d => getString(d.data, nodeLabel))
+    .style('transition', `fill ${duration}ms`)
     .style('fill', d => getColor(d.data, nodeLabelColor) ?? getLabelFillColor(d, config))
     .style('text-anchor', d => getLabelTextAnchor(d, config))
     .each((d: ChordNode<N>, i: number, elements) => {

diff --git a/packages/ts/src/components/chord-diagram/modules/link.ts b/packages/ts/src/components/chord-diagram/modules/link.ts
@@ -69,7 +69,7 @@ export function updateLink<N extends ChordInputNode, L extends ChordInputLink> (
   duration: number
 ): void {
   selection
-    .style('transition', `fill-opacity: ${duration}ms`)
+    .style('transition', `fill ${duration}ms`)
     .style('fill', d => getColor(d.data, config.linkColor))
     .style('stroke', d => getColor(d.data, config.linkColor))