Keen.io如何使用savedQueries()来绘制图表

时间:2017-06-19 17:08:55

标签: javascript keen-io

我正在尝试使用savedQueries来绘制图形但没有成功。 savedQueries仅用于Keen中的CRUD查询,还是可以实际用于图表图形?从代码中删除了密钥,很抱歉给您带来不便。

var client = new Keen({
  projectId: keen.project,
  writeKey: keen.writeKey,
  readKey: keen.readKey,
  masterKey: keen.masterKey
});
var savedQueries = client.savedQueries();
savedQueries.get("monthly-active-users", function(err, response) {
  if (err) {
    console.log(err);
  }
  console.log(response);
  var chart1 = new Keen.Dataviz()
    .el(document.getElementById('chart'))
    .chartType("area")
    .colors(["#6ab975"])
    .title("Monthly Active Users")
    .prepare();

  chart1
    .data(response)
    .render();

});

来自已保存查询的回复obj

{
  "refresh_rate": 0,
  "user_last_modified_date": "2017-06-09T18:51:59.676000+00:00",
  "last_modified_date": "2017-06-09T18:51:59.676000+00:00",
  "query_name": "monthly-active-users",
  "urls": {
    "cached_query_url": "/3.0/projects/58f6fb8a90b3659264951b8d/queries/saved/monthly-active-users",
    "cached_query_results_url": "/3.0/projects/58f6fb8a90b3659264951b8d/queries/saved/monthly-active-users/result"
  },
  "created_date": "2017-04-25T23:52:45.685000+00:00",
  "query": {
    "filters": [
      {
        "operator": "ne",
        "property_name": "user_id",
        "property_value": "guest"
      },
      {
        "operator": "not_contains",
        "property_name": "fromState",
        "property_value": "app"
      },
      {
        "operator": "not_contains",
        "property_name": "user_email",
        "property_value": "@giblib.com"
      },
      {
        "operator": "not_contains",
        "property_name": "fromState",
        "property_value": "app.auth_postregister"
      }
    ],
    "analysis_type": "count_unique",
    "timezone": "US/Pacific",
    "group_by": null,
    "force_exact": null,
    "timeframe": "this_2_months",
    "target_property": "user_id",
    "interval": "monthly",
    "event_collection": "user-page-access"
  },
  "run_information": null,
  "metadata": {
    "visualization": {
      "chart_type": "areachart"
    },
    "display_name": "Monthly Active Users"
  }
}

1 个答案:

答案 0 :(得分:3)

我注意到您没有包含Keen.ready()功能。另外,我建议使用client.run而不是client.get,因为它会运行查询并获取结果。

我继续创建了一个示例JSFiddle:https://jsfiddle.net/pn14bs0L/2/

Keen.ready(function() {

  client.run("test-saved-query", function(err, response) {
    if (err) {
      // there was an error
    } else {
      var chart1 = new Keen.Dataviz()
        .el(document.getElementById('my_chart'))
        .chartType("areachart")
        .colors(["#6ab975"])
        .title("Monthly Active Users")
        .prepare();

      chart1
        .data(response)
        .render();
    }
  });

});

您可以在JSFiddle中看到这与一些测试数据一起使用。

注意:我假设你在这里使用keen-js而不是keen-dataviz.js。