Label.vue 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. <script>
  2. import commonMixin from '../base/mixins/common.js'
  3. import bindEvents from '../base/bindEvent.js'
  4. import { createPoint, createSize } from '../base/factory.js'
  5. import { deleteEmptyKey } from '../base/util.js'
  6. export default {
  7. name: 'bm-label',
  8. render() { },
  9. mixins: [commonMixin('overlay')],
  10. props: {
  11. content: {
  12. type: String
  13. },
  14. title: {
  15. type: String
  16. },
  17. offset: {},
  18. position: {},
  19. labelStyle: {},
  20. zIndex: {
  21. type: Number,
  22. default: 0
  23. },
  24. massClear: {
  25. type: Boolean,
  26. default: true
  27. }
  28. },
  29. watch: {
  30. content(val) {
  31. this.originInstance.setContent(val)
  32. },
  33. title(val) {
  34. this.originInstance.setTitle(val)
  35. },
  36. 'offset.width'(val, oldVal) {
  37. const { BMap } = this
  38. if (val.toString() !== oldVal.toString()) {
  39. this.originInstance.setOffset(createSize(BMap, { width: val, height: this.offset.height }))
  40. }
  41. },
  42. 'offset.height'(val, oldVal) {
  43. const { BMap } = this
  44. if (val.toString() !== oldVal.toString()) {
  45. this.originInstance.setOffset(createSize(BMap, {
  46. width: this.offset.width,
  47. height: val
  48. }))
  49. }
  50. },
  51. 'position.lng'(val, oldVal) {
  52. const { BMap } = this
  53. const lng = val
  54. if (val.toString() !== oldVal.toString() && lng >= -180 && lng <= 180) {
  55. this.originInstance.setPosition(createPoint(BMap, { lng, lat: this.position.lat }))
  56. }
  57. },
  58. 'position.lat'(val, oldVal) {
  59. const { BMap } = this
  60. const lat = val
  61. if (val.toString() !== oldVal.toString() && lat >= -74 && lat <= 74) {
  62. this.originInstance.setPosition(createPoint(BMap, { lng: this.position.lng, lat }))
  63. }
  64. },
  65. labelStyle: {
  66. handler(val) {
  67. this.originInstance.setStyle(val)
  68. },
  69. deep: true
  70. },
  71. zIndex(val) {
  72. this.originInstance.setZIndex(val)
  73. },
  74. massClear(val) {
  75. val ? this.originInstance.enableMassClear() : this.originInstance.disableMassClear()
  76. }
  77. },
  78. methods: {
  79. load() {
  80. const { BMap, map, content, title, offset, position, labelStyle, zIndex, massClear, $parent } = this
  81. let labelOption = {
  82. offset: createSize(BMap, offset),
  83. position: createPoint(BMap, position),
  84. enableMassClear: massClear
  85. };
  86. deleteEmptyKey(labelOption);
  87. const overlay = new BMap.Label(content, labelOption)
  88. this.originInstance = overlay
  89. try {
  90. $parent.originInstance.setLabel(overlay)
  91. } catch (e) {
  92. map.addOverlay(overlay)
  93. }
  94. title && overlay.setTitle(title)
  95. labelStyle && overlay.setStyle(labelStyle)
  96. zIndex && overlay.setZIndex(zIndex)
  97. bindEvents.call(this, overlay)
  98. }
  99. }
  100. }
  101. </script>