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

Question

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

假设我有一个名为 orders 的集合：

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

我还有另一个名为 adjustments 的集合：

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

现在我想显示一个条形图，显示“每周总订单价格”和“每周总调整价格”。 x 轴上的周数和 y 轴上的价格。不同颜色的订单和调整价格。

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

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

Answer 1

keen-js 支持将一组查询传递给client.run()，如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 变量（或this.data，如果您愿意）传递给client.run() 的数组顺序相同。数组中第一个查询的结果返回为response[0]，第二个返回为response[1]，以此类推。与this.data 类似，您将使用this.data[0] 和this.data[1]。

示例中显示的图表是折线图，但可以通过chartType 属性轻松配置为显示为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