@iwusong/datav-vue3/dist/cjs/components/decoration-10/index.js

Vue3 large screen data display component library

"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),y=require("../../hooks/useResize.js"),V=require("../../hooks/useUuid.js"),$=require("../../utils/common.js"),k=require("../../utils/decoration.js"),z=require("../../utils/styled.js");require("lodash-es");require("../../utils/logger.js");const v=z.styled.div`
  width: 100%;
  height: 100%;
  display: flex;
`("decoration-10"),p=["#00c2ff","rgba(0, 194, 255, 0.3)"],q=$.withInstall(t.defineComponent({name:"Decoration10",props:k.createColorProps(),setup(f,{expose:m}){const{autoBindRef:N,refreshLayoutSize:b,domSize:h}=y.useResize();m({refreshLayoutSize:b});const l=V.useUuid(),o=`d10ani${l.id}1`,n=`d10ani${l.id}2`,s=`d10ani${l.id}3`,d=`d10ani${l.id}4`,u=`d10ani${l.id}5`,c=`d10ani${l.id}6`,r=`d10ani${l.id}7`;return()=>{const{width:e,height:a}=h,{color:g}=f,i=$.mergeColor(p,g);return t.createVNode(v,{ref:N},{default:()=>[t.createVNode("svg",{width:e,height:a},[t.createVNode("polyline",{stroke:i[1],"stroke-width":"2",points:`0, ${a/2} ${e}, ${a/2}`},null),t.createVNode("polyline",{stroke:i[0],"stroke-width":"2",points:`5, ${a/2} ${e*.2-3}, ${a/2}`,"stroke-dasharray":`0, ${e*.2}`,fill:"freeze"},[t.createVNode("animate",{id:n,attributeName:"stroke-dasharray",values:`0, ${e*.2};${e*.2}, 0;`,dur:"3s",begin:`${o}.end`,fill:"freeze"},null),t.createVNode("animate",{attributeName:"stroke-dasharray",values:`${e*.2}, 0;0, ${e*.2}`,dur:"0.01s",begin:`${r}.end`,fill:"freeze"},null)]),t.createVNode("polyline",{stroke:i[0],"stroke-width":"2",points:`${e*.2+3}, ${a/2} ${e*.8-3}, ${a/2}`,"stroke-dasharray":`0, ${e*.6}`},[t.createVNode("animate",{id:d,attributeName:"stroke-dasharray",values:`0, ${e*.6};${e*.6}, 0`,dur:"3s",begin:`${s}.end + 1s`,fill:"freeze"},null),t.createVNode("animate",{attributeName:"stroke-dasharray",values:`${e*.6}, 0;0, ${e*.6}`,dur:"0.01s",begin:`${r}.end`,fill:"freeze"},null)]),t.createVNode("polyline",{stroke:i[0],"stroke-width":"2",points:`${e*.8+3}, ${a/2} ${e-5}, ${a/2}`,"stroke-dasharray":`0, ${e*.2}`},[t.createVNode("animate",{id:c,attributeName:"stroke-dasharray",values:`0, ${e*.2};${e*.2}, 0`,dur:"3s",begin:`${u}.end + 1s`,fill:"freeze"},null),t.createVNode("animate",{attributeName:"stroke-dasharray",values:`${e*.2}, 0;0, ${e*.3}`,dur:"0.01s",begin:`${r}.end`,fill:"freeze"},null)]),t.createVNode("circle",{cx:"2",cy:a/2,r:"2",fill:i[1]},[t.createVNode("animate",{id:o,attributeName:"fill",values:`${i[1]};${i[0]}`,begin:`0s;${r}.end`,dur:"0.3s",fill:"freeze"},null)]),t.createVNode("circle",{cx:e*.2,cy:a/2,r:"2",fill:i[1]},[t.createVNode("animate",{id:s,attributeName:"fill",values:`${i[1]};${i[0]}`,begin:`${n}.end`,dur:"0.3s",fill:"freeze"},null),t.createVNode("animate",{attributeName:"fill",values:`${i[1]};${i[1]}`,dur:"0.01s",begin:`${r}.end`,fill:"freeze"},null)]),t.createVNode("circle",{cx:e*.8,cy:a/2,r:"2",fill:i[1]},[t.createVNode("animate",{id:u,attributeName:"fill",values:`${i[1]};${i[0]}`,begin:`${d}.end`,dur:"0.3s",fill:"freeze"},null),t.createVNode("animate",{attributeName:"fill",values:`${i[1]};${i[1]}`,dur:"0.01s",begin:`${r}.end`,fill:"freeze"},null)]),t.createVNode("circle",{cx:e-2,cy:a/2,r:"2",fill:i[1]},[t.createVNode("animate",{id:r,attributeName:"fill",values:`${i[1]};${i[0]}`,begin:`${c}.end`,dur:"0.3s",fill:"freeze"},null),t.createVNode("animate",{attributeName:"fill",values:`${i[1]};${i[1]}`,dur:"0.01s",begin:`${r}.end`,fill:"freeze"},null)])])]})}}}));exports.Decoration10=q;