Convert 2D shape into 3D in d3.js and adjust height according to the value in ANGULAR

I am using d3.js v6 to create a 3D graph of the below 2D chart representation. This circle has multiple squares in it and each square has been assigned a color based on the value. The bigger the value, more darker the square.

Now I want to convert this in 3D shape where only the height of a particular square increases when the value gets high, so the result would be somehow similar to the image below. The base would be circular but the height of each value would go up based on the value

I am trying too achieve this in angular, if anyone could please help me out. Here is the Stackblitz Link

from Convert 2D shape into 3D in d3.js and adjust height according to the value in ANGULAR