This repository has been archived by the owner on May 4, 2019. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 123
Home
Adil edited this page Oct 30, 2013
·
58 revisions
- You have some list-of-items (mails, digital collections, news, …) that you want to easily get an overview of?
- Filtering options that feels intuitive, and gives you the right power when needed?
- Don’t have much screen space for the box, and want to scale easily without losing control?
- Simple API to manage it all.
Keshif is here to help you.
Here is a sample code that creates a keshif widget from a google spreadsheet.
kshf.init({
chartTitle: "5 Years of Infosthetics",
domID : "#chart_div4",
itemName : "posts",
categoryTextWidth:186,
source : {
gdocId : '0Ai6LdDWgaqgNdFhuMXh0V1E2Wk5tU19JaDltUWVMVnc',
sheets : [ {name:"Posts"} ]
},
loadedCb: function(){
postCols = kshf.dt_ColNames.Posts;
kshf.cellToArray(kshf.dt.Posts, [postCols.categories], ",", false);
},
charts: [ // 2 facets, the first one also describing time chart
{ facetTitle: "Category",
timeTitle: "Date",
timeItemMap : function(post){ return post.data[postCols['DateTime']]; }
},{
facetTitle: "Author",
catDispCountFix: 6,
textFilter: 'by', textGroup: 'authors'
}
],
sortOpts:{
columns : [
{ name: 'Date',
width: 45,
value: function(d){ return d.data[postCols.date].getUTCFullYear(); },
value_type : 'number'
}
],
textSearch : function (d) { return d.data[postCols.title]; },
textSearchTitle : "post title",
contentFunc : function(d) {
// return an html string which you can generate from the data parameter, d
}
}
});
- Insert kshf.init(params) function in a page load callback using an object with parameters defined here.
- You need to include javascript files for jquery, d3 and keshif. You can insert the following scripts to your page, if you want to use current keshif distribution structure. Your file locations and names may vary.
<script type="text/javascript" src="./jquery/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="./d3.v3/d3.v3.js" charset="utf-8"></script>
<script type="text/javascript" src="./keshif.js" charset="utf-8"></script>
- Insert the following style sheets to your page head section:
<link rel="stylesheet" type="text/css" href="./keshif.css"/>
Main Parameters
Data Source Parameters
Facet Parameters
Link Parameters
Notes
- World Country Flags – 193 items
- Nobel Prize Winners – 863 items
- Ben Bederson’s publications – 144 items
- Accidents – Road Safety 2012 – UK – 3939 items
- Petroleum Spills – 366 items
- Product – Tablet Computers on Amazon – 573 items
- Teaching Assistant Evaluations – 151 items
- UMD HCIL Lab publications – 711 items
- 112th Senate Roll – 486 items
- Transactions In Major League Baseball – 4022 items
- Zoo – Some Animal List
- Reuters 1987 News Dataset – 21578 items
- Marvin Minsky’s publications – 248 items
Mehmet Adil Yalcin @ HCIL, University of Maryland, College Park
Funded in part by Huawei.
Mehmet Adil Yalcin - HCIL - University of Maryland, College Park