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

## 组件环境

import { computed as b, openBlock as x, createBlock as y } from "vue";
import * as w from "echarts";
import g from "../BaseChart/index.vue.js";
import v from "../BaseChart/config.js";
const _ = {
  name: "HuBubble"
}, A = Object.assign(_, {
  props: {
    data: {
      type: Array,
      default: () => []
    },
    color: {
      // 自定义颜色
      type: Array,
      default: () => null
    },
    position: {
      // 点的位置
      type: Array,
      default: () => null
    }
  },
  setup(f) {
    const t = f, s = t.color ? { colors: t.color } : v, u = b(() => {
      const r = t.position || [
        // 气泡的位置点以及大小
        [30, 20],
        // 10:x的位置   20:y的位置  55：大小
        [32, 31],
        [35, 18],
        [28, 32],
        [32, 10],
        [27, 13],
        [25, 28],
        [35, 33],
        [24, 15],
        [29, 30],
        [29, 27],
        [30, 33]
      ], a = t.data.sort((e, o) => o.value - e.value), n = a.length;
      let p = a[0].value, i = a.at(-1).value, h = Math.ceil((p - i) / n), c = [];
      return a.forEach((e, o) => {
        let l = 110, m = n - Math.ceil((e.value - i) / h);
        l = l - m * 7;
        const d = s.colors[o] ? {
          color: new w.graphic.RadialGradient(0.4, 0.3, 1, [
            {
              offset: 0,
              color: s.colors[o] + "80"
            },
            {
              offset: 1,
              color: s.colors[o]
            }
          ])
        } : null;
        c.push({
          name: e.label,
          symbolSize: isNaN(l) ? 80 : l,
          // 大小
          value: [...r[o], e.value],
          itemStyle: d,
          symbolOffset: [-200, 0]
        });
      }), {
        legend: {
          show: !1
        },
        grid: {
          left: "8%",
          top: "10%"
        },
        label: {
          show: !0,
          color: "#fff",
          formatter: (e) => e.name
        },
        xAxis: {
          axisLine: {
            show: !1
          },
          axisTick: {
            show: !1
          },
          axisLabel: {
            show: !1
          },
          splitLine: {
            show: !1
          }
        },
        yAxis: {
          axisLine: {
            show: !1
          },
          axisTick: {
            show: !1
          },
          axisLabel: {
            show: !1
          },
          splitLine: {
            show: !1
          },
          scale: !0
        },
        series: [
          {
            name: "111",
            data: c,
            type: "scatter",
            label: {
              formatter: (e) => {
                const o = e.data;
                return [`{a| ${o.value[2]}}`, `{b|${o.name}}`].join(`
`);
              },
              rich: {
                a: {
                  fontFamily: "Akrobat-Bold, Akrobat",
                  color: "#fff",
                  fontWeight: "blod",
                  fontSize: 20,
                  align: "center"
                },
                b: {
                  color: "#C1C8D4",
                  fontSize: 12
                }
              }
            },
            emphasis: {
              focus: "series"
            }
          }
        ]
      };
    });
    return (r, a) => (x(), y(g, {
      ref: "baseChartRef",
      option: u.value
    }, null, 8, ["option"]));
  }
}), C = A;
export {
  C as default
};