如何为单个图形调用多个 Keen IO 集合？

Question

我可以为单个可视化图调用多个 Keen IO 集合吗？

假设我有一个名为 orders:

的集合

{
  "order_number": "dfdfd2323",
  "order_price": 21.00,
}

我还有另一个集合 adjustments:

{
  "adjustment_id": "34ss3432",
  "adjustment_price": 2.00,
}

现在我想显示一个显示 "total order price for every week" 和 "total adjustment price for every week" 的条形图。 x 轴为周数，y 轴为价格。不同颜色的订单和调整价格。

我可以像这样对 Keen IO 进行嵌套调用吗？

client.run(query1, function(){
.....
   client.run(query2, function(){
   }
}

Answer 1

keen-js supports passing an array of queries to client.run() as outlined in this example。您的设置可能类似于：

var orders = new Keen.Query("sum", {
  eventCollection: "orders",
  targetProperty: "order_price",
  interval: "weekly",
  timeframe: "this_month"
});

var adjustments = new Keen.Query("sum", {
  eventCollection: "adjustments",
  targetProperty: "adjustment_price",
  interval: "weekly",
  timeframe: "this_month"
});

client.run([orderTotals,priceAdjustments],function(response) {
  var orderTotals = response[0].result;
  var adjustmentTotals = response[1].result;

  // code that draws the chart
}

诀窍是理解查询结果在数组中返回的顺序与通过 response 变量传递给 client.run() 的数组的顺序相同（或 this.data 如果你比较喜欢）。数组中第一个查询的结果返回为 response[0]，第二个返回为 response[1]，依此类推。与 this.data 类似，您将使用 this.data[0] 和 this.data[1].

示例中显示的图表是折线图，但可以通过 chartType 属性.[=23= 轻松配置为显示为 bar chart ]

Answer 2

我认为分享一个代码示例可能也会有所帮助，该代码示例会产生可视化效果，它结合了来自两个集合的查询，如下所示：

// use a variable to ensure timeframe & interval for both queries match
var interval = "daily"
var timeframe = "last_30_days"

var pageviews = new Keen.Query("count", { // first query
    eventCollection: "pageviews",
    interval: interval,
    timeframe: timeframe
});

var uniqueVisitors = new Keen.Query("count_unique", { // second query
    eventCollection: "pageviews",
    targetProperty: "uuid",
    interval: interval,
    timeframe: timeframe
});

var chart = Keen.Dataviz()
  .chartType("linechart")
  .chartOptions({
    hAxis: {
      format:'MMM d',
      gridlines:  {count: 12}
    }
  })
  .prepare();

client.run([pageviews, uniqueVisitors], function(response){ // run the queries

    var result1 = response[0].result  // data from first query
    var result2 = response[1].result  // data from second query
    var data = []  // place for combined results
    var i=0

    while (i < result1.length) {

        data[i]={ // format the data so it can be charted
            timeframe: result1[i]["timeframe"],
            value: [
                { category: "Pageviews", result: result1[i]["value"] },
                { category: "Visitors", result: result2[i]["value"] }
            ]
        }
        if (i == result1.length-1) { // chart the data
      chart
        .parseRawData({ result: data })
        .render();
        }
        i++;
    }
});

您可以在此处查看图表图片：https://github.com/keen/keen-js/blob/master/docs/visualization.md#combine-two-line-charts

如何为单个图形调用多个 Keen IO 集合？

How to call multiple collections of Keen IO for a single graph?

javascript

keen-io