Skip to content

Instantly share code, notes, and snippets.

@wetzler
Last active December 10, 2015 18:58
Show Gist options
  • Save wetzler/4478332 to your computer and use it in GitHub Desktop.
Save wetzler/4478332 to your computer and use it in GitHub Desktop.
Kickfolio's (minified) code to embed Keen IO charts in their user dashboards. They have 3 line charts (last 7 days, last 24 hours, and last 4 weeks) which show the number of user "connect" sessions for a given app (identified by the filter app.PublicKey). For more context, see this blog post: http://blog.keen.io/post/39950174904/kickfolio-uses-k…
Keen.configure(window.ENV.keenProjectId,window.ENV.keenApiKey),
Keen.onChartsReady(function(){
var e=new Keen.Series("connect",{
analysisType:"count",
timeframe:"last_7_days",
interval:"daily"
}),
t=new Keen.Series("connect",{
analysisType:"count",
timeframe:"last_24_hours",
interval:"hourly"
}),
n=new Keen.Series("connect",{
analysisType:"count",
timeframe:"last_4_weeks",
interval:"weekly"
});
e.addFilter("app.publicKey","eq",window.ENV.appPublicKey),
t.addFilter("app.publicKey","eq",window.ENV.appPublicKey),
n.addFilter("app.publicKey","eq",window.ENV.appPublicKey),
lineChart(e,"","Sessions - Last 7 days").draw(document.getElementById("last7Days")),
lineChart(t,"","Sessions - Last 24 hours").draw(document.getElementById("last24Hours")),
lineChart(n,"","Sessions - Last Month").draw(document.getElementById("lastMonth"))
});
var lineChart=function(e,t,n){
var r=new Keen.LineChart(e,{
height:"300px",
width:"760px",
color:"#09BA9A",
lineWidth:6,
xAxisLabelAngle:45,
chartAreaLeft:"4%",
chartAreaWidth:"95%",
label:t,
title:n,
showLegend:!1
});
return r
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment