javascript - 我可以修改饼图中价值重新分配的逻辑吗？

Question

在 LightningchartJS 饼图中，我们可以改变价值再分配的逻辑。例如，考虑图 1 中的图表。如果我隐藏某个区域（例如规划），则值的百分比在所有其他区域中均等分布，请参见图 2。有没有一种方法可以自定义这种值的分布？

Answer 1

您可以使用 .setLabelFormatter() 方法自定义标签。

您可以查看LightningChart JS API 文档中的Slice LabelFormatter，以获取有关如何使用自定义实现的示例。

分配隐藏切片的值

如果您想重新分配隐藏切片的值，则可能但更棘手，因为饼图本身没有此功能。

这可以通过向 legendBox 的按钮添加所需的功能来完成。

创建图例框后，您可以添加特定切片而不是添加整个饼图，然后修改单击每个条目时的行为。

// Add a legendBox UI element
const legendBox = chart.addLegendBox()

// Add the slices to the legendBox separately, so we can use custom behavior when clicking on the entries
const entry = legendBox.add( slice1 )

entry.onSwitch((_, state) => {
  // If the entry's state is true after clicking, restore everything to normal
  if(state) {
    slice1.restore()
    slice2.setValue(120)
  // Else, hide the slice the entry is linked to, and distribute its value to another slice
  } else {
    slice1.dispose()
    slice2.setValue(160)
  }
}