Как нарисовать пончик с абсолютными значениями вместо процентов с помощью Keen.io и c3?

Я использую Keen.io («версия»: «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();

Какого цвета ваш соус?


c3.js keen-io
person Will Lovett    schedule 16.07.2017    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Это возможно с помощью библиотеки keen-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();

Kein-js работает немного иначе, потому что c3.js не является для него библиотекой dataviz по умолчанию. Вероятно, поэтому он не работает так, как ожидалось для вас.

person tbarn    schedule 20.07.2017