javascript - 如何计算单击的 donut 元素的中点与负 y 轴之间的 Angular

Question

考虑以下代码 sample donut chart using jquery-flot ，现在我在点击 donut 时添加了“图像”类，我想在“图像”类中动态添加度数，以便点击的元素将在底部面朝下(就像在 -ve 侧y 轴)。`

var data = [{
    label: "Pause",
    data: 150
}, {
    label: "No Pause",
    data: 100
}, {
    label: "yes Pause",
    data: 80
}, {
    label: "Sleeping",
    data: 250
}];

var options = {
    series: {
        pie: {
            show: true,
            innerRadius: 0.5,
            radius: 1,
            startAngle: 1,

        }
    },
    grid: {
        hoverable: true,
        clickable: true
    },
    legend: {
    show: false
    },
    stroke: {
    width: 4
    },
    tooltip: true,
    tooltipOpts: {
        cssClass: "flotTip",
        content: "%s: %p.0%",
        defaultTheme: false
    }
};
$("#pie-placeholder").bind("plotclick", function(event, pos, obj) {
   $("#pie-placeholder").addClass('image')

    });
var plot = $.plot($("#pie-placeholder"), data, options);

`

注意:- 这是使用 Jquery flot 完成的

Answer 1

Here如果我猜对了，你可以找到我解决你问题的方法。

$("#pie-placeholder").bind("plotclick", function(event, pos, obj) {
if (obj) {
    var percentInRads = 0.02;
    var currSegmentInRads = percentInRads * obj.datapoint[0]
    var currSegmentOffset = currSegmentInRads / 2;
    var currSegmentStart = currSegmentOffset >= 0.5 ? -0.5 + currSegmentOffset : 0.5 - currSegmentOffset;
    var total = 0;
    var beforeTotal = 0;

    for (var idx = 0; idx < data.length; idx++) {
      var segment = data[idx];

      if (idx < obj.seriesIndex) {
        beforeTotal += segment.data;
      }

      total += segment.data;
    }

    var beforePart = (beforeTotal / total * 100) * percentInRads;
    var chartStartAngle = currSegmentStart - beforePart;

    options.series.pie.startAngle = chartStartAngle;
    $.plot($("#pie-placeholder"), data, options);
    console.log(obj.series);
}

});