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

Question

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

通过阅读文档和查看 examples (see "var c3gauge") and example，我认为您可以通过应用 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

这可以通过 keen-dataviz.js library. I've created a working example here: https://jsfiddle.net/bx9efr4h/1/

下面是使它起作用的部分代码：

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

keen-js 的工作方式略有不同，因为 c3.js 不是它的默认 dataviz 库。这可能就是它无法按您预期的方式工作的原因。

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

How do I draw donut with absolute values intead of percents with Keen.io & c3?

keen-io

c3.js