ChartChartMapEONEON Chart Configuration API Reference for Realtime Apps

eon.chart instance is storage for user-provided information which describe further PubNub client behaviour. Configuration instance contain additional set of properties which allow to perform precise PubNub client configuration.
To create configuration instance you can use the following function in the EON Chart SDK:
  1. ParameterTypeRequiredDefaultsDescription
    channelsArrayOptionalfalseAn array of PubNub channels to subscribe to. Either channels or channelGroups must be supplied.
    channelGroupsArrayOptionalfalseAn array of PubNub channel groups to subscribe to. Either channels or channelGroups must be supplied.
    generateundefinedYour C3 chart generation config.
    flowfalseUsed to update spline charts over time series.
    limit10The size of your buffer. How many values to display on the chart before shifting the first value off and appending a new value. This is not native to C3.
    rate1000Interval at which new datapoints are drawn on the chart in milliseconds.
    historyfalseFill the buffer by using PubNub history call to retrieve last limit messages. Requires PubNub storage to be enabled.
    xTypeautoYour x axis configuration. Can be auto, custom, category, or false. Read more about xType below.
    xIdxYour x axis source if xType == "custom"
    messagefunction(message, env, channel){}A function to call everytime a PubNub message is recieved. See PubNub subscribe
    transformfunction(m){return m}Method for changing the payload format of your stream. See example
    connectfunction(){}A function to call when PubNub makes a connection. See PubNub subscribe
    pubnubInstanceYesfalseAn instance of the PubNub javascript global. This is required when using your own keys.
    debugfalseLog EON events to console as they happen
eon.chart({
    pubnub: pubnub,
    channels: ["c3-spline"], // the pubnub channel for real time data
    generate: {           // c3 chart object
        bindto: '#chart'
    },
});

eon-chart will automatically use the PubNub message timestamp for chart x values. This timestamp is recorded when a message is published to the PubNub data stream network. This is the case when xType is set to "auto".

If you'd like to supply your own Javascript timestamp, set xType to custom. Then, set xId to the x value that appears within your published messages. Any custom x must be a microtime date like 1465417017340.

let pubnub = new PubNub({
    publishKey:   'demo', // replace with your own pub-key
    subscribeKey: 'demo' // replace with your own sub-key
});

eon.chart({
    pubnub: pubnub,
    channels: ["c3-spline"], // the pubnub channel for real time data
    generate: {           // c3 chart object
        bindto: '#chart'
    },
    xType: 'custom',
    xId: 'x'
});