root / trunk / web / dojo / dojox / widget / AnalogGauge.js
History | View | Annotate | Download (6.87 KB)
1 |
/*
|
---|---|
2 |
Copyright (c) 2004-2010, The Dojo Foundation All Rights Reserved.
|
3 |
Available via Academic Free License >= 2.1 OR the modified BSD license.
|
4 |
see: http://dojotoolkit.org/license for details
|
5 |
*/
|
6 |
|
7 |
|
8 |
if(!dojo._hasResource["dojox.widget.AnalogGauge"]){ |
9 |
dojo._hasResource["dojox.widget.AnalogGauge"]=true; |
10 |
dojo.provide("dojox.widget.AnalogGauge");
|
11 |
dojo.require("dojox.gfx");
|
12 |
dojo.require("dojox.widget.gauge._Gauge");
|
13 |
dojo.experimental("dojox.widget.AnalogGauge");
|
14 |
dojo.declare("dojox.widget.gauge.AnalogLineIndicator",[dojox.widget.gauge._Indicator],{_getShapes:function(){ |
15 |
var _1=[];
|
16 |
_1[0]=this._gauge.surface.createLine({x1:0,y1:-this.offset,x2:0,y2:-this.length-this.offset}).setStroke({color:this.color,width:this.width}); |
17 |
return _1;
|
18 |
},draw:function(_2){ |
19 |
if(this.shapes){ |
20 |
this._move(_2);
|
21 |
}else{
|
22 |
if(this.text){ |
23 |
this._gauge.surface.rawNode.removeChild(this.text); |
24 |
this.text=null; |
25 |
} |
26 |
var v=this.value; |
27 |
if(v<this._gauge.min){ |
28 |
v=this._gauge.min;
|
29 |
} |
30 |
if(v>this._gauge.max){ |
31 |
v=this._gauge.max;
|
32 |
} |
33 |
var a=this._gauge._getAngle(v); |
34 |
this.color=this.color||"#000000"; |
35 |
this.length=this.length||this._gauge.radius; |
36 |
this.width=this.width||1; |
37 |
this.offset=this.offset||0; |
38 |
this.highlight=this.highlight||"#D0D0D0"; |
39 |
this.shapes=this._getShapes(this._gauge,this); |
40 |
if(this.shapes){ |
41 |
for(var s=0;s<this.shapes.length;s++){ |
42 |
this.shapes[s].setTransform([{dx:this._gauge.cx,dy:this._gauge.cy},dojox.gfx.matrix.rotateg(a)]); |
43 |
if(this.hover){ |
44 |
this.shapes[s].getEventSource().setAttribute("hover",this.hover); |
45 |
} |
46 |
if(this.onDragMove&&!this.noChange){ |
47 |
this._gauge.connect(this.shapes[s].getEventSource(),"onmousedown",this._gauge.handleMouseDown); |
48 |
this.shapes[s].getEventSource().style.cursor="pointer"; |
49 |
} |
50 |
} |
51 |
} |
52 |
if(this.label){ |
53 |
var _3=this.length+this.offset; |
54 |
var x=this._gauge.cx+(_3+5)*Math.sin(this._gauge._getRadians(a)); |
55 |
var y=this._gauge.cy-(_3+5)*Math.cos(this._gauge._getRadians(a)); |
56 |
var _4="start"; |
57 |
if(a<=-10){ |
58 |
_4="end";
|
59 |
} |
60 |
if(a>-10&&a<10){ |
61 |
_4="middle";
|
62 |
} |
63 |
var _5="bottom"; |
64 |
if((a<-90)||(a>90)){ |
65 |
_5="top";
|
66 |
} |
67 |
this.text=this._gauge.drawText(""+this.label,x,y,_4,_5,this.color,this.font); |
68 |
} |
69 |
this.currentValue=this.value; |
70 |
} |
71 |
},_move:function(_6){ |
72 |
var v=this.value; |
73 |
if(v<this._gauge.min){ |
74 |
v=this._gauge.min;
|
75 |
} |
76 |
if(v>this._gauge.max){ |
77 |
v=this._gauge.max;
|
78 |
} |
79 |
var c=this.currentValue; |
80 |
if(_6){
|
81 |
var _7=this._gauge._getAngle(v); |
82 |
for(var i in this.shapes){ |
83 |
this.shapes[i].setTransform([{dx:this._gauge.cx,dy:this._gauge.cy},dojox.gfx.matrix.rotateg(_7)]); |
84 |
if(this.hover){ |
85 |
this.shapes[i].getEventSource().setAttribute("hover",this.hover); |
86 |
} |
87 |
} |
88 |
}else{
|
89 |
if(c!=v){
|
90 |
var _8=new dojo.Animation({curve:[c,v],duration:this.duration,easing:this.easing}); |
91 |
dojo.connect(_8,"onAnimate",dojo.hitch(this,function(_9){ |
92 |
for(var i in this.shapes){ |
93 |
this.shapes[i].setTransform([{dx:this._gauge.cx,dy:this._gauge.cy},dojox.gfx.matrix.rotateg(this._gauge._getAngle(_9))]); |
94 |
if(this.hover){ |
95 |
this.shapes[i].getEventSource().setAttribute("hover",this.hover); |
96 |
} |
97 |
} |
98 |
this.currentValue=_9;
|
99 |
})); |
100 |
_8.play(); |
101 |
} |
102 |
} |
103 |
}}); |
104 |
dojo.declare("dojox.widget.AnalogGauge",dojox.widget.gauge._Gauge,{startAngle:-90,endAngle:90,cx:0,cy:0,radius:0,_defaultIndicator:dojox.widget.gauge.AnalogLineIndicator,startup:function(){ |
105 |
if(this.getChildren){ |
106 |
dojo.forEach(this.getChildren(),function(_a){ |
107 |
_a.startup(); |
108 |
}); |
109 |
} |
110 |
this.startAngle=Number(this.startAngle); |
111 |
this.endAngle=Number(this.endAngle); |
112 |
this.cx=Number(this.cx); |
113 |
if(!this.cx){ |
114 |
this.cx=this.width/2; |
115 |
} |
116 |
this.cy=Number(this.cy); |
117 |
if(!this.cy){ |
118 |
this.cy=this.height/2; |
119 |
} |
120 |
this.radius=Number(this.radius); |
121 |
if(!this.radius){ |
122 |
this.radius=Math.min(this.cx,this.cy)-25; |
123 |
} |
124 |
this._oppositeMiddle=(this.startAngle+this.endAngle)/2+180; |
125 |
this.inherited(arguments); |
126 |
},_getAngle:function(_b){ |
127 |
return (_b-this.min)/(this.max-this.min)*(this.endAngle-this.startAngle)+this.startAngle; |
128 |
},_getValueForAngle:function(_c){ |
129 |
if(_c>this._oppositeMiddle){ |
130 |
_c-=360;
|
131 |
} |
132 |
return (_c-this.startAngle)*(this.max-this.min)/(this.endAngle-this.startAngle)+this.min; |
133 |
},_getRadians:function(_d){ |
134 |
return _d*Math.PI/180; |
135 |
},_getDegrees:function(_e){ |
136 |
return _e*180/Math.PI; |
137 |
},draw:function(){ |
138 |
var i;
|
139 |
if(this._rangeData){ |
140 |
for(i=0;i<this._rangeData.length;i++){ |
141 |
this.drawRange(this._rangeData[i]); |
142 |
} |
143 |
if(this._img&&this.image.overlay){ |
144 |
this._img.moveToFront();
|
145 |
} |
146 |
} |
147 |
if(this._indicatorData){ |
148 |
for(i=0;i<this._indicatorData.length;i++){ |
149 |
this._indicatorData[i].draw();
|
150 |
} |
151 |
} |
152 |
},drawRange:function(_f){ |
153 |
var _10;
|
154 |
if(_f.shape){
|
155 |
this.surface.remove(_f.shape);
|
156 |
_f.shape=null;
|
157 |
} |
158 |
var a1;
|
159 |
var a2;
|
160 |
if((_f.low==this.min)&&(_f.high==this.max)&&((this.endAngle-this.startAngle)==360)){ |
161 |
_10=this.surface.createCircle({cx:this.cx,cy:this.cy,r:this.radius}); |
162 |
}else{
|
163 |
a1=this._getRadians(this._getAngle(_f.low)); |
164 |
a2=this._getRadians(this._getAngle(_f.high)); |
165 |
var x1=this.cx+this.radius*Math.sin(a1); |
166 |
var y1=this.cy-this.radius*Math.cos(a1); |
167 |
var x2=this.cx+this.radius*Math.sin(a2); |
168 |
var y2=this.cy-this.radius*Math.cos(a2); |
169 |
var big=0; |
170 |
if((a2-a1)>Math.PI){
|
171 |
big=1;
|
172 |
} |
173 |
_10=this.surface.createPath();
|
174 |
if(_f.size){
|
175 |
_10.moveTo(this.cx+(this.radius-_f.size)*Math.sin(a1),this.cy-(this.radius-_f.size)*Math.cos(a1)); |
176 |
}else{
|
177 |
_10.moveTo(this.cx,this.cy); |
178 |
} |
179 |
_10.lineTo(x1,y1); |
180 |
_10.arcTo(this.radius,this.radius,0,big,1,x2,y2); |
181 |
if(_f.size){
|
182 |
_10.lineTo(this.cx+(this.radius-_f.size)*Math.sin(a2),this.cy-(this.radius-_f.size)*Math.cos(a2)); |
183 |
_10.arcTo((this.radius-_f.size),(this.radius-_f.size),0,big,0,this.cx+(this.radius-_f.size)*Math.sin(a1),this.cy-(this.radius-_f.size)*Math.cos(a1)); |
184 |
} |
185 |
_10.closePath(); |
186 |
} |
187 |
if(dojo.isArray(_f.color)||dojo.isString(_f.color)){
|
188 |
_10.setStroke({color:_f.color});
|
189 |
_10.setFill(_f.color); |
190 |
}else{
|
191 |
if(_f.color.type){
|
192 |
a1=this._getRadians(this._getAngle(_f.low)); |
193 |
a2=this._getRadians(this._getAngle(_f.high)); |
194 |
_f.color.x1=this.cx+(this.radius*Math.sin(a1))/2; |
195 |
_f.color.x2=this.cx+(this.radius*Math.sin(a2))/2; |
196 |
_f.color.y1=this.cy-(this.radius*Math.cos(a1))/2; |
197 |
_f.color.y2=this.cy-(this.radius*Math.cos(a2))/2; |
198 |
_10.setFill(_f.color); |
199 |
_10.setStroke({color:_f.color.colors[0].color}); |
200 |
}else{
|
201 |
_10.setStroke({color:"green"}); |
202 |
_10.setFill("green");
|
203 |
_10.getEventSource().setAttribute("class",_f.color.style);
|
204 |
} |
205 |
} |
206 |
if(_f.hover){
|
207 |
_10.getEventSource().setAttribute("hover",_f.hover);
|
208 |
} |
209 |
_f.shape=_10; |
210 |
},getRangeUnderMouse:function(_11){ |
211 |
var _12=null; |
212 |
var pos=dojo.coords(this.gaugeContent); |
213 |
var x=_11.clientX-pos.x;
|
214 |
var y=_11.clientY-pos.y;
|
215 |
var r=Math.sqrt((y-this.cy)*(y-this.cy)+(x-this.cx)*(x-this.cx)); |
216 |
if(r<this.radius){ |
217 |
var _13=this._getDegrees(Math.atan2(y-this.cy,x-this.cx)+Math.PI/2); |
218 |
var _14=this._getValueForAngle(_13); |
219 |
if(this._rangeData){ |
220 |
for(var i=0;(i<this._rangeData.length)&&!_12;i++){ |
221 |
if((Number(this._rangeData[i].low)<=_14)&&(Number(this._rangeData[i].high)>=_14)){ |
222 |
_12=this._rangeData[i];
|
223 |
} |
224 |
} |
225 |
} |
226 |
} |
227 |
return _12;
|
228 |
},_dragIndicator:function(_15,_16){ |
229 |
var pos=dojo.coords(_15.gaugeContent);
|
230 |
var x=_16.clientX-pos.x;
|
231 |
var y=_16.clientY-pos.y;
|
232 |
var _17=_15._getDegrees(Math.atan2(y-_15.cy,x-_15.cx)+Math.PI/2); |
233 |
var _18=_15._getValueForAngle(_17);
|
234 |
if(_18<_15.min){
|
235 |
_18=_15.min; |
236 |
} |
237 |
if(_18>_15.max){
|
238 |
_18=_15.max; |
239 |
} |
240 |
_15._drag.value=_18; |
241 |
_15._drag.currentValue=_18; |
242 |
_15._drag.onDragMove(_15._drag); |
243 |
_15._drag.draw(true);
|
244 |
dojo.stopEvent(_16); |
245 |
}}); |
246 |
} |