Как получить заполнение ниже диаграммы таймсетов c3.js

Question

Как получить заполнение ниже диаграммы временных рядов c3.js, например, диаграммы с разбивкой по областям, но значения в оставшихся временных рядах по оси x. Я использую EIN-диаграмму библиотеки PUBNUB, но она использует c3.js в качестве базовой библиотеки.

eon.chart({ 
    pubnub : pubnub, 
    history : false, 
    channel : 'orbit2', 
    flow  : true, 
    generate : { 
     bindto : '#chart', 
     size: { 
     height: 240, 
     width: 380 
    }, 
     data : { 
      x  : 'x', 
      labels : true 
     }, 
     axis : { 
      x : { 
       type : 'timeseries', 
       tick : { 
        format : '%H:%M:%S' 
       }, 
       zoom: { 
        enabled: true 
       } 
      } 
     } 
    }, 
    transform : function(m) { 
     return { columns : [ 
      ['x', new Date().getTime()], 
      ['Bytes Written', m.Bytes_Written], 
      ['Bytes Read', m.Bytes_Read] 

     ] }; 
    } 
}); 

Answer 1

PubNub EON Тип диаграммы

Вам просто нужно указать тип диаграммы для использования. Есть некоторые образцы на EON landing page and here is a code sample from one of the examples on that page:

eon.chart({ 
    channel: channel, 
    pubnub: pubnub, 
    generate: { 
    bindto: '#chart', 
    data: { 
     labels: true, 
     type: 'bar' 
    }, 
    bar: { 
     width: { 
     ratio: 0.5 
     } 
    }, 
    tooltip: { 
     show: false 
    } 
    } 
}); 

Обратите внимание на data ключ, который настраивается под параметром generate EON. See c3 docs/examples для получения более подробной информации об этом.