Boundary.vue 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <template>
  2. <div v-if="paths.length">
  3. <bm-polygon
  4. v-for="(path, index) of paths"
  5. :key="index"
  6. :path="path"
  7. :stroke-color="strokeColor"
  8. :stroke-weight="strokeWeight"
  9. :stroke-opacity="strokeOpacity"
  10. :stroke-style="strokeStyle"
  11. :fill-opacity="fillOpacity"
  12. :fill-color="fillColor"
  13. :mass-clear="massClear"
  14. :clicking="clicking"
  15. @click="$emit('click', $event)"
  16. @dblclick="$emit('dblclick', $event)"
  17. @mousedown="$emit('mousedown', $event)"
  18. @mouseup="$emit('mouseup', $event)"
  19. @mouseout="$emit('mouseout', $event)"
  20. @mouseover="$emit('mouseover', $event)"
  21. @remove="$emit('remove', $event)"
  22. />
  23. </div>
  24. </template>
  25. <script>
  26. import BmPolygon from '../overlays/Polygon.vue'
  27. import commonMixin from '../base/mixins/common.js'
  28. // import abstractMixin from '../base/mixins/abstract.js'
  29. export default {
  30. mixins: [
  31. commonMixin('abstract')
  32. ],
  33. props: ['name', 'strokeColor', 'strokeWeight', 'strokeOpacity', 'strokeStyle', 'fillColor', 'fillOpacity', 'massClear', 'clicking'],
  34. data () {
  35. return {
  36. paths: []
  37. }
  38. },
  39. components: {
  40. BmPolygon
  41. },
  42. watch: {
  43. name () {
  44. this.reload()
  45. }
  46. },
  47. methods: {
  48. load () {
  49. const {BMap, name} = this
  50. const bd = new BMap.Boundary()
  51. bd.get(name, data => {
  52. this.paths = data.boundaries.map(boundary => (boundary || []).split(';')
  53. .map(point => (([lng, lat]) => ({lng, lat}))(point.split(',').map(p => +p))))
  54. })
  55. }
  56. }
  57. }
  58. </script>