【问题标题】:Pubnub EON chart rendering multiple data in the chartpubnub EON 图表在图表中渲染多个数据
【发布时间】:2015-07-30 10:13:45
【问题描述】:

我正在按照以下示例使用 pubnub 和 eon 图表发布我的数据。当我只发布一个数据流(即“检查点大小”)时,图表呈现正常,但我输入 data2 即“检查点长度”的那一刻,它给了我错误

未捕获的错误:源数据在 (1,1) 处缺少组件!

我可以在 pubnub 控制台中看到数据,这意味着我正在获取数据流,但它无法呈现到图表中。

var pubnub = PUBNUB({
    subscribe_key : 'YOUR_SUBSCRIBE_KEY_HERE'
});

eon.chart({
    pubnub   : pubnub,
    history  : false,
    channel  : 'orbit_channel',
    flow     : true,
    generate : {
        bindto : '#chart',
        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()],
            ['Checkpoint Size', m.checkpointsize],
            ['Checkpoint length', m.checkpointlength]
        ] };
    }
});

这里是 pubnub 控制台

【问题讨论】:

    标签: pubnub c3


    【解决方案1】:

    使用 PubNub Eon 将两个数据流合并为一个图表

    看起来您正试图在同一张图上绘制两个向量。您可以通过在同一个发布的消息对象中同时传输这些值来做到这一点。我认为您在示例中发布了两次。您的发布消息需要包含两个数据点。这是一个例子

    pubnub.publish({
        "checkpointsize"   : 75.0,
        "checkpointlength" : 5000.0
    })
    

    【讨论】:

    • 感谢这个解决了问题的捆绑包。 Pubnub 的你们很棒。
    • 是否可以更改图表的css?
    • 确实可以。请参考此文档:c3js.org/samples/style_grid.html 并添加样式类,例如 .c3-xgrid-line line { stroke: blue; }
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-02-16
    • 1970-01-01
    • 1970-01-01
    • 2015-09-18
    • 2021-09-19
    相关资源
    最近更新 更多