1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
|
/**
* Piwik - free/libre analytics platform
*
* DataTable UI class for JqplotGraph/Bar.
*
* @link http://www.jqplot.com
* @link http://piwik.org
* @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
*/
(function ($, require) {
var exports = require('piwik/UI'),
JqplotGraphDataTable = exports.JqplotGraphDataTable;
exports.JqplotBarGraphDataTable = function (element) {
JqplotGraphDataTable.call(this, element);
};
$.extend(exports.JqplotBarGraphDataTable.prototype, JqplotGraphDataTable.prototype, {
_setJqplotParameters: function (params) {
JqplotGraphDataTable.prototype._setJqplotParameters.call(this, params);
this.jqplotParams.seriesDefaults = {
renderer: $.jqplot.BarRenderer,
rendererOptions: {
shadowOffset: 1,
shadowDepth: 2,
shadowAlpha: .2,
fillToZero: true,
barMargin: this.data[0].length > 10 ? 2 : 10
}
};
this.jqplotParams.piwikTicks = {
showTicks: true,
showGrid: false,
showHighlight: false,
tickColor: this.tickColor
};
this.jqplotParams.axes.xaxis.renderer = $.jqplot.CategoryAxisRenderer;
this.jqplotParams.axes.xaxis.tickOptions = {
showGridline: false
};
this.jqplotParams.canvasLegend = {
show: true
};
},
_bindEvents: function () {
this.setYTicks();
JqplotGraphDataTable.prototype._bindEvents.call(this);
},
_showDataPointTooltip: function (element, seriesIndex, valueIndex) {
var value = this.formatY(this.data[seriesIndex][valueIndex], seriesIndex);
var series = this.jqplotParams.series[seriesIndex].label;
var percentage = '';
if (typeof this.tooltip.percentages != 'undefined') {
percentage = this.tooltip.percentages[seriesIndex][valueIndex];
percentage = ' (' + NumberFormatter.formatPercent(percentage) + ')';
}
var label = this.jqplotParams.axes.xaxis.labels[valueIndex];
var text = '<strong>' + value + '</strong> ' + series + percentage;
$(element).tooltip({
track: true,
items: '*',
content: '<h3>' + label + '</h3>' + text,
show: false,
hide: false
}).trigger('mouseover');
}
});
})(jQuery, require);
|
