Nelze vybrat více než 25 témat Téma musí začínat písmenem nebo číslem, může obsahovat pomlčky („-“) a může být dlouhé až 35 znaků.

KeyboardRoaming.js 4.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186
  1. /**
  2. * @Author: Caven
  3. * @Date: 2021-06-08 20:41:51
  4. */
  5. import { Cesium } from '@dc-modules/namespace'
  6. class KeyboardRoaming {
  7. constructor(viewer) {
  8. this._viewer = viewer
  9. this._enable = false
  10. this._moveRate = 100.0
  11. this._rotateRate = 0.01
  12. this._flags = {
  13. moveForward: false,
  14. moveBackward: false,
  15. moveUp: false,
  16. moveDown: false,
  17. moveLeft: false,
  18. moveRight: false,
  19. turnLeft: false,
  20. turnRight: false
  21. }
  22. }
  23. set enable(enable) {
  24. if (this._enable === enable) {
  25. return this
  26. }
  27. if (this._viewer.scene.mode !== Cesium.SceneMode.SCENE3D) {
  28. return this
  29. }
  30. this._enable = enable
  31. this._enable ? this._bindEvent() : this._unbindEvent()
  32. return this
  33. }
  34. get enable() {
  35. return this._enable
  36. }
  37. set moveRate(moveRate) {
  38. this._moveRate = moveRate
  39. return this
  40. }
  41. get moveRate() {
  42. return this._moveRate
  43. }
  44. set rotateRate(rotateRate) {
  45. this._rotateRate = rotateRate
  46. return this
  47. }
  48. get rotateRate() {
  49. return this._rotateRate
  50. }
  51. /**
  52. *
  53. * @private
  54. */
  55. _bindEvent() {
  56. let canvas = this._viewer.scene.canvas
  57. canvas.setAttribute('tabindex', '0')
  58. canvas.addEventListener('click', this._onClick.bind(this), false)
  59. this._viewer.clock.onTick.addEventListener(this._onTick, this)
  60. document.addEventListener('keydown', this._onKeydown.bind(this), false)
  61. document.addEventListener('keyup', this._onKeyup.bind(this), false)
  62. }
  63. /**
  64. *
  65. * @private
  66. */
  67. _unbindEvent() {
  68. Object.keys(this._flags).forEach(key => {
  69. this._flags[key] = false
  70. })
  71. let canvas = this._viewer.scene.canvas
  72. canvas.removeAttribute('tabindex')
  73. canvas.removeEventListener('click', this._onClick, false)
  74. this._viewer.clock.onTick.removeEventListener(this._onTick, this)
  75. document.removeEventListener('keydown', this._onKeydown, false)
  76. document.removeEventListener('keyup', this._onKeyup, false)
  77. }
  78. /**
  79. *
  80. * @param e
  81. * @returns {undefined}
  82. * @private
  83. */
  84. _getFlagForKeyCode(e) {
  85. let flag = undefined
  86. switch (e.keyCode) {
  87. case 'W'.charCodeAt(0):
  88. case 38:
  89. if (e.shiftKey) {
  90. flag = 'moveUp'
  91. } else {
  92. flag = 'moveForward'
  93. }
  94. break
  95. case 'S'.charCodeAt(0):
  96. case 40:
  97. if (e.shiftKey) {
  98. flag = 'moveDown'
  99. } else {
  100. flag = 'moveBackward'
  101. }
  102. break
  103. case 'A'.charCodeAt(0):
  104. flag = 'moveLeft'
  105. break
  106. case 'D'.charCodeAt(0):
  107. flag = 'moveRight'
  108. break
  109. case 'Q'.charCodeAt(0):
  110. flag = 'turnLeft'
  111. break
  112. case 'E'.charCodeAt(0):
  113. flag = 'turnRight'
  114. break
  115. default:
  116. break
  117. }
  118. return flag
  119. }
  120. /**
  121. *
  122. * @private
  123. */
  124. _onClick() {
  125. let canvas = this._viewer.scene.canvas
  126. canvas.focus()
  127. }
  128. /**
  129. *
  130. * @param e
  131. * @private
  132. */
  133. _onKeydown(e) {
  134. let flag = this._getFlagForKeyCode(e)
  135. if (flag) {
  136. this._flags[flag] = true
  137. }
  138. }
  139. /**
  140. *
  141. * @param e
  142. * @private
  143. */
  144. _onKeyup(e) {
  145. Object.keys(this._flags).forEach(key => {
  146. this._flags[key] = false
  147. })
  148. }
  149. /**
  150. *
  151. * @private
  152. */
  153. _onTick() {
  154. let camera = this._viewer.scene.camera
  155. let cameraHeight = this._viewer.scene.globe.ellipsoid.cartesianToCartographic(
  156. camera.position
  157. ).height
  158. let moveRate = cameraHeight / this._moveRate
  159. let axis = Cesium.Cartesian3.clone(camera.position, new Cesium.Cartesian3())
  160. this._flags.moveForward && camera.moveForward(moveRate)
  161. this._flags.moveBackward && camera.moveBackward(moveRate)
  162. this._flags.moveUp && camera.moveUp(moveRate)
  163. this._flags.moveDown && camera.moveDown(moveRate)
  164. this._flags.moveLeft && camera.moveLeft(moveRate)
  165. this._flags.moveRight && camera.moveRight(moveRate)
  166. this._flags.turnLeft && camera.rotate(axis, -this._rotateRate)
  167. this._flags.turnRight && camera.rotate(axis, this._rotateRate)
  168. }
  169. }
  170. export default KeyboardRoaming