PubNub EON图表不呈现数据

Question

我正在尝试使用PUBNUB EON图表库渲染样条图.我不明白这里出了什么问题.我可以在控制台中看到数据,但图表没有渲染,只有x和y轴线.我从python SDK获取数据并通过javascript SDK订阅.控制台中没有错误消息.

我的python代码是

def counterVolume(data):
  for each in data:
    y = each.counter_volume
    data_clean = json.dumps(y, indent=4, separators=(',', ': '))
    print pubnub.publish(channel='channel', message= data_clean)


counterVolume(data)

我的订阅javascript函数是

       var data;
       var pubnub = PUBNUB.init({
                                publish_key: 'pub',
                                subscribe_key: 'subf'
                                            });

       var channel = "c3-spline";
                    eon.chart({
                             history: true,
                            channel: 'channel',
                             flow: true,
                               generate: {
                                bindto: '#chart',
                                data: {
                                x: 'x',
                                labels: false
                                        },
                               axis : {
                                  x : {
                                  type : 'timeseries',
                                  tick: {
                                 format: '%m-%d %H:%M:%S'
                                        }
    }
    } }});
    function dataCallback(){
                        pubnub.subscribe({
                                  channel: 'channel',
                                  message: function(m){
                                           data = m
                                           console.log(data)
          }
        });
        };
 dataCallback();
 pubnub.publish({
                     channel: 'orbit_channel',
                     message: {
                            columns: [
                                     ['x', new Date().getTime()],
                                     ['y', data]
              ]
            }
          })

我可以在控制台中看到值,但我不明白为什么它不会在图表上呈现.

python脚本的结果:

89453.0
89453.0
89453.0
89453.0

Answer 1

PubNub EON 自定义流图表数据格式

PubNub EON 需要特定的格式才能在图表上呈现和显示数据。您可以使用transform需要function(){}. 提供的转换函数就像操作的回调一样map，并转换您的数据以匹配所需的 EON 格式。

流图表数据的 PubNub EON 变换方法

使用PubNub Public Streams中的示例流。您可以使用该transform方法将消息格式化为 EON。

EON 流图表数据格式

{ columns : [
    ['x', new Date().getTime()],
    ['Humidity', m.humidity],
    ['Temperature', m.ambient_temperature],
    ['Light', m.photosensor]
] }

流图表数据设置示例

以下是针对 EON 流图表格式化的工作 PubNub 流的示例。使用该transform方法，您的 JavaScript 应如下所示：

<script>
var pubnub = PUBNUB({
    subscribe_key : 'YOUR_SUBSCRIBE_KEY_HERE' // <-- CHANGE!!!
});

eon.chart({
    pubnub   : pubnub,
    history  : false,
    channel  : 'channel', // <-- YOUR CHANNEL
    flow     : true,
    generate : {
        bindto : '#chart',
        data   : {
            x      : 'x',
            labels : true
        },
        axis : {
            x : {
                type : 'timeseries',
                tick : {
                    format : '%Y-%m-%d'
                }
            }
        }
    },
    transform : function(data) {
        return { columns : [
            ['x', new Date().getTime()],
            ['Value', data]
        ] };
    }
});
</script>