summaryrefslogtreecommitdiffstats
path: root/tools/infra-dashboard/js/test_graph.js
diff options
context:
space:
mode:
Diffstat (limited to 'tools/infra-dashboard/js/test_graph.js')
-rw-r--r--tools/infra-dashboard/js/test_graph.js108
1 files changed, 108 insertions, 0 deletions
diff --git a/tools/infra-dashboard/js/test_graph.js b/tools/infra-dashboard/js/test_graph.js
new file mode 100644
index 00000000..1d1d5e43
--- /dev/null
+++ b/tools/infra-dashboard/js/test_graph.js
@@ -0,0 +1,108 @@
+$(function () {
+
+ // Get the CSV and create the chart
+ $.getJSON('https://www.highcharts.com/samples/data/jsonp.php?filename=analytics.csv&callback=?', function (csv) {
+
+ $('#container').highcharts({
+
+ data: {
+ csv: csv
+ },
+
+ title: {
+ text: 'Daily visits at www.highcharts.com'
+ },
+
+ subtitle: {
+ text: 'Source: Google Analytics'
+ },
+
+ xAxis: {
+ tickInterval: 7 * 24 * 3600 * 1000, // one week
+ tickWidth: 0,
+ gridLineWidth: 1,
+ labels: {
+ align: 'left',
+ x: 3,
+ y: -3
+ }
+ },
+
+ yAxis: [{ // left y axis
+ title: {
+ text: null
+ },
+ labels: {
+ align: 'left',
+ x: 3,
+ y: 16,
+ format: '{value:.,0f}'
+ },
+ showFirstLabel: false
+ }, { // right y axis
+ linkedTo: 0,
+ gridLineWidth: 0,
+ opposite: true,
+ title: {
+ text: null
+ },
+ labels: {
+ align: 'right',
+ x: -3,
+ y: 16,
+ format: '{value:.,0f}'
+ },
+ showFirstLabel: false
+ }],
+
+ legend: {
+ align: 'left',
+ verticalAlign: 'top',
+ y: 20,
+ floating: true,
+ borderWidth: 0
+ },
+
+ tooltip: {
+ shared: true,
+ crosshairs: true
+ },
+
+ plotOptions: {
+ series: {
+ cursor: 'pointer',
+ point: {
+ events: {
+ click: function (e) {
+ hs.htmlExpand(null, {
+ pageOrigin: {
+ x: e.pageX || e.clientX,
+ y: e.pageY || e.clientY
+ },
+ headingText: this.series.name,
+ maincontentText: Highcharts.dateFormat('%A, %b %e, %Y', this.x) + ':<br/> ' +
+ this.y + ' visits',
+ width: 200
+ });
+ }
+ }
+ },
+ marker: {
+ lineWidth: 1
+ }
+ }
+ },
+
+ series: [{
+ name: 'All visits',
+ lineWidth: 4,
+ marker: {
+ radius: 4
+ }
+ }, {
+ name: 'New visitors'
+ }]
+ });
+ });
+
+});