c3.js - 如何使用 Keen.io 和 c3 绘制绝对值而不是百分比的甜甜圈？

Question

我正在使用 Keen.io ("version": "3.4.1") JavaScript SDK 以及它们与 C3.js 的集成，通过使用下面的代码生成圆环图。但是，我不想要百分比，而是绝对数字。即不是 25%，而是 7。

通过阅读文档并查看示例（请参阅“var c3gauge”）和示例，我认为您可以通过应用 chartOptions 来修改输出。这似乎不起作用。在这一点上，我觉得我在做一些愚蠢的事情，我只是没有抓住。

如何在我的甜甜圈中显示绝对值，而不是百分比？

                        var c3donut = new Keen.Dataviz()
                            .library('c3')
                            .chartType('donut')
                            .el(document.getElementById(elem))
                            .title("Awesome Sauce")
                            .parseRawData(data)
                            .chartOptions({
                                donut: {
                                    label: {
                                        format: function (value) {
                                            console.log("I never fire, why?");
                                            return value;
                                        }
                                    }
                                }
                            })
                            .render();

Answer 1

这可以通过敏锐的 dataviz.js库实现。我在这里创建了一个工作示例：https ://jsfiddle.net/bx9efr4h/1/

这是使它工作的部分代码：

  var chart = new Keen.Dataviz()
    .el('#chart')
    .type("donut")
    .chartOptions({
      donut: {
        label: {
          format: function(value) {
            return value;
          }
        }
      }
    })
    .prepare();

敏锐 js 的工作方式略有不同，因为 c3.js 不是它的默认 dataviz 库。这可能就是为什么它没有像您预期的那样工作。