@vuemap/vue-amap/lib/packages/marker/MarkerCluster/MarkerCluster.vue2.js

高德地图vue3版本封装

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
require('../../../mixins/index.js');
require('../../../utils/index.js');
var buildHelper = require('../../../utils/buildHelper.js');
var useRegister = require('../../../mixins/useRegister.js');

var script = /* @__PURE__ */ vue.defineComponent({
  ...{
    name: "ElAmapMarkerCluster",
    inheritAttrs: false
  },
  __name: "MarkerCluster",
  props: buildHelper.buildProps({
    points: {
      type: Object,
      required: true
    },
    // 需要进行聚合显示的点数据
    gridSize: {
      type: Number
    },
    // 聚合计算时网格的像素大小，默认60
    maxZoom: {
      type: Number
    },
    // 最大的聚合级别，大于该级别就不进行相应的聚合。默认值为 18，即小于 18 级的级别均进行聚合，18 及以上级别不进行聚合
    averageCenter: {
      type: Boolean,
      default: true
    },
    // 聚合点的图标位置是否是所有聚合内点的中心点。默认为 true。数据中如果含有权重值，以权重高的点为中心进行聚合
    clusterByZoomChange: {
      type: Boolean,
      default: false
    },
    // 地图缩放过程中是否聚合。默认值 false。
    styles: {
      type: Array
    },
    // 指定聚合后的点标记的图标样式，可缺省，缺省时为默认样式
    renderClusterMarker: {
      type: Function
    },
    // 该方法用来实现聚合点的自定义绘制，由开发者自己实现，API 将在绘制每个聚合点的时候调用这个方法，可以实现聚合点样式的灵活设定，指定了 renderClusterMarker 后 styles 无效。
    renderMarker: {
      type: Function
    }
    // 该方法用来实现非聚合点的自定义绘制，由开发者自己实现，API 将在绘制每个非聚合点的时候调用这个方法
  }),
  emits: ["init"],
  setup(__props, { expose: __expose, emit: __emit }) {
    const emits = __emit;
    let $amapComponent;
    const { $$getInstance, parentInstance } = useRegister.useRegister((options, parentComponent) => {
      return new Promise((resolve) => {
        AMap.plugin(["AMap.MarkerCluster"], () => {
          const points = options.points;
          delete options.points;
          $amapComponent = new AMap.MarkerCluster(parentComponent, points, options);
          resolve($amapComponent);
        });
      });
    }, {
      emits,
      watchRedirectFn: {
        __points(value) {
          if ($amapComponent) {
            $amapComponent.setData(value);
          }
        }
      },
      destroyComponent() {
        if ($amapComponent && (parentInstance == null ? void 0 : parentInstance.$amapComponent)) {
          $amapComponent.setMap(null);
          $amapComponent = null;
        }
      }
    });
    __expose({
      $$getInstance
    });
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createElementBlock("div");
    };
  }
});

exports.default = script;
//# sourceMappingURL=MarkerCluster.vue2.js.map