Piwik-Charts

Javascript based utility to generate charts from PIWIK statistics generated by https://github.com/ufal/lindat_piwik_reports

Use https://ufal.github.io/piwik-charts/ for live examples.

How to use

Dependencies

• jQuery 1.7
• Bootstrap 2
• jqplot

Add following lines to HEAD

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js" type="text/javascript"> </script>
<link media="screen" href="lib/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
<link media="screen" href="lib/bootstrap/css/font-awesome.min.css" rel="stylesheet" />
<link href="lib/jqplot/jquery.jqplot.css" rel="stylesheet" />
<link href="lib/css/jqplot.css" rel="stylesheet" />
<script type="text/javascript" src="lib/bootstrap/js/bootstrap.min.js"> </script>
<script src="lib/jqplot/jquery.jqplot.min.js" type="text/javascript"> </script>
<script src="lib/jqplot/plugins/jqplot.canvasTextRenderer.min.js" type="text/javascript"> </script>
<script src="lib/jqplot/plugins/jqplot.canvasAxisLabelRenderer.min.js" type="text/javascript"> </script>
<script src="lib/jqplot/plugins/jqplot.highlighter.min.js" type="text/javascript"> </script>
<script src="lib/jqplot/plugins/jqplot.cursor.min.js" type="text/javascript"> </script>
<script src="lib/jqplot/plugins/jqplot.dateAxisRenderer.min.js" type="text/javascript"> </script>
<script src="lib/jqplot/plugins/jqplot.enhancedLegendRenderer.js" type="text/javascript"> </script>
<script src="lib/jqplot/plugins/jqplot.barRenderer.min.js" type="text/javascript"> </script>
<script src="lib/moment/moment.min.js" type="text/javascript"> </script>	
<script type="text/javascript" src="js/piwik_charts.js"></script>	

To generate a plot

Add a div with type attribe set to piwikchart and data-url should be the url of the json data from lindat_piwik_reports or from Clarin DSpace piwik reports.

<div type="piwikchart" data-url="https://lindat.mff.cuni.cz/statistics/handle?h=11234/1-2837"></div>

Examples

See the html examples:

Single chart example

Multi chart example