|
|
楼主 |
发表于 2011-8-25 02:17
|
显示全部楼层
本帖最后由 divilis 于 2011-8-26 01:11 编辑 # e( |! X. p0 h+ _* a$ B4 J
3 `7 a! w1 m9 ^- {* K
拖动地图的实现方式及代码.; H( [2 N1 v$ b6 o6 q
P5 i3 U" F) r, x Z9 o3 @3 @6 P7 e1 [2 W) |
' F3 u3 j/ t9 t- L
- divilis@DIVILIS-GentooLinux /mnt/1T2 $ diff -Naur ./mapsbody-assistant_v1.2.6.js ./mapsbody-assistant_v1.2.7.js 3 _( k# V: _. k- T7 J B. m. ^$ A
- --- ./mapsbody-assistant_v1.2.6.js 2011-08-23 04:24:13.000000000 +0800$ F# X' c0 b5 y0 `! g
- +++ ./mapsbody-assistant_v1.2.7.js 2011-08-25 01:29:56.000000000 +0800
! h- A f# K5 f0 p - @@ -47,7 +47,7 @@
5 _7 X; R) c2 f - { visable: true} ,* m) t/ \. s$ ~8 j$ p. C: q
- { items: [
) E" c3 B- H$ I" E" |& ?5 E) |. s& f - { icon : "search" , command : 'enterKeyword'},
+ J( [) y1 `; o! @7 Q, ?4 X - - { label : "Me", command : 'panTome' }) t4 x+ Y* D" k5 u, S
- + { label : "M", command : 'panTome' }
' g3 K i. g& ^' m7 e$ w- y - ]}+ D+ G5 r4 B& a0 E9 q
- ]
' g8 }$ n+ q$ M$ Q* G - };
' z7 D: U+ O7 s - @@ -116,13 +116,21 @@5 ?: `$ t9 i6 J9 F
- this.handleGestureEnd.bindAsEventListener(this)
. G7 Q: `/ Q7 `/ E( P" [8 | - );! `2 J! k& X, C: Z# y
- ) f5 B$ G( D* B& B6 T
- + // I want to handle the Drag event.
0 ?4 t3 g) Y- T* }9 ^5 U! z - this.controller.listen() E3 ~5 ?5 ^2 m# C z
- - this.controller.get("infopad"),+ }: E1 x. J; W# c
- - Mojo.Event.tap,
! Z) \- u# h; h& w; P' ~ - - function(event){( s( n: n9 U; o( p; K
- - if (event.count == 3)
- ]! m8 {9 b6 v) F( H3 N- C - - this.controller.get("infopad").style.display = "none";
# u% z7 T& j8 ]) b. H - - }.bindAsEventListener(this)
3 c) i9 Q5 J. i3 o- S* g) U - + this.controller.document,
- v) |0 B6 J$ P# h - + Mojo.Event.dragging,
! Q( O( y% P* o8 G ?) W - + this.handleDragingMap.bindAsEventListener(this)
8 S4 V7 d! U6 f# l - + );0 N0 K5 [; W, p. d
- + this.controller.listen(+ [8 A& L; Z2 g" B1 D) I% e
- + this.controller.document,
% @) h4 ]. ^/ O% w d" g8 s6 O2 | - + Mojo.Event.dragStart, s9 ^8 i2 D R- Y' {0 G# B6 j
- + this.handleDragMapStart.bindAsEventListener(this)
' g2 E: p6 ~. j7 @5 B - + );$ q6 z3 }9 \- W7 O
- + this.controller.listen(4 b& A) B" d; W* W" b9 {
- + this.controller.document,
7 F' j. ? L' S* E& Q, |6 W- G2 b - + Mojo.Event.dragEnd,
7 F6 A+ T! R; Z: P/ I+ D - + this.handleDragMapEnd.bindAsEventListener(this)4 K/ z5 O$ k! E7 Y* p
- );
# n! M+ P7 T. K1 ^ - + g; k" k2 ~2 K& \
- // Pan to where you tap.
4 R6 g( i- s! g* B7 U - @@ -172,6 +180,9 @@5 ^$ j- k m: t" J9 }+ Y
- // - GAFC -& _, f* L2 B: K
- this.LAT = (25.213604 + this.offset_lat).toFixed(6); // 22.698998 -shuitian lat-+ v E6 D3 L% ?9 N8 l; Y" S/ @3 `
- this.LON = (110.285375 + this.offset_lon).toFixed(6); // 113.961740 -shuitian lng-3 |4 v7 x3 q4 C
- +
# h @- } y9 c8 Q8 [, { - + this.dragStartCentX = this.dragStartCentY = 0;; V, Q) u) U( H5 |8 i d9 r" r+ l+ S! w
- + this.initDragX = this.initDragY =0;
9 M# D8 C' ], g7 b -
5 X/ {, N# @, \" V/ }* I - // the cache point of your last location & zoom level
8 A5 J( W* ]( {. N% ]7 o4 `0 W8 K - this.cachePointCookie = new Mojo.Model.Cookie("cachePoint");' `, k7 n/ O1 i& H, T! \: T
- @@ -656,33 +667,68 @@
6 E2 q/ R5 a9 l8 d" C9 _5 g6 k6 w - handleGestureStart : function(evnet) {1 F' `: V/ T, ~/ j4 R$ E
- // Stop listen while we zoom in/out the map., |: d5 }$ f8 f: h' v$ U8 F: M
- this.controller.stopListening(this.controller.document, Mojo.Event.tap, this.handleTap);
( K6 K3 T k) |: u - + this.controller.stopListening(this.controller.document, Mojo.Event.dragging, this.handleDragingMap.bindAsEventListener(this));% r7 N0 j- \$ o J: }& }
- + this.controller.listen(this.controller.document, Mojo.Event.dragStart, this.handleDragMapStart.bindAsEventListener(this)); ]& {7 V/ S: X+ h) g2 L
- + this.controller.listen(this.controller.document, Mojo.Event.dragEnd, this.handleDragMapEnd.bindAsEventListener(this));
9 Y9 N/ n% W3 y - this.controller.get("cross").innerHTML= "+ <font size=-2>" + this.zoomLv + "</font>";5 {0 [& \. G3 X
- },
' {& ^3 k7 s# ~" m- ? -
4 t0 {; ~0 \3 a/ n: k# L" Y - handleGestureChange : function(evnet) {
: ?" x7 n4 x% V/ o* g& o - - this.controller.get("cross").innerHTML= "+ <font size=-2>" + Math.round(this.zoomLv*evnet.scale) + "</font>";
, y" q. W( r' l- @( `3 U: H$ q5 G1 ^ - + this.controller.get("cross").innerHTML= "+ <font size=-2>" + Math.round(this.zoomLv * evnet.scale) + "</font>";- }- {1 d [8 n' w5 q% @4 d7 j1 Z/ K
- },& M" M" }. K1 R0 C! H
-
6 U& f6 G$ Z% J( q9 U - handleGestureEnd : function(evnet) {
- ~8 t |% {8 ?& h6 \3 m$ z9 L - - this.zoomLv = Math.round(this.zoomLv * evnet.scale);2 N5 _' S, a' c- x" d" g
- - if (this.zoomLv >= 18) this.zoomLv = 18;
; X+ `7 D/ m) F3 U2 r - - if (this.zoomLv <= 1) this.zoomLv = 1;
# T( L9 o1 Q( Z - - this.map.setZoom(this.zoomLv);9 P2 F8 ~2 e0 e, K; e" p# M
- + if (event.scale != 1){7 o: |! f. ^* Q1 z7 ?8 e
- + // If scale has been changed, zoom to a level that you want., K( X( @* P) ~% C$ a. v
- + this.zoomLv = Math.round(this.zoomLv * evnet.scale);, I. i7 c" T# R) M
- + if (this.zoomLv >= 18) this.zoomLv = 18;
2 o, d$ x9 w# v! ?7 ?. n; n - + if (this.zoomLv <= 1) this.zoomLv = 1;! K4 P3 n+ S3 h% L
- + if (! this.isTracking){) K# N8 z# g/ P2 ~% m
- + delete this.point;' p0 v5 C8 _0 I2 k6 i% M! M
- + this.point = this.map.pixelToPoint(new BMap.Pixel(event.centerX, event.centerY));
: u' c' W: ~' z. S5 g1 | - + // Tell our global VARs the map has been changed.9 q; m& U' Q+ b
- + this.offsetX = this.offsetX + (this.point.lat - this.LAT);5 Y/ j. ~0 k. G4 n
- + this.offsetY = this.offsetY + (this.point.lng - this.LON);
2 J( \$ G. j2 l9 p1 O% J! H - + this.LAT = this.point.lat;$ {+ P K8 @5 u' o8 I1 R/ f4 _7 q
- + this.LON = this.point.lng;
2 T$ I$ U3 k0 _3 g7 m+ u - + this.map.centerAndZoom(this.point, this.zoomLv);
" _0 W7 E1 f! n5 K - + } else {4 `& s- @& @& J' `- r
- + this.map.setZoom(this.zoomLv);" k: |8 l2 f* t7 L
- + }4 E4 y, {+ t: h/ E
- + } else {# R+ J5 f. B) G
- + // Zoom out if you tap screen with tow fingers at the same time.
% H1 Q/ U/ c. t* Y) ~8 D$ d& f - + this.zoomLv -= 1; K3 L G; y0 L# t; k! k
- + if (! this.isTracking){# d1 |- x; c/ j Y! }4 b
- + delete this.point;
m( A! L, z: F2 G' w, y5 K - + this.point = this.map.pixelToPoint(new BMap.Pixel(event.centerX, event.centerY));
4 n8 m8 q) s1 M2 d" A, F; g - + // Tell our global VARs the map has been changed.* N4 |; |( g( @4 U# x# ?% ]
- + this.offsetX = this.offsetX + (this.point.lat - this.LAT); A9 f( @7 n# |! a5 n2 R
- + this.offsetY = this.offsetY + (this.point.lng - this.LON);
9 o' h/ _% u4 [8 V - + this.LAT = this.point.lat;
" ]2 P( S* R6 G3 u2 S - + this.LON = this.point.lng; L) l( _6 _5 s8 ]9 N# @
- + this.map.centerAndZoom(this.point, this.zoomLv);
0 b/ X% q% r4 Z& [# \ - + } else {
, K1 t6 N3 q) n: g( J, j7 O - + this.map.setZoom(this.zoomLv);' M/ L/ }1 ~% c" w- A; ?5 O
- + }, E6 c- O* Q7 c0 O% ^
- + }! u' m& B; Y& ]- c
- this.controller.get("cross").innerHTML= "+ <font size=-2>" + this.zoomLv + "</font>";7 h/ \: O9 l0 m. P6 n' T) X4 u
- setTimeout(
; B" E6 j3 _* _9 p0 W. |7 K - function(){7 b6 \$ b" V9 y3 y0 u# B+ K
- this.controller.get("cross").innerHTML= "+";1 o. S% f. J/ ~3 Z7 f) [
- },, a U- R0 n3 j1 z# X) w7 F! Y
- 2000);- K2 b3 _: [0 I2 o
- -
y+ o+ W+ R2 k/ b6 e, ^/ Y" j - // Relisten when zoom in/out ends.: Z& O% y+ q& E" {; w0 Y0 Q {
- this.controller.listen(this.controller.document, Mojo.Event.tap, this.handleTap.bindAsEventListener(this));3 z( w$ ^& K5 Y. z' w; j
- + this.controller.listen(this.controller.document, Mojo.Event.dragging, this.handleDragingMap.bindAsEventListener(this));+ o3 e+ N1 A5 ]/ M
- + this.controller.listen(this.controller.document, Mojo.Event.dragStart, this.handleDragMapStart.bindAsEventListener(this));; C! e/ J$ w! D5 X0 p0 A
- + this.controller.listen(this.controller.document, Mojo.Event.dragEnd, this.handleDragMapEnd.bindAsEventListener(this));
% i: g* Q. _1 k5 A0 {4 t- e2 H: b - },- l. H, c6 `8 T& s- v: L6 q; v
-
I2 M, V, f: S7 O - handleTap : function(evnet) {' L! r a2 i( w5 H I9 V- Z. ^. n, P3 }
- if (event.count == 2){5 B9 I% p( e: @( h
- // Stop tracking, and pan to where you tap.6 F6 V" {) s* N; r$ h3 [! O2 o
- this.stopTracking();% P4 q$ u. H. G# z# ^' _) n
- + delete this.point;
6 U( Z3 }/ d) `6 } m - this.point = this.map.pixelToPoint(new BMap.Pixel(event.down.x, event.down.y));: g- e# j( _3 z: Q# ~' _
-
) i% Y! R* p" k% s8 {4 \7 V9 G - // Tell our global VARs the map has been changed.
2 I$ {1 J( j; v! Z; r& _8 p: d - @@ -690,10 +736,8 @@
4 G N5 T8 O5 j - this.offsetY = this.offsetY + (this.point.lng - this.LON);1 O5 U1 u; I3 P! G
- this.LAT = this.point.lat;6 `9 f7 h, v& ?5 n9 v6 H8 U+ X# j
- this.LON = this.point.lng;
$ w" y; x2 v: U. | - - this.map.panTo(this.point);) t$ K7 A N; c) O3 z( [
- - Mojo.Log.info("this.zoomLv>>>>>>>>"+this.zoomLv);5 {* X- j9 M5 A' d: k+ A
- - Mojo.Log.info("PanTo>>>>>>>>"+this.LON+","+this.LAT);$ H3 P' A# R; d+ {& N$ a: J
- - Mojo.Log.info("offsetXY>>>>>>>>"+this.offsetX+","+this.offsetY);
\3 s8 V" ]* F4 h - + this.zoomLv +=1;+ h2 D0 r$ Z5 l6 y# [4 `
- + this.map.centerAndZoom(this.point, this.zoomLv);/ a) |' x4 |( [' _+ }7 Z6 R
-
- |$ B3 z% {+ T& k, m- `6 L - // Double tap on the screen will hide the search widget.
2 F+ r) j) B& Q8 i$ I7 h' T$ h, V: f - this.searchElement.style.display = "none";
* u+ y b- W) J8 T% _ - @@ -703,7 +747,38 @@
* m7 q; |. P9 a* |3 _ - this.controller.get("infopad").style.display = "none";
3 V, M* w6 q/ f7 W - }
' s8 M7 \( g. i) L9 k2 G) k7 j - },
! d' A& a/ J1 h. W5 u - -
6 U* X; r, Y8 C q' q0 c4 i, e - +- b8 [6 a1 B, U; e- Z) J1 M
- + handleDragMapStart : function(event) { X: d: \6 c+ c9 f
- + this.getDragStartPixel(event.down.x, event.down.y);% _5 O. l/ g+ Z( i' o. |: V
- + },
( T F3 r) X! K, Z - +) W O4 a# V2 k8 q6 G) a$ u8 b
- + handleDragingMap : function(event) {7 L& V2 u* Z- _) M
- + this.captureNewCenter(event.move.x, event.move.y);/ M$ I. \8 [% @6 h
- + },
: |) E* `+ L t! B - +
1 K: x( W: O6 a, K1 v - + handleDragMapEnd : function(event) {& o* \, P% A5 Y; J
- + clearTimeout(this.delayMapPanning);: w& Y& @4 {9 d% Z' v6 {
- + },5 [2 ~ i* O" B4 Q* `3 n: \
- +: ?" g8 k! F% m5 t6 S* ?
- + getDragStartPixel : function(x, y){" V0 O. x$ a, E4 K$ ]% m+ y4 z+ {& \! ^
- + this.dragStartCentX = this.map.pointToPixel(this.map.getCenter()).x;- \, v, L& k9 c- }1 x1 ^/ Z d$ |
- + this.dragStartCentY = this.map.pointToPixel(this.map.getCenter()).y;" c: @6 x( }0 J
- + this.initDragX = x;: D. V" t. T. T5 A: J! y& u% N
- + this.initDragY = y;
+ {: X3 w* u4 o) K& C - + },
0 `$ q; C! g) ~) ~ l - +0 T0 W8 j5 ^- s' Z3 a
- + delayMapPanning : function(){
. m# P5 q3 h! d& D3 Y - + this.map.panTo(this.point);* w7 @- t, m; N9 G+ R
- + },% X9 W9 q* Y/ T5 N) U1 e; N8 S7 o
- +6 E/ x# [& H& ?, f! _
- + captureNewCenter : function(x, y){9 ^. e5 [2 e; W3 b& j
- + delete this.point;
2 s* n) n* Y5 v. [ - + this.point = this.map.pixelToPoint(new BMap.Pixel(this.dragStartCentX + x - this.initDragX, this.dragStartCentY + y - this.initDragY));: y# H' Y- U' p1 y$ @6 h3 G6 X: N
- + this.LAT = this.point.lat;
6 i# i. u# m. N - + this.LON = this.point.lng; P# @4 F _: L8 ~2 \. m! X
- + this.delayMapPanning();& N# a* F) ]1 ]
- + },7 E2 J5 v8 {( y7 J0 v% ?3 N
- +
" h0 y9 {! ~& ~/ A2 D5 h; b% v - closeInfoWindow : function(T) {$ ~/ C% {+ [/ y( \; z
- // close info window in T seconds.
5 b% l% v- C8 i. S7 \$ M: H - setTimeout(this.map.closeInfoWindow(), T*1000);+ W: X- a4 f' A+ ?
- @@ -726,7 +801,9 @@& y5 w2 o8 D2 F' P% t! _$ X
- this.controller.stopListening(this.controller.document, "gesturechange", this.handleGestureChange);# r) R/ H9 B8 K+ X& W
- this.controller.stopListening(this.controller.document, "gestureend", this.handleGestureEnd);
# z7 s2 s- Z$ }4 N: d1 O* N, C - this.controller.stopListening(this.controller.document, Mojo.Event.tap, this.handleTap);
3 t4 _9 b8 n. ~% I { - - this.controller.stopListening(this.controller.get("infopad"), Mojo.Event.tap, function(event){ if (event.count == 3) this.controller.get("infopad").style.display = "none" }.bindAsEventListener(this) );
3 q+ _) n0 R5 t: F ]2 F* X. @2 x, | - + this.controller.stopListening(this.controller.document, Mojo.Event.dragging, this.handleDragingMap.bindAsEventListener(this));- X$ `* G+ r' y( N. A
- + this.controller.stopListening(this.controller.document, Mojo.Event.dragStart, this.handleDragMapStart.bindAsEventListener(this));) V& t% |) R& g7 R- }' ]
- + this.controller.stopListening(this.controller.document, Mojo.Event.dragEnd, this.handleDragMapEnd.bindAsEventListener(this));
4 |) u) @5 |0 t& _+ c - }
9 z/ ^, V# o$ v: f8 _/ w* \8 g& X - };+ z! T _* l) f/ F1 i% A( o
- }());
9 l8 z- p7 B" c) e# h! q, j/ h% I' a) g - \ No newline at end of file) g1 C8 v, y. O( O, h. t
- divilis@DIVILIS-GentooLinux /mnt/1T2 $
& k' p9 [, F8 b$ s2 `9 m
|
本帖子中包含更多资源
您需要 登录 才可以下载或查看，没有账号？加入我们
×
|
|Archiver|手机版|小黑屋|吹友吧
( 京ICP备05078561号 )
狗仔卡
显身卡
发表于 2011-8-23 01:20
发表于 2011-8-23 08:53
