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
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
|
//>>built
define("dojox/gauges/GlossyHorizontalGaugeMarker", ["dojo/_base/declare","dojo/_base/Color","./BarLineIndicator"],
function(declare, Color, BarLineIndicator) {
/*=====
BarLineIndicator = dojox.gauges.BarLineIndicator;
=====*/
return declare("dojox.gauges.GlossyHorizontalGaugeMarker", [BarLineIndicator], {
// summary:
// The marker for the dojox.gauges.GlossyHorizontalGauge.
//
// description:
// This object defines the marker for the dojox.gauges.GlossyHorizontalGauge.
// Since the needle is created by the gauges class, you do not have to use this class directly.
// interactionMode : String
// The interactionMode can have two values : "indicator" (the default) or "gauge".
// When the value is "indicator", the user must click on the indicator to change the value.
// When the value is "gauge", the user can click on the gauge to change the indicator value.
// If a gauge contains several indicators with the indicatorMode property set to "gauge", then
// only the first indicator will be moved when clicking the gauge.
interactionMode: "gauge",
// color: String
// The color of the indicator.
color: 'black',
_getShapes: function(group){
// summary:
// Overrides BarLineIndicator._getShapes
if (!this._gauge){
return null;
}
var v = this.value;
if (v < this._gauge.min){
v = this._gauge.min;
}
if (v > this._gauge.max){
v = this._gauge.max;
}
var pos = this._gauge._getPosition(v);
var shapes = [];
var color = new Color(this.color);
color.a = .67;
var lighterColor = Color.blendColors(color, new Color('white'), 0.4);
var top = shapes[0] = group.createGroup();
var scale = this._gauge.height / 100;
scale = Math.max(scale, .5);
scale = Math.min(scale, 1);
top.setTransform({
xx: 1,
xy: 0,
yx: 0,
yy: 1,
dx: pos,
dy: 0
});
var marker = top.createGroup().setTransform({
xx: 1,
xy: 0,
yx: 0,
yy: 1,
dx: -scale * 10,
dy: this._gauge.dataY + this.offset
});
var rescale = marker.createGroup().setTransform({
xx: scale,
xy: 0,
yx: 0,
yy: scale,
dx: 0,
dy: 0
});
rescale.createRect({
x: .5,
y: .0,
width: 20,
height: 47,
r: 6
}).setFill(color).setStroke(lighterColor);
rescale.createPath({
path: 'M 10.106 41 L 10.106 6 C 10.106 2.687 7.419 0 4.106 0 L 0.372 0 C -0.738 6.567 1.022 15.113 1.022 23.917 C 1.022 32.721 2.022 40.667 0.372 47 L 4.106 47 C 7.419 47 10.106 44.314 10.106 41 Z'
}).setFill(lighterColor).setTransform({
xx: 1,
xy: 0,
yx: 0,
yy: 1,
dx: 10.306,
dy: 0.009
});
rescale.createRect({
x: 9.5,
y: 1.5,
width: 2,
height: 34,
r: 0.833717
}).setFill(color).setStroke(this.color);
rescale.createRect({
x: 9,
y: 0,
width: 3,
height: 34,
r: 6
}).setFill({
type: "linear",
x1: 9,
y1: 0,
x2: 9,
y2: 34,
colors: [{
offset: 0,
color: 'white'
}, {
offset: 1,
color: this.color
}]
});
return shapes;
}
});
});
|
