3D-диаграмма с использованием D3.js

Question

Я делаю вафлю, используя Scatter Plot Chart, и мне это удалось, все дело в том, что я сделал это в 2D, теперь я хочу преобразовать его в 3D, чтобы я мог видеть высоту каждого красителя.

Я пробовал d3.drag, вращение в D3. Также я попробовал пример в Интернете, в котором сделан 3D Scatter Plot, и этот график основан на автоматически генерируемых случайных значениях. Я хочу, чтобы мой график соответствовал предоставленным мною значениям, после чего новые значения во время вращения могут быть изменены.

// ADDING DYES THAT CAN BE SQAURES AND CIRCLES
var box = svg.append('g')
  .selectAll("dot")
  .data(data.filter(function (d) { return d.Wafer_ID==allGroup[0]}))
  .enter()
  .append("rect")
    .attr("x", function (d) { return x(d.X); } )//x coordinate
    .attr("y", function (d) { return y(d.Y); } )//y coordinate
    .attr("width", 5)
    .attr("height", 5)
    .on("mouseover", mouseover )//this is just for the tooltipiveadded
    .on("mousemove", mousemove )
        .on("mouseleave", mouseleave )
    .on("click", rotateL)//this is how i tried to rotate
     .style("fill", function (d) { 
                     if (d.Result == "Pass")     
                            {

                              return "green";

                            }

                            else 

                            {

                             return "red";

                             }
           } 
                    )

Я просто ожидаю, что Вафля, которую я делаю, будет 3D, не нужно менять ось и т. д., а также, если можно сделать только вертикальное вращение, это было бы полезно