Broken Hearted explainer

The aim of this puzzle: Assemble the shapes into a red heart.
Walkthrough of the solution: To start, the square needs to rotate 45 degrees around the top-left corner. The top-left corner is given by its 'x' and 'y' attributes which are 101 and 33. To rotate, you are changing the 'transform' attribute and setting it to a value of 'rotate(45 101 33)' – remember the three numbers in the 'rotate' string are degrees clockwise, x and y coordinates of the pivot point. Next, the movedCircle needs to move to the point (68, 68). That means you want to set its 'cx' and 'cy' coordinates to 68. Remember, circles use 'cx' and 'cy' for “center x coordinate” and “center y coordinate”, and rectangles use 'x' and 'y' for the coordinates of the top-left corner. Then, for the littleCircle you need to change the radius to 48 using its 'r' attribute. Finally, all three shapes need to be colored 'red' by modifying the 'fill' attribute.
Sample code solution:
(Tap below to reveal)

square.attr('x', 101)
  .attr('y', 33)
  .attr('transform', 'rotate(45 101 33)')
  .attr('fill', 'red');
movedCircle.attr('cx', 68)
  .attr('cy', 68)
  .attr('fill', 'red');
littleCircle.attr('r', 48)
  .attr('fill', 'red');

JavaScript Concepts: Identifiers, Member Expression
D3 Concepts: .attr(‘x’,), .attr(‘y’,), .attr(‘transform’,), .attr(‘fill’,), .attr(‘cx’,), .attr(‘cy’,), .attr(‘r’,)
Additional Code (hidden code that runs before the puzzle’s code):

var svg = _svg.append('g');

var square = svg.append('rect').attr('width',95).attr('height',96);
var movedCircle = svg.append('circle').attr('r',48);
var littleCircle = svg.append('circle').attr('cx',133).attr('cy',68);

let scale = window.innerHeight/(190);
svg.attr('transform',`scale(${scale})`);