russelllim22 · September 4, 2021 10:41
diff --git a/d3-transition.html b/d3-transition.html
 <head>
  <script src="https://d3js.org/d3.v6.min.js"></script>
 </head>

 <body>
  <svg>
    <circle cx=50 cy=50 r=20 stroke=darkblue fill=lightblue></circle>
  </svg>

  <script>
    d3.select("#blueCircle")    // select the element using a css selector
    .transition() 
    .duration(3000)     // this transition will last 1500 seconds
    .attr("cx", 250)    // transition the cx attribute to 250
  </script>
 </body>
	<head>
	<script src="https://d3js.org/d3.v6.min.js"></script>
	</head>

	<body>
	<svg>
	<circle cx=50 cy=50 r=20 stroke=darkblue fill=lightblue></circle>
	</svg>

	<script>
	d3.select("#blueCircle") // select the element using a css selector
	.transition()
	.duration(3000) // this transition will last 1500 seconds
	.attr("cx", 250) // transition the cx attribute to 250
	</script>
	</body>