@huyuchen/visual/dist/es/HuWordCloud/HuWordCloud.vue.js

## 组件环境

import { reactive as x, ref as h, onMounted as C, onBeforeUnmount as _, toRefs as M, openBlock as P, createElementBlock as w } from "vue";
import "./HuWordCloud.vue2.js";
import T from "../_virtual/_plugin-vue_export-helper.js";
const S = {
  name: "HuWordCloud"
}, z = Object.assign(S, {
  props: {
    hotWord: {
      type: Array,
      default: () => []
    }
  },
  setup(i) {
    const s = i, t = x({
      wordArr: [],
      timer: null,
      resetTime: 10,
      ContainerSize: "",
      wordCloudRef: h(null)
    });
    C(() => {
      c();
    });
    const c = () => {
      l(), m(), n();
    }, l = () => {
      const o = [];
      s.hotWord.forEach((e) => {
        const r = document.createElement("span");
        r.style.position = "relative", r.style.display = "inline-block", r.style.color = a(), r.style.fontSize = d(15, 30) + "px", r.innerHTML = e, r.local = {
          position: {
            // 位置
            x: 0,
            y: 0
          },
          direction: {
            // 方向 正数往右 负数往左
            x: 1,
            y: 1
          },
          velocity: {
            // 每次位移初速度
            x: -0.5 + Math.random(),
            y: -0.5 + Math.random()
          }
        }, t.wordCloudRef.appendChild(r), o.push(r);
      }), t.wordArr = o;
    }, a = () => "rgb(" + [
      Math.round(Math.random() * 255),
      Math.round(Math.random() * 255),
      Math.round(Math.random() * 255)
    ].join(",") + ")", d = (o, e) => {
      const r = e - o + 1;
      return Math.floor(Math.random() * r + o);
    }, n = () => {
      t.resetTime < 100 && (t.resetTime = t.resetTime + 1, t.timer = requestAnimationFrame(n.bind(this)), t.resetTime = 0), f();
    }, f = () => {
      t.wordArr.forEach((o) => {
        (o.local.realPos.minx + o.local.position.x < t.ContainerSize.leftPos.x || o.local.realPos.maxx + o.local.position.x > t.ContainerSize.rightPos.x) && (o.local.direction.x = -o.local.direction.x), (o.local.realPos.miny + o.local.position.y < t.ContainerSize.leftPos.y || o.local.realPos.maxy + o.local.position.y > t.ContainerSize.rightPos.y) && (o.local.direction.y = -o.local.direction.y), o.local.position.x += o.local.velocity.x * o.local.direction.x, o.local.position.y += o.local.velocity.y * o.local.direction.y, o.style.transform = "translateX(" + o.local.position.x + "px) translateY(" + o.local.position.y + "px)";
      });
    }, m = () => {
      t.wordArr.forEach((o) => {
        o.local.realPos = {
          minx: o.offsetLeft,
          maxx: o.offsetLeft + o.offsetWidth,
          miny: o.offsetTop,
          maxy: o.offsetTop + o.offsetHeight
        };
      }), t.ContainerSize = p();
    }, p = () => {
      const o = t.wordCloudRef;
      return {
        leftPos: {
          // 容器左侧的位置和顶部位置
          x: o.offsetLeft,
          y: o.offsetTop
        },
        rightPos: {
          // 容器右侧的位置和底部位置
          x: o.offsetLeft + o.offsetWidth,
          y: o.offsetTop + o.offsetHeight
        }
      };
    };
    _(() => {
      cancelAnimationFrame(t.timer);
    });
    const { wordCloudRef: y } = M(t);
    return (o, e) => (P(), w("div", {
      class: "wordCloud",
      ref_key: "wordCloudRef",
      ref: y
    }, null, 512));
  }
}), R = /* @__PURE__ */ T(z, [["__scopeId", "data-v-f3c120e8"]]);
export {
  R as default
};