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
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103 | 1×
1×
1×
585×
585×
585×
13×
13×
434×
434×
434×
13×
572×
1×
1×
4×
4×
4×
4×
2×
2×
2×
2×
2×
1×
2×
2×
2×
2×
1×
2×
2×
2×
2×
2×
4×
2×
2×
2×
2×
2×
2×
2×
1×
1×
57×
57×
57×
2×
55×
2×
2×
2×
2×
24×
24×
2×
2×
53×
57×
1×
1×
1×
1×
3×
1×
| define(["require", "exports", "../utils/helper-common", "@syncfusion/ej2-base"], function (require, exports, helper_common_1, ej2_base_1) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
function textTrim(maxWidth, text, font) {
var label = text;
var size = helper_common_1.measureText(text, font).width;
if (size > maxWidth) {
var textLength = text.length;
for (var i = textLength - 1; i >= 0; --i) {
label = text.substring(0, i) + '...';
size = helper_common_1.measureText(label, font).width;
if (size <= maxWidth) {
return label;
}
}
}
return label;
}
exports.textTrim = textTrim;
function showTooltip(text, x, y, gauge, type) {
var tooltipRect = new helper_common_1.Rect(gauge.margin.left, gauge.margin.top + 10, gauge.availableSize.width - (gauge.margin.left + gauge.margin.right), gauge.availableSize.height - (gauge.margin.top - gauge.margin.bottom));
var id;
var tooltip;
if (type === 'Title') {
id = gauge.element.id + '_EJ2_Title_Tooltip';
tooltip = document.getElementById(id);
var width = helper_common_1.measureText(text, {
fontFamily: 'Segoe UI', size: '12px',
fontStyle: 'Normal', fontWeight: 'Regular'
}).width + 5;
tooltipRect.width = width < tooltipRect.width ? width : tooltipRect.width - 10;
if (!tooltip) {
removeTooltip();
}
}
else Eif (type === 'LegendText') {
id = gauge.element.id + '_EJ2_Legend_Tooltip';
tooltip = document.getElementById(id);
if (!tooltip) {
removeTooltip();
}
var width = helper_common_1.measureText(text, {
fontFamily: 'Segoe UI', size: '12px',
fontStyle: 'Normal', fontWeight: 'Regular'
}).width + 5;
x = (x + width > tooltipRect.width) ? x - width : x;
tooltipRect.x = x < 0 ? 5 : x;
tooltipRect.y = y;
tooltipRect.width = width;
}
if (!tooltip) {
tooltip = ej2_base_1.createElement('div', { id: id, className: 'EJ2-CircularGauge-Tooltip' });
tooltip.innerText = text;
tooltip.style.cssText = 'top:' + (tooltipRect.y + 15).toString() + 'px;left:' + (tooltipRect.x).toString() +
'px; background-color: rgb(255, 255, 255) !important; color:black !important; ' +
'position:absolute; border:1px solid rgb(112, 112, 112); padding-left : 3px; padding-right : 2px;' +
'padding-bottom: 2px; padding-top : 2px; font-size:12px; text-align: center; font-family: "Segoe UI"; width:' + (tooltipRect.width) + 'px;';
helper_common_1.getElement(gauge.element.id + '_Secondary_Element').appendChild(tooltip);
}
else {
tooltip.innerText = text;
tooltip.style.top = (tooltipRect.y + 15).toString() + 'px';
tooltip.style.left = (tooltipRect.x).toString() + 'px';
}
}
exports.showTooltip = showTooltip;
function titleTooltip(event, x, y, gauge, isTitleTouch) {
var targetId = event.target.id;
var elementArray = document.getElementsByClassName('EJ2-CircularGauge-Tooltip');
if ((targetId === (gauge.element.id + '_CircularGaugeTitle')) && (event.target.textContent.indexOf('...') > -1)) {
showTooltip(gauge.title, x, y, gauge, 'Title');
}
else if (event.target.textContent.indexOf('...') > -1 && targetId.indexOf('_gauge_legend_') > -1 &&
gauge.legendSettings.visible) {
var axisIndex = parseInt(targetId.split(gauge.element.id + '_gauge_legend_Axis_')[1].split('_text_')[0], 10);
var rangeIndex = parseInt(targetId.split(gauge.element.id + '_gauge_legend_Axis_')[1].split('_text_')[1], 10);
var text = '';
for (var _i = 0, _a = gauge.legendModule.legendCollection; _i < _a.length; _i++) {
var legends = _a[_i];
if (legends.rangeIndex === rangeIndex && legends.axisIndex === axisIndex) {
text = legends.originalText;
}
}
showTooltip(text, x, y, gauge, 'LegendText');
}
else Iif (elementArray.length > 0 && (elementArray[0].id.indexOf('Title_Tooltip') > -1 ||
elementArray[0].id.indexOf('Legend_Tooltip') > -1)) {
removeTooltip();
}
if (isTitleTouch && !ej2_base_1.isNullOrUndefined(this)) {
clearTimeout(this.clearTimeout);
this.clearTimeout = setTimeout(removeTooltip.bind(this), 2000);
}
}
exports.titleTooltip = titleTooltip;
function removeTooltip() {
Iif (document.getElementsByClassName('EJ2-CircularGauge-Tooltip').length > 0) {
document.getElementsByClassName('EJ2-CircularGauge-Tooltip')[0].remove();
}
}
exports.removeTooltip = removeTooltip;
});
|