Question

使用JavaScript，我创建了一个程序，它接受<ol></ol>个链接并生成一个圆环图，其中每个段的大小相同并包含超链接文本。它旨在作为一种不同的导航方法。

以下是我的程序的示例输出：

Doughnut chart program output, please view

圆环图是通过创建一系列片段来制作圆圈，饼图，然后在此图表的中心放置一个较小的圆圈来制作圆环图。

请注意，添加中心孔后，文本需要偏移才能正确居中。但是，此偏移的方向取决于段在图表上的位置。

细分数量等于<li></li>中<ol></ol>项的数量。该程序仅用于3-9之间长度的列表。

我怎样才能让我的代码决定应用于每个段的偏移量？

我的第一个想法：

创建一个switch语句来评估图表中的段数。然后，为每个单独的段应用偏移量。 E.G：

＆＃13;

   for (var i = 0; i < NumOfSegments; i++) {
    switch (NumOfSegments) {
      case 3:
        if (currentSegment == 0){
          //Apply offset for segment 1
        } else if (current segment == 1){
          //Apply offset for segment 2
        } else if (current segment == 2){
          //Apply offset for segment 3
        }
        break;
      case: 4:
        if (currentSegment == 0){
          //Apply offset for segment 1
        } else if (current segment == 1){
          //Apply offset for segment 2
        } else if (current segment == 2){
          //Apply offset for segment 3
        } } else if (current segment == 3){
          //Apply offset for segment 4
        }
        break;
      
      . . .
      
    }
  }

＆＃13;

我的第二个想法

这个想法因为我不确定如何进步而停止了。但是：

设n等于圆环图中的段总数。设k等于n / 2.

如果当前正在绘制的列表在列表中的位置小于k，我们知道该段位于图表的左侧。

相反，如果当前正在绘制的列表中的位置大于k，我们知道该段位于列表的右侧。

因此，使用它，我们可以在一般化的方向上应用偏移量到列表的那一侧。但是，我不确定如何 - 如果不使用类似于我的第一个想法的方法 - 你可以为每个段应用更独特的偏移量。

任何意见都会感激不尽。我尽力解释这个问题，但如果您有任何疑问，请询问。

感谢。

动态偏移圆环图中的标签

0 个答案: