PubNub EON图表不呈现数据

时间:2015-07-21 13:19:13

标签: javascript python charts pubnub

我正在尝试使用PUBNUB EON charting library渲染样条线图。我不明白这里出了什么问题。我可以在控制台中看到数据,但图表没有渲染,只有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]
              ]
            }
          })

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

here is what I see in the browser

python脚本的结果:

89453.0
89453.0
89453.0
89453.0

1 个答案:

答案 0 :(得分:2)

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>